![](https://secure.gravatar.com/avatar/07a6c834eade2c65bff829442e8c7cd3.jpg?s=120&d=mm&r=g)
On Wed, 26 Apr 2017 10:41:54 +0100 Mark Crutch <markc@...2744...> wrote:
On Wed, Apr 26, 2017 at 4:44 AM, Steve Litt <slitt@...2357...> wrote:
File->Document_properties->Scripting_tab
I've looked all over the web and all through my help->user manual and can't find anything about this. For one thing, I need to know how to give an embedded script a human-friendly name. I also need to know what to put in the content: Is it Javascript, and how does it differ from html based Javascript.
Anyone know of any documentation on this? Theoretically, I could creat a very simple clickable map exclusively in <svg>, without the containing <html>.
I don't know of any documentation on this, but it is something I plan to eventually cover in my tutorial series in Full Circle Magazine (see inkscapeforum.com for links to the previous 60 instalments!).
I have put a file up on my website to show you the basics, though: http://peppertop.com/interactive.svg
(tested on Firefox and Chrome on Linux, using the built-in developer consoles)
Notes:
- Yes, it's JavaScript, and it doesn't really differ from HTML based
JS much at all. The main differences are around interacting with the DOM, as you may have to use the namespace-aware XML methods, rather than the usual HTML versions. So in my example you can see I use getAttributeNS(), passing the Sodipodi namespace as the first parameter (the namespace itself is one of many included near the top of an Inkscape file if you open it in a text editor).
- You don't really need to give the embedded script itself a
user-friendly name - it's the functions within it that you'll want to name well.
- The fact that you can have multiple embedded scripts is a bit of a
red herring. You can get by with just one that contains multiple functions, if you want. Ultimately the browser just concatenates all the scripts when parsing anyway.
- As well as File > Document Properties > Scripting you'll also want
to use the Interactivity section of the Object Properties dialog (from the context menu on an object in your drawing).
The specific examples in my file are:
An alert that fires as soon as the script is executed.
Some JS (an alert) written directly on the onclick handler of the
red star.
- A common function (blue()) in the Document Properties > Scripting
tab, called from an onclick handler on the blue star.
- As above for the green star, but also passing the event (I had to
use "evt" for it to work), then logging that out to the console, as well as various other bits of information from the clicked object.
I hope that helps.
Your graphic is a self-explanatory proof of concept for all the different scripting methods. Thanks much!
SteveT
Steve Litt April 2017 featured book: Troubleshooting Techniques of the Successful Technologist http://www.troubleshooters.com/techniques