A nice way to create, store, edit, and embed SVG images in DokuWiki
Compatible with DokuWiki
2017-02-26, frusterick, manners, rincewind, angua, Adora Belle, detritus, Frusterick Manners
Search and install the plugin using the Extension Manager. Refer to Plugins on how to install plugins manually.
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:
{{svg>page.svg}} {{svg>namespace:page.svg}}
{{SVG>page.svg}} {{SVG>namespace:page.svg}}
<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>
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.
Please send your bugreports (and patches) to GitHub: https://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”.
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).
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
Seems it doesn't support aligning?
It would be nice, if it supports relative path. That makes easier to move documents.
How about using first line of svg file as it's title rather than svg@page_path. I mean the title text showing on pages like below. Thanks for your wonderful job.
(svg image shows here) [TITLE shows here]
Currently, the original svgedit in the download link doesn't work on Weatherwax. Thanks to ambienthack for providing a Weatherwax-compatible fork. — Rik Blok 2013/07/05 00:49
script.js
, uncomment the third line and comment the first oneFlush the cache, and it should work.
06/07/2017