This is an old revision of the document!

asciisvg plugin

Compatible with DokuWiki

version 2010-11-07|version 2011-05-25|version 2011-05-25a(also compatible with older version 2009-05-08)

Plugin for displaying good looking diagrams on wiki pages

Last updated on: 2008-08-05
Provides: Syntax
Conflicts with: perhaps with masciimath

The missing download url means that this extension cannot be installed via the Extension Manager. Please see Publishing a Plugin on dokuwiki.org. Recommended are public repository hosts like GitHub, GitLab or Bitbucket.

This extension has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues.

Tagged with diagram, images, media, svg

By Mohammad Rahmani

asciimathml

Description

ASCIIsvg is a layer of JavaScript functions that can be used in any HTML document to produce inline Scalable Vector Graphics viewable with both Internet Explorer+ Adobe SVGviewer and Firefox 1.5 and later. ASCIIsvg has been developed by Prof. Peter Jipsen at the university of Chapman. This plugin integrates ASCIIsvg into DokuWiki.

Installation

Download the source archive (~11k)from asciisvg
Unpack it in your DokuWiki plugins directory {dokuwiki}/lib/plugins (make sure, included subdirectories are unpacked correctly); this will create the following directories:
1. {dokuwiki}/lib/plugins/asciisvg.
2. {dokuwiki}/lib/plugins/asciisvg/main.
Make sure you have enabled Allow embedded HTML in your DokuWiki Configuration Manager

plugin codes

syntax.php

<?php
  /**
  /**
    * Plugin ASCIIsvg: Use ASCIIsvg for translating ASCII notation to SVG graphics.
    *
    * @license    GPL 2 (http://www.gnu.org/licenses/gpl.html)
    * @author     Mohammad Rahmani <m.rahmani@aut.ac.ir>
   */
 
if(!defined('DOKU_INC')) define('DOKU_INC',realpath(dirname(__FILE__).'/../../').'/');
if(!defined('DOKU_PLUGIN')) define('DOKU_PLUGIN',DOKU_INC.'lib/plugins/');
require_once(DOKU_PLUGIN.'syntax.php');
 
/**
 * All DokuWiki plugins to extend the parser/rendering mechanism
 * need to inherit from this class
 */
class syntax_plugin_asciisvg extends DokuWiki_Syntax_Plugin {
 
    /**
     * Get an associative array with plugin info.
     */
    function getInfo(){
        return array(
            'author' => 'Mohammad Rahmani',
            'email'  => 'm.rahmani@aut.ac.ir',
            'date'   => '2008-08-03',
            'name'   => 'ASCIIsvg Plugin',
            'desc'   => 'Translating ASCII math notation to SVG graphics',
            'url'    => 'http://www.dokuwiki.org/plugin:asciisvg',
                     );
    }
 
    function getType(){ return 'formatting'; }
    function getPType(){ return 'normal'; }
    function getSort(){ return 451; }
 }
//Setup VIM: ex: et ts=4 enc=utf-8 :

script.js

/*
 This script installs the ASCIIsvg JavaScript
 to be used through "asciisvg" plugin in DokuWiki
  Mohammad Rahmani
  Date: Sunday, 03 Aug. 2008  14:46:45
  Rev. 0: experimental
*/
 
// full url to ASCIIsvg main script
var ASCIIsvgURL =DOKU_BASE + 'lib/plugins/asciisvg/main/ASCIIsvg127.js';
 
document.write('<script type="text/javascript" src="' + ASCIIsvgURL + '"></script>');
 
 
function installASCIIsvg()
{
    ASCIIsvg.Process(document);
}
 
addInitEvent(installASCIIsvg);

Usage/Syntax

Make sure you have enabled Allow embedded HTML in DokuWiki Configuration Manager

 
 <html>

 <embed width="in pixels" height="in pixels"
  script='...ASCIIsvg commands...'
 >

 </html>

This is the syntax for the tag that inserts the pictures on the wiki page. The ASCIIsvg commands are put between single quotes in the script attribute. The width and height are measured in pixels. For detailed discussion take a look at ASCIIsvg commands.
There are many examples under ASCIIsvg Gallery.

Samples

Here are some examples tested under DokuWiki. Simply copy paste them into a wiki page with installed asciisvg plugin.

Example 1

<html>
<embed width="200" height="200"
script=' initPicture(-1,6,-1,6)
 axes()
 a = [0,0]
 b = [5,5]
 marker = "dot"
 line(a,b)
 text(a,"a",belowright)
 text(b,"g",above)
 text(b,"b",right)
 text(b,"b",left)
 text(b,"b",below)
 text(b,"b",aboveleft)
 text(b,"b",aboveright)
 text(b,"b",belowleft)
 text(b,"b",belowright)
 stroke = "red"
 path([a,[0,5],b,[5,0]])
 stroke = "green"
 marker = "none"
 curve([a,[.25,0],[.5,.5],[1,1],[1.5,1.5]])
 stroke = "blue"
 circle([5,0],1)
 ellipse([0,5],1,2)
 stroke = "purple"
 rect([0,0],[2,2],null,.5,1)
 marker = "arrowdot"
 line(a,[5,0])'>
</html>

See the result here Diagram 1 (The diagram on the left).

Example 2

<html>
<embed width="200" height="200"
script='initPicture(-2,2)
axes()
a = 1
stroke = "blue"
update()'>
<script>
function update() {
  plot(function (x){return a*x*x*x-x},"cubic")
  setText(a,"aval");
}
</script>
 
</html>

See the result here Diagram 2 (The diagram on the right).

More examples in ASCIIsvg sandbox

ToDo

The ASCIIsvg was implemented as a pseudo plugin here. It seems the plugin simply adds the ASCIIsvg.js into DokuWiki. It is better to add the script as a real plugin to support a syntax without enabling the embeded HTML.
The addition of ASCIIsvg.js into DokuWiki can be implemented in a more secure and safer way.
Interested developers are invited to correct/modify the code to obey the DokuWiki rules.
This plugin supports ASCIIsvg 1.2.7. The newer version is included in ASCIIMatML and does not supported by this plugin .

Issues

It seems there is a minor conflict with indexmenu. When asciisvg is active the mouse right-click on the trees does not work.
There is a conflict with jsmath. When asciisvg is installed jsMath does not work anymore.

Discussion

It doesnt work with the newest Version it seems. Its 2009-02-14b. I installed the newest plugin version, copied an example to a page but it doesnt show anything.

Table of Contents