<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"> <title></title> </head> <body bgcolor="#ffffff" text="#000000"> Hi Hilaire,<br> <br> Thanks for the additional detail. Now I see what you mean.<br> <br> I'm glad you found a way to translate your protocol to the one provided by the plugin.<br> <br> WRT the blue sine function, the old behavior can be added back, but (as it was) only at the Smalltalk level. The implementation is too complicated to make it worth to add it to the plugin. But in Smalltalk, we can add it back if you want.<br> <br> Thanks,<br> <br> On 5/27/2025 3:39 PM, Hilaire Fernandes via Cuis-dev wrote: <blockquote cite="mid:c0c9e364-2d79-4752-a234-53024d97516e@free.fr" type="cite"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <p><font size="4">So far, your implementation of VectorGraphics engine followed the SVG specification. I discovered that when I implemented the DrGeoSVGCanvas to render a DrGeo sketch to a SVG file. </font></p> <p><font size="4">Particularly in the style of the element, the dashArray attribute was of same nature in VG and SVG:</font></p> <p></p> <div style="background: none repeat scroll 0% 0% rgb(255, 255, 255); overflow: auto; width: auto; border-style: solid; border-color: gray; border-width: 0.1em 0.1em 0.1em 0.8em; padding: 0.1em 0.6em;"> <table> <tbody> <tr> <td> <pre style="margin: 0pt; line-height: 125%;"> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17</pre> </td> <td> <pre style="margin: 0pt; line-height: 125%;"><span style="color: rgb(0, 102, 187); font-weight: bold;">DrGSVGCanvas>>styleOf:</span> <span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">StrokeWidth:</span> <span style="color: rgb(153, 102, 51);">strokeWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">color:</span> <span style="color: rgb(153, 102, 51);">strokeColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">strokeDashArray:</span> <span style="color: rgb(153, 102, 51);">sda</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">fillColor:</span> <span style="color: rgb(153, 102, 51);">fillColor</span> <span style="color: rgb(136, 136, 136);">"</span> <span style="color: rgb(136, 136, 136);"> Apply style to a given element (node) </span> <span style="color: rgb(136, 136, 136);">"</span> <span style="color: rgb(153, 102, 51);">strokeWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNotNil:</span> [<span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(255, 0, 0); background-color: rgb(255, 170, 170);">#</span><span style="background-color: rgb(255, 240, 240);">'stroke-width'</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> <span style="color: rgb(153, 102, 51);">strokeWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">asString</span>]. <span style="color: rgb(153, 102, 51);">strokeColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNotNil:</span> [ <span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(170, 102, 0);">#stroke</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> (<span style="color: rgb(153, 102, 51);">strokeColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">isTransparent</span> <span style="color: rgb(0, 112, 32);">ifTrue:</span> [<span style="background-color: rgb(255, 240, 240);">'transparent'</span>] <span style="color: rgb(0, 112, 32);">ifFalse:</span> <span style="color: rgb(153, 102, 51);">strokeColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">hexHtml</span>)]. <span style="color: rgb(153, 102, 51);">sda</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNotNil:</span> [ <span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(255, 0, 0); background-color: rgb(255, 170, 170);">#</span><span style="background-color: rgb(255, 240, 240);">'stroke-dasharray'</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> (<span style="color: rgb(187, 0, 102); font-weight: bold;">String</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">streamContents:</span> [<span style="color: rgb(51, 51, 51);">:</span><span style="color: rgb(153, 102, 51);">s</span> <span style="color: rgb(51, 51, 51);">|</span> <span style="color: rgb(153, 102, 51);">sda</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">do:</span> [<span style="color: rgb(51, 51, 51);">:</span><span style="color: rgb(153, 102, 51);">e</span> <span style="color: rgb(51, 51, 51);">|</span> <span style="color: rgb(153, 102, 51);">s</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">store:</span> <span style="color: rgb(153, 102, 51);">e</span>] <span style="color: rgb(0, 102, 187); font-weight: bold;">separatedBy:</span> [ <span style="color: rgb(153, 102, 51);">s</span> <span style="color: rgb(0, 102, 187); font-weight: bold; ">space</span>]])]. <span style="color: rgb(136, 136, 136);">" sdao ifNotNil: [element attributeAt: #'stroke-dashoffset' put: sdao asString]."</span> <span style="color: rgb(153, 102, 51);">fillColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNotNil:</span> [ <span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(170, 102, 0);">#fill</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> <span style="color: rgb(153, 102, 51);">fillColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">hexHtml</span>. <span style="color: rgb(153, 102, 51);">fillColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">isOpaque</span> <span style="color: rgb(0, 112, 32);">ifFalse:</span> [<span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(255, 0, 0); background-color: rgb(255, 170, 170);">#</span><span style="background-color: rgb(255, 240, 240);">'fill-opacity'</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> <span style="color: rgb(153, 102, 51);">fillColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">alpha</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">asString</span>] ] <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNil:</span> [<span style="color: rgb(153, 102, 51);">element</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">attributeAt:</span> <span style="color: rgb(170, 102, 0);">#fill</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">put:</span> <span style="background-color: rgb(255, 240, 240);">'none'</span>] </pre> </td> </tr> </tbody> </table> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix">From my understanding, now your implementation differs in the way dashes are represented in SVG. It is just an observation not a complain. </div> <div class="moz-cite-prefix">To minimize my code change, I implemented a backward compatible method in AbstractVectorCanvas, it converts my dash (composed of only two numbers) from the former format to your new format:<br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"> <div style="background: none repeat scroll 0% 0% rgb(255, 255, 255); overflow: auto; width: auto; border-style: solid; border-color: gray; border-width: 0.1em 0.1em 0.1em 0.8em; padding: 0.1em 0.6em;"> <table> <tbody> <tr> <td> <pre style="margin: 0pt; line-height: 125%;"> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16</pre> </td> <td> <pre style="margin: 0pt; line-height: 125%;"><span style="color: rgb(0, 102, 187); font-weight: bold;">strokeWidth:</span> <span style="color: rgb(153, 102, 51);">borderWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">color:</span> <span style="color: rgb(153, 102, 51);">borderColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">strokeDashArray:</span> <span style="color: rgb(153, 102, 51);">dashedBorder</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">do:</span> <span style="color: rgb(153, 102, 51);">pathCommandsBlock</span> <span style="color: rgb(136, 136, 136);">"</span> <span style="color: rgb(136, 136, 136);">dashedBorder = array of 2 elements, for example #(1 6), one pixel on, 6 off </span> <span style="color: rgb(136, 136, 136);">"</span> <span style="color: rgb(153, 102, 51);">dashedBorder</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNil:</span> [ <span style="color: rgb(0, 112, 32);">self</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">strokeWidth:</span> <span style="color: rgb(153, 102, 51);">borderWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">color:</span> <span style="color: rgb(153, 102, 51);">borderColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">do:</span> <span style="color: rgb(153, 102, 51);">pathCommandsBlock</span>] <span style="color: rgb(0, 102, 187); font-weight: bold;">ifNotNil:</span> [ <span style="color: rgb(0, 112, 32);">self</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">strokeWidth:</span> <span style="color: rgb(153, 102, 51);">borderWidth</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">color:</span> <span style="color: rgb(153, 102, 51);">borderColor</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">dashedStrokeBits:</span> (<span style="color: rgb(102, 0, 238); font-weight: bold;">2</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">raisedTo:</span> <span style="color: rgb(153, 102, 51);">dashedBorder</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">first</span>) <span style="color: rgb(0, 102, 187); font-weight: bold;">-</span> <span style="color: rgb(102, 0, 238); font-weight: bold;">1</span> <span style="color: rgb(0, 102, 187); font-weight: bold;"><<</span> <span style="color: rgb(153, 102, 51);">dashedBorder</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">second</span> <span style="color: rgb(0, 102, 187); font-weight: bold;">do:</span> <span style="color: rgb(153, 102, 51);">pathCommandsBlock</span> ] </pre> </td> </tr> </tbody> </table> </div> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix">It works pretty well and keep DrGSVGCavnas working. It does not work well for my Locus Morph though. A locus is a collection of points connected by line. See the below the blue sinus curve should be dashed. Of course it is related to the way the locus sample are computed, some samples may be too close to each other to see the dash painted.</div> <div class="moz-cite-prefix"><b>Surprisingly for me, this problem was not present in your Smalltalk previous implementation of dash. </b><br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <img moz-do-not-send="false" src="cid:part1.01080500.04040501@cuis.st" alt="" height="522" width="1402"> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix">When playing a bit with the Morph Locus parameters to alter the sampling of the locus, we can reveal what is going on, see below.<br> </div> <div class="moz-cite-prefix"> <div class="moz-cite-prefix">All this is not a bug in your implementation, but your previous implementation could hide this problem related to sampling at a dynamic rate, and it was pretty cool.</div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> </div> <div class="moz-cite-prefix"><img src="cid:part2.06010207.03060300@cuis.st" alt=""></div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <br> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix"><br> </div> <div class="moz-cite-prefix">Le 27/05/2025 à 17:53, Juan Vuletich a écrit :<br> </div> <blockquote type="cite" cite="mid:6835DFEA.4050700@cuis.st">Not sure what you mean. Can you give an example? Is there some quick test I can do that works without the updates?<br> <br> Thanks,<br> </blockquote> <pre class="moz-signature" cols="72">-- <a moz-do-not-send="true" class="moz-txt-link-freetext" href="http://mamot.fr/@drgeo">http://mamot.fr/@drgeo</a></pre> </blockquote> <br> <br> <pre class="moz-signature" cols="72">-- Juan Vuletich cuis.st github.com/jvuletich researchgate.net/profile/Juan-Vuletich independent.academia.edu/JuanVuletich patents.justia.com/inventor/juan-manuel-vuletich linkedin.com/in/juan-vuletich-75611b3 twitter.com/JuanVuletich</pre> </body> </html>