Ausnahmsweise keine deutsche Version

David Adams wrote a short novel on „D3.js Wow. Some notes on SVG, D3, and data visualizations“. I read it here: „4D_Tech Digest, Vol 103, Issue 35“. Sorry no link via Message-ID. Find it, read it.

I agree with him about SVG in general. Further reading on the DDDD-site:

• How to think SVG, in 4D terms
• Playing with SVG: Charts
• SVG: display chart info
• Place a SVG inside a SVG
• Quicklook für 4Dbase-Pakete mit Versionsnummer

4D support of SVG is pretty useful, although not complete.

David mentioned „… SVG nodes have a DOM and actions (hover, mouseover, click, etc.) can be attached to nodes. …“. 4D didn’t support that in 2010 and this is still true as of 4D V15 64-Bit Preview.

The included SVG-shapes on the right support hover. Just hover your mouse over the circles and watch transparency and borders to see the difference. Download the SVG and try the same on a 4D-form.

You could use a 4D webarea to display the SVG. Works properly on Mac. Even on Windows 10, where Edge does a great job of supporting SVG, you need to use the included WebKit-webarea. Some explanation by Thomas Maul from 4D forum:

The Web Area is not using Internet Explorer or Edge (or default browser), but the „Web Browser Control“ (see Microsoft documentation for details).

While the Web Browser Control shares code with MS IE (maybe now with Edge, you need to check this with Microsoft), it is NOT the latest feature set. They share security patches but not features.

…

I recommend not to write 4D code using DOM XML-commands to create SVGs. Not at all. Use 4D SVG-component. Pretty well done!

Highly recommended both for drawing and inspecting SVGs: Sketch from Bohemian Coding. Worth every penny. I create my sketches with Sketch, export them into SVG and check using a texteditor, both BBEdit and Coda recommended, and add 4D tags for dynamic contents. When done, I run my 4D code. PROCESS 4D TAGS is your friend.

SVGs created from my 4D code do need enhancements until pleasing. My workflow: SVG_SAVE_AS_TEXT and check inside Sketch. Sketch helps you understand your code graphically and hierarchically. Next run will include a lot of SVG_SET_ID to even better inspect the hierarchy.

Go read David Adams!

4D EVAL will earn friend-status soon, thinking beyond documentation.