ASCIIMathML-SVG Demonstration of the Pie Chart & Bar Chart capabilities of ASCIIsvg v3.4.0.

agraph setShowCoordinates(false); setViewport(970,323,0); setGraphArea(0,30,-5,5); initPicture(); createGradient("5%","#FA0","95%","#FF6","fadeorange",Horizontal); createGradient("5%","blue","95%","lightblue","fadeblue",Vertical); createGradient("5%","pink","95%","red","fadered",Horizontal); createGradient("5%","lightgreen","95%","green","fadegreen",Horizontal); newPieChart(" My First Pie Chart", true,true); addPieChartItem(50,"fadeorange","orange","First item",true,0.2); addPieChartItem(60,"fadeblue","darkblue","Second item",true,0.2); addPieChartItem(30,"fadered","darkred","Third item",true,0.2); addPieChartItem(20,"fadegreen","darkgreen","Fourth item",true,0.2); drawPieChart([6,0],3); newPieChart(" My Second Pie Chart", true,true); addPieChartItem(30,"fadeorange","orange","First item",true,0); addPieChartItem(40,"fadeblue","darkblue","Second item",true,0); addPieChartItem(50,"fadered","darkred","Third item",true,0); addPieChartItem(60,"fadegreen","darkgreen","Fourth item",true,0.2); drawPieChart([15,0],3); newPieChart(" My Third Pie Chart", true,true); addPieChartItem(40,"fadeorange","orange","First item",true,0); addPieChartItem(30,"fadeblue","darkblue","Second item",true,0); addPieChartItem(20,"fadered","darkred","Third item",true,0); addPieChartItem(10,"fadegreen","darkgreen","Fourth item",true,0.2); drawPieChart([24,0],3); setFill("none",0); viewportBorder("3","black"); endagraph agraph setViewport(970,400,60); setGraphArea(0,30,0,100); setGridandTicks(10,10,10,10); setLabelsandTitle(BottomLeft,"","%","Stacked Bar Charts"); initPicture(); initStackedBarChartH(); drawGraphArea(); createGradient("5%","#FA0","95%","#FF6","fadeorange",Horizontal); createGradient("5%","blue","95%","lightblue","fadeblue",Horizontal); createGradient("5%","red","95%","pink","fadered",Horizontal); createGradient("5%","green","95%","lightgreen","fadegreen",Horizontal); newStackedBarChartH(" My First Bar Chart", true,true); addStackedBarChartItemH(50,"fadeorange","orange","First item",true,0); addStackedBarChartItemH(60,"fadeblue","darkblue","Second item",true,0); addStackedBarChartItemH(30,"fadered","darkred","Third item",true,0.2); addStackedBarChartItemH(20,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartH([5,0],3); newStackedBarChartH(" My Second Bar Chart", true,true); addStackedBarChartItemH(30,"fadeorange","orange","First item",true,0); addStackedBarChartItemH(40,"fadeblue","darkblue","Second item",true,0.2); addStackedBarChartItemH(50,"fadered","darkred","Third item",true,0); addStackedBarChartItemH(60,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartH([15,0],3); newStackedBarChartH(" My Third Bar Chart", true,true); addStackedBarChartItemH(40,"fadeorange","orange","First item",true,0); addStackedBarChartItemH(30,"fadeblue","darkblue","Second item",true,0); addStackedBarChartItemH(20,"fadered","darkred","Third item",true,0.2); addStackedBarChartItemH(10,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartH([25,0],3); setFill("none",0); axesBorder("2","black"); viewportBorder("3","black"); endagraph agraph setViewport(970,400,60); setGraphArea(0,30,0,100); setGridandTicks(10,10,10,10); setLabelsandTitle(BottomLeft,"","%","Bar Charts"); initPicture(); initBarChartH(); drawGraphArea(); createGradient("5%","#FA0","95%","#FF6","fadeorange",Horizontal); createGradient("5%","blue","95%","lightblue","fadeblue",Horizontal); createGradient("5%","red","95%","pink","fadered",Horizontal); createGradient("5%","green","95%","lightgreen","fadegreen",Horizontal); newBarChartH(" My First Bar Chart",true,false); addBarChartItemH(50,"fadeorange","orange","First item",true,0); addBarChartItemH(60,"fadeblue","darkblue","Second item",true,0); addBarChartItemH(30,"fadered","darkred","Third item",true,0.2); addBarChartItemH(20,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartH([5,0],5); newBarChartH(" My Second Bar Chart",true,false); addBarChartItemH(30,"fadeorange","orange","First item",true,0); addBarChartItemH(40,"fadeblue","darkblue","Second item",true,0.2); addBarChartItemH(50,"fadered","darkred","Third item",true,0); addBarChartItemH(60,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartH([15,0],5); newBarChartH(" My Third Bar Chart",true,false); addBarChartItemH(40,"fadeorange","orange","First item",true,0); addBarChartItemH(30,"fadeblue","darkblue","Second item",true,0); addBarChartItemH(20,"fadered","darkred","Third item",true,0.2); addBarChartItemH(10,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartH([25,0],5); setFill("none",0); axesBorder("2","black"); viewportBorder("3","black"); endagraph agraph setViewport(970,400,60); setGraphArea(0,100,0,30); setGridandTicks(10,10,10,10); setLabelsandTitle(BottomLeft,"%","","Stacked Bar Charts"); initPicture(); initStackedBarChartV(); drawGraphArea(); createGradient("5%","#FA0","95%","#FF6","fadeorange",Vertical); createGradient("5%","blue","95%","lightblue","fadeblue",Vertical); createGradient("5%","red","95%","pink","fadered",Vertical); createGradient("5%","green","95%","lightgreen","fadegreen",Vertical); newStackedBarChartV(" My First Bar Chart", true,true); addStackedBarChartItemV(50,"fadeorange","orange","First item",true,0); addStackedBarChartItemV(60,"fadeblue","darkblue","Second item",true,0); addStackedBarChartItemV(30,"fadered","darkred","Third item",true,0.2); addStackedBarChartItemV(20,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartV([0,25],3); newStackedBarChartV(" My Second Bar Chart", true,true); addStackedBarChartItemV(30,"fadeorange","orange","First item",true,0); addStackedBarChartItemV(40,"fadeblue","darkblue","Second item",true,0.2); addStackedBarChartItemV(50,"fadered","darkred","Third item",true,0); addStackedBarChartItemV(60,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartV([0,15],3); newStackedBarChartV(" My Third Bar Chart", true,true); addStackedBarChartItemV(40,"fadeorange","orange","First item",true,0); addStackedBarChartItemV(30,"fadeblue","darkblue","Second item",true,0); addStackedBarChartItemV(20,"fadered","darkred","Third item",true,0.2); addStackedBarChartItemV(10,"fadegreen","darkgreen","Fourth item",true,0); drawStackedBarChartV([0,5],3); setFill("none",0); axesBorder("2","black"); viewportBorder("3","black"); endagraph agraph setViewport(970,600,60); setGraphArea(0,100,0,30); setGridandTicks(10,10,10,10); setLabelsandTitle(BottomLeft,"%","","Bar Charts"); initPicture(); initBarChartV(); drawGraphArea(); createGradient("5%","#FA0","95%","#FF6","fadeorange",Vertical); createGradient("5%","blue","95%","lightblue","fadeblue",Vertical); createGradient("5%","red","95%","pink","fadered",Vertical); createGradient("5%","green","95%","lightgreen","fadegreen",Vertical); newBarChartV(" My First Bar Chart",true,true); addBarChartItemV(50,"fadeorange","orange","First item",true,0); addBarChartItemV(60,"fadeblue","darkblue","Second item",true,0); addBarChartItemV(30,"fadered","darkred","Third item",true,0.2); addBarChartItemV(20,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartV([0,25],6); newBarChartV(" My Second Bar Chart",true,true); addBarChartItemV(30,"fadeorange","orange","First item",true,0); addBarChartItemV(40,"fadeblue","darkblue","Second item",true,0.2); addBarChartItemV(50,"fadered","darkred","Third item",true,0); addBarChartItemV(60,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartV([0,15],6); newBarChartV(" My Third Bar Chart",true,true); addBarChartItemV(40,"fadeorange","orange","First item",true,0); addBarChartItemV(30,"fadeblue","darkblue","Second item",true,0); addBarChartItemV(20,"fadered","darkred","Third item",true,0.2); addBarChartItemV(10,"fadegreen","darkgreen","Fourth item",true,0); drawBarChartV([0,5],6); setFill("none",0); axesBorder("2","black"); viewportBorder("3","black"); endagraph
The original ASCIIMathML and ASCIIsvg scripts have been developed by by Peter Jipsen, Chapman University (jipsen@chapman.edu)
LaTeXMathML has been developed by Douglas Woodall (and exteded by Jeff Knisley), based on ASCIIMathML
The version of ASCIIMathML used here, is a modified and extended version, developed by Dr.ir. S.A. Miedema
Other sources: An ASCIIsvg manual by Robert Fant.  An ASCIIsvg manual by Peter Jipsen. An ASCIIMathML manual by James Gray.

Plugins and fonts required (depending on your browser): MIT MathML font packages, MathPlayer, Adobe SVGviewer
Look at: http://www.w3.org/TR/SVG11/ for detailed information about SVG.
Look at: http://www.w3.org/Math/ for detailed information about MathML

Copyright © Dr.ir. S.A. Miedema, Delft University of Technology, Faculty of Mechanical Engineering, Marine Technology & Materials Science
Department of Marine & Transport Technology, The Chair of Dredging Engineering