SVG-Edit plugin

Download and install the plugin using the Plugin Manager using the URL given above. Refer to Plugins on how to install plugins manually.

You can also copy and paste 3 files from this page to your lib/plugins/svgedit/ directory..

• Do not close <object> tag using shorthand (2011/03/26 20:38)
• Added svg-edit/ to .gitignore (2010/11/25 05:49)
• Now resolving relative links to namespaces (2010/08/09 13:24)
• nicer links + titles (2010/06/28 13:19)
• added screencast video of some old version (2010/06/22 20:46)
• added svg-edit links to README (2010/06/22 20:40)
• reuploaded screenshot (2010/06/20 05:22)
• mentioned non-GIT conributor (2010/06/20 05:18)

If you want to see how awesome it is, look here: http://www.youtube.com/watch?v=M-QW6a1ZFHA (the video is from the beta version. It works better now.) The biggest problem with this plugin is that it needs a modern browser. At this time it works best with WebKit-based browsers (Chromium, Chrome, Safari and Epiphany).

create new image or embed existing:
Usage: 
 * embed svg using do=export_svg (reccomended)
 *   {{svg>page.svg}}
 *   {{svg>namespace:page.svg}}
 * base64 encode svg directly (requires ~~NOCACHE~~ or &purge every time SVG changes)
 *   {{SVG>page.svg}}
 *   {{SVG>namespace:page.svg}}
 * base64 encode inline svg directly (originaly for internal use, but have fun if you like it...)
 *   <svg args...>...code...</svg>

now you can also embed SVG directly to the page like this, but it's only by-product and editing of such images will not be supported:

<svg width="100" height="100" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
 <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
 <g>
  <title>Layer 1</title>
  <ellipse ry="34" rx="31" stroke-width="5" stroke="#000000" fill="#ff0000" id="svg_2" cy="55" cx="63"/>
  <rect stroke-width="5" stroke="#000000" fill="#000080" id="svg_1" height="39" width="45" y="11" x="12"/>
 </g>
</svg>

1. SVG is plaintext image format
2. SVG-Edit is JavaScript SVG editor
3. DokuWiki is great for collaboration and versioning on top of textfiles
4. Why we are not using DokuWiki to take care about our images

I had created this proof of concept version and I am copylefting whole source and I hope that community will improve this plugin

I am using DokuWiki to taking notes in school and I was missing simple way to add sketches, graphs and mathematical formulas. So I've installed math2, graphviz, but still there was nothing really usable to create sketches, so I've decided to write my own plugin.

At the beginning, I've found cool software called svg-edit (you can try demo) which can edit SVG images directly in browser using JavaScript. And I've got idea to embed SVG-edit to DokuWiki WYSIWYG and store svg files same way as other documents, so everybody will be able to collaborate on single SVG file even with using diffs and any other cool DokuWiki stuff.

moved to http://github.com/Harvie/DokuWiki-Plugin-SVGEdit

Please send your bugreports (and patches) to github: http://github.com/Harvie/DokuWiki-Plugin-SVGEdit/issues

Recommend using

{{svg>namespace:imagename.svg}}

This will initially put two objects on the wiki page, one a blank image object and the other a linked line, “svg@namespace:imagename.svg”. Select the second, the first time you do this a topic doesn't exist yet page pops up. Select “create this page”. You should see a button labeled “SVG” next to your other edit buttons in the edit window. Select “SVG”. An embedded svg-edit window shows up. Create your image. You probably want to edit the document properties (hitting 'i' should bring it up) and set the canvas to fit the contents (or otherwise set the canvas). Once satisfied, select the “SVG-SAVE” button at the bottom. Now you should have the image showing up. For further editing, select “svg@namespace:imagename.svg” link, “edit”, and “SVG”. I assume the situation is similar for other browsers that work (this does not include Firefox).

why the extension not work offline? svg-edit occupies only 600kb and be able to edit pages offline seems like a good thing
To use the editor offline, simply extract all content of svg-edit-*.zip from the main site on googlecode in ./lib/plugins/svgedit/ and rename extract folder in svg-edit. Open ./lib/plugins/svgedit/script.js with an editor and comment first line and uncomment third. That all! Very thanks Thomas! — vinnie 30/03/2011 17:04