Web

New in v0.47.

This category of extensions are useful for preparing SVG drawing for use in the Web. At the moment there is one subcatagory, JavaScript with two extensions. The first allows events linked to one object (mouse over, clicking on, etc.) to control the attributes of another object. The second allows events linked to one object to transmit that object's attributes to another. These extensions embed JavaScript into the SVG file. The JavaScript comes from the InkWeb package. To function, the code require a JavaScript-enabled browser (native support in Firefox, Opera, Safari, or Chrome, support via plug-in for Internet Explorer).

Set Attributes

New in v0.47.

This extension creates the JavaScript so that an action (clicking on, mouse passing over, etc.) with one object changes the attributes of another object. The list of attributes to change is entered, separated by spaces, in the Attribute to set entry box (e.g., fill stroke stroke-width). The action that will cause the change is set in the When the set must be done? drop-down menu. The list of new values is entered, separated by spaces, in the Value to set entry box. The list of values must match the Attributes to set line (e.g., green black 2px). The next option sets if this action should come before, after, or replace any previously defined actions. The final option determines in the case where more than two objects are selected, if the first selected object controls all the other selected objects or if the last selected object is controlled by actions on all the other selected objects.

Set Attributes dialog.
The Set Attributes dialog.
An example of using the Set Attributes extension to generate JavaScript code. The two objects on the left, the red square and blue circle, were selected in that order. Then the Set Attributes extension was called with the following values: Attribute to set: fill stroke stroke-width, When the set must be done?: on click, Value to set: green black 5px. In a JavaScript enabled browser, clicking on the red square will turn the color of the circle green and set the width of the stroke to 5px as shown on the right.

Transmit Attributes

New in v0.47.

This extension creates the JavaScript so that an action (clicking on, mouse passing over, etc.) with one object changes specified attributes of another object to have the same value as the first. The list of attributes to change is entered, separated by spaces, in the Attribute to transmit entry box (e.g., fill stroke stroke-width). The action that will cause the change is declared in the When to transmit drop-down menu. The next option specifies if this action should come before, after, or replace any previously defined actions. The final option determines in the case where more than two objects are selected, if the first selected object controls all the other selected objects or if the last selected object is controlled by actions on all the other selected objects.

Transmit Attributes dialog.
The Transmit Attributes dialog.
An example of using the Transmit Attributes extension to generate JavaScript code. The two objects on the left, the red square and blue circle, were selected in that order. Then the Transmit Attributes extension was called with the following values: Attribute to transmit: fill, When the transmit must be done?: on click, In a JavaScript enabled browser, clicking on the red square will turn the color the circle red as shown on the right.