Scalable vector graphics: "very cool stuff".
The "native" language for scripting SVG--that is, for animating an SVG document by run-time modification of its node tree with SVGDOM--is JavaScript. Steve Ball has been thinking about the desirability of binding Tcl to SVGDOM (perhaps by way of Batik [L1 ] and Jacl?).
DDG - 2021-08-26 - To my surprise I could not find a Tcl SVG creator yet. So I decided to create my own for a tutorial on how to use images in the pandoc-tcl-filter. If there are already existing SVG creators, please give me a hint. You can find the code for the SVG creator here in this Readme: https://htmlpreview.github.io/?https://github.com/mittelmark/DGTcl/blob/master/pandoc-tcl-filter/Readme.html It is using the Thingy: a one-liner OO system just for curiosity.
RS: Many of SVG's items have a very close correspondence to canvas items, so one might consider using SVG for "serializing" a canvas content to XML, and loading canvas contents from XML... Consider this snippet:
<polygon fill="yellow" stroke="none"
points="350 75, 379 161, 469 161, 397 215,
423 301, 350 250, 277 301, 303 215,
231 161, 321 161"
transform="scale(.5)" />With some string manipulation (and determining the center from the bounding box, for scaling) this could easily be transformed into two canvas commands.
An elaborate canvas to SVG dumper is at [L2 ].
Read (svg2can) and write (can2svg) SVG files (in Tcl) are available in Coccinella communication tool.
DKF: SVG is really very close indeed to the Java2D API, and even more especially to the base model used in PostScript and Acrobat (PDF). Not surprising really, given that they all came out of Adobe...
Rolf Ade This is the start of a list of SVG features, that have no native support by the canvas (some of them could eventually be simulated).
Lars H: Conversely, I've found that SVG seems to lack a counterpart of the -anchor option of a canvas text item, which severely complicates mixing text and graphics. (In the horizontal direction, there is an attribute which does what one wants, although technically it takes its "left" and "right" from the directionality of the text. In the vertical direction there is no direct counterpart; it should in principle be possible to emulate vertical anchoring using baseline alignment and font size changes, but no browser did that correctly.)
AK: IIRC the GTk canvas widget was derived from the Tk Canvas, and enhanced. I believe it does transparency. We might want to have a look at it and see what features we can 'steal' back.
roger - 2010-04-03 05:47:21
SMIL is the native language for animating SVG. DOM-access is being used for more complex interactions.
SVG is intended to replace PDF and PostScript, see the sub-specification SVG-Print: http://lists.w3.org/Archives/Public/public-svg-print/
The aim of SVG-Print is to create an universal printing mechanism from any computerized device (mobile device) to every printer.
Adobe® and Microsoft® also work on similar XML-based specifications, too.
The counterpart for the Tk text window and canvas text object is <flowRoot> from the SVG 1.2 specification. --It may be possible to convert a Tk text window into a SVG flow element.
The SVG 1.1 text object is graphical text, not supporting text flow, like Tk's text elements do. An anchor attribute is superfluous within flowroot, since the alignment is being defined by the graphical object, used as the flow region. — Lars H: You seem to confuse -anchor with -justify; the former is needed also for single line text. What I found no way of getting done with SVG 1.1 (there wasn't even any main 1.2 draft at the time) was to center an "R" or "I" label within a square (without having to know the exact font metrics in advance, which circumstances would not permit). "—roger re-read: The counterpart for Tk text ... is <flowRoot>"
The Tk canvas window is definitely not close to SVG. SVG is a powerful visualization system, supporting viewports, transformations, gradients, transparency...
tkpath 0.3 introduced groups, and thus made a big step toward viewport and full transformation support.
Jeszra converts SVG into Tcl/Tk code and an entire Tk-GUI into SVG (including tkpath 0.2, 03 and the general stuff from tkzinc), as you can see throughout Jeszra's own documentation: http://jeszra.sourceforge.net/
roger - 2010-04-06 08:56:31
Converting Tk text objects to SVG 1.1 text requires to "synchronize" anchor and alignment; this is necessary because font-substitutions are very likely to occur with SVG-viewers.
CMcC - 2010-04-13 06:24:01
I've written a Tcl OO object hierarchy to parse, manipulate, and generate SVG, TclSVG
errordeveloper - 2010-07-18 15:33:26
simple list-in/object-out with tDOM an no extra packages:
$BROWSER http://github.com/errordeveloper/svgdom
git clone git:://github.com/errordeveloper/svgdom.git
i will keep this updated as it goes,
add CDATA JavaScript and SVG Parameters ..and may be SMIL
but it basically takes a list in and recursively adds tags and attributes
test it with say: "{{rect {x 10 y 25 width 100 height 250}} {rect {x 20 y 100 width 100 height 250}}}"
HaO 2019-09-16: With TIP507 , svg-support was added to tk8.7+. To get the same support on tk 8.6, use package tksvg by Auriocus.
With TIP545 , the options "-scaletoheight" and "-scaletowidth" were added to scale the image to a given height or width in pixels. This is handy for button icons.
Create an image with an svg image with the given height of 16 pixels:
% image create photo i1 -file c:/myimage/test.svg -format {svg -scaletoheight 16}
% pack [button .b1 -image i1]Now the button is scaled to 20 pixels in runtime:
% i1 configure -format {svg -scaletoheight 20}The button image is scaled.
Attention: the image file must be available, as it is read from disk again. So, if you remove the file c:/myimage/test.svg, the command will fail.
If this is an issue, load the image first into a variable and pass the data with the "-data" option to the image creation command.
The used svg implementation "svgnano" does not support text items. I paint my icons using InkScape as follows: To display text, first use the text tool to print the text. Then go to the path menu and select "transform object to path" with the shortcut "Shift-Control-C". After save, the text is visible within tclnano.
I discovered that PowerPoint can be a very effcient alternative way of creating/editing SVG images or icons.
How to edit existing SVG:
How to create new SVG:
Tipp #1: PowerPoint also writes the default empty slide as a white rectangle to the svg file. If you want SVGs with transparent background, than you need to write a small tcl script that will automatically loop through all SVGs files and modify the content by removing the white rectangle.
Tipp #2: Before starting to create icons in PPT, you should set the slide size to e.g. 16x16 cm and activate the grid with a distance of e.g. 1 cm.
Tipp #3: Since Tcl/Tk does not support text in SVGs, you need to convert text into shapes. In PowerPoint you write your text and then draw a rectangle round that text. Then you use a boolean operation under the format pane that will build the intersection of the text and the rectangle.
HaO 2022-09-19: CorelDraw uses styles in SVG, which are not supported by NanoSVG. There is a patch by magic Sergey to cure this, but it is not included in TCL PR103 .
So what to do? Edit the SVG file manually:
If you have in your SVG something like:
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:#005199}
]]>
</style>
</defs>
<g id="Ebene 1">
<g>
<path class="fil0" d="M7 524l1165 -352 1188 352 -1190 336 -1163 -336z"/>Then replace any appearence of class="fil0" by fill="005199". Then you may delete the defs part.
The result may be:
<g id="Ebene 1"> <g> <path fill="#005199" d="M7 524l1165 -352 1188 352 -1190 336 -1163 -336z"/>