Create Drawings, or add notes to Images

create or annotate images and save as svg and png


WikiDrawPlugin uses SVG-edit (trunk svn from 29/09/2010 - pre2.6) to provide quick and easy drawing or annotation of images.

WARNING: editing not compatible with Internet Explorer - but viewing of the drawings works correctly

Syntax Rules

WIKIDRAW{"drawing"} -- displays a vector drawing that can be edited in the wiki

  • Encode character sequences in "string", by mapping characters (or sequences of characters) to an alternative character (or sequence of characters). This macro can be used to encode strings for use in URLs, to encode to HTML entities, to protect quotes, and for as many other uses as you can imagine.
  • Syntax: %WIKIDRAW{"string" annotate="image"}%
    Parameter Description Default
    "drawing" name of the drawing - specifies the location to save to - can be either "Web.SomeTopic" or "drawing" or (BROKEN "Web.Topic/drawing")
    where the first form saves the svg to the topic text, and the other saves to an attachment in the current topic, the third an attachment in the specified topic
    If you specify a drawing file that does not yet exist in your Wiki, the drawing is created the first time you save a drawing.
    must be set
    annotation="imagename" specifies an image that will be used as a background for your annotations "Web.SomeTopic" (picks the first attached image) or "image.png" (current topic) or "Web.Topic/image.jpg" (an attachemt to the specified topic)
    it will not be modified, and will not form part of the svg output.

If you omit either parameter, the Plugin attempts to do the right thing, but for now, this is experimental.

save drawing as attachment to current topic


save drawing to a 'WikiDrawForm' topic

WikiDraw also can save the svg source for the drawing as the text of a topic - allowing searching and hand editing of that source, while continuing to provide the wysiwyg editing facility.

Extra Plugin support.

If Foswiki:Extensions.ImagePlugin is installed and enabled, the default skin template will automatically use it to lay out the image and drawing.

Technical details

This plugin adds a ext-foswiki.js extension that over-rides the built in 'Save Image' SVG menu item with a save to foswiki handler, which generates a png version of the overlay, and sends that, and the svg source to foswiki.

The transparent overlay png is displayed in view mode, and the annotated image (if any) will be put behind it using the css background.

Known issues:

  1. it really doesn't like using svg dimensions other than 640x480 (I'e reported an [[][issue] for this, as its really painful when creating a drawing)
  2. hide the edit buttons for ie..
  3. _DEFAULT="Web.Topic/something" is very broken
  4. strikeone support
  5. comment support..
  6. wow. subtle bug. - using %!WIKIDRAW{Sandbox.SomeTopic}%, will find the first image attached to BASETOPIC, which might be a tad surprising.

features to be added?

  1. can we diff the svg's ?

Installation Instructions

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. Use "Find More Extensions" to get a list of available extensions. Select "Install".

If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See for more help.


Many thanks to the following sponsors for supporting this work:
  • TRIN, The Taxonomic Information Network for Australian National Biodiversity Research

Author(s): Foswiki:Main.SvenDowideit
Copyright: © 2010 and SVG-edit contributors and David Belais (pngIE)
License: GPL (Gnu General Public License) and Apache License 2.0 for SVG-edit
Release: 1.0.0
Version: 9700 (2010-10-24)
Change History:  
21 October 2010: initial public release
Dependencies: None
Home page:

Topic revision: r2 - 24 Oct 2010, AdminUser
This site is powered by FoswikiCopyright © by the contributing authors. All material on this site is the property of the contributing authors.
Ideas, requests, problems regarding Foswiki? Send feedback