agraph
  setShowCoordinates(false);
  setViewport(500,500,0);
  setGraphArea(0,500,0,500);
  initPicture();
  createDDD("DDD","100","100",false);
  setFont("Times",100,"blue");
  text([100,250],"\u03A3","","test");
  addFilter("test","DDD");
  mathfontfamily="Times";
  mathcolor="red"
  mathfontsize="16px";
  text([110,245],"`x^2+x+b/a=0`",right,"eqn1");
  setFont("Times",16,"red","bold");
  text([70,280],"x^2+x+b/a=0",aboveright,"eqn2");
  text([70,210],"`{a,b]={x\ in\ RR]`",belowright,"eqn3");
  setFont("Times",16,"black","bold");
  text([60,195],"ASCII2MathML-SVG",belowright,"eqn4");
  strokewidth=15;
  rect([55,160],[235,320],"rect1");
  addFilter("rect1","DDD");
endagraph
agraph
  setShowCoordinates(false);
  setViewport(1000,200,0);
  setGraphArea(0,30,0,6);
  initPicture();
  createDDD("DDD","50","50",false);
  fontsize=60;
  fontweight="bolder";
  fontstroke="blue";
  fontfill="blue";
  fontstrokewidth=5;
  text([15,3],"ASCIIMathML-SVG","middleabove","logo");
  addFilter("logo","DDD");
  fontstroke="red";
  fontfill="red";
  text([15,1],"Gradients & Filters","middleabove","sublogo");
  addFilter("sublogo","DDD");
  strokewidth=15;
  image("asciimathml.jpeg",[0.65,1.8],"100","100","image0");
  rect([0.4,1.5],[3.9,5.1],"rect1");
  addFilter("rect1","DDD");
  image("asciimathml.jpeg",[25.65,1.8],"100","100","image1");
  rect([25.4,1.5],[28.9,5.1],"rect2");
  addFilter("rect2","DDD");
endagraph

agraph
  setShowCoordinates(false);
  setViewport(1000,300,0);
  setGraphArea(0,30,0,6);
  initPicture();
  createDropShadow("testfilter",5,5,1,50,100,false,0.5);
  stroke="blue";
  strokewidth=3;
  fill="wheat";
  rect([1,1],[9,5],"test");
  addFilter("test","testfilter");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([5,5],"This is a test of using filters.","middleabove","test2");
  addFilter("test2","testfilter");

  createDropShadow("testfilter2",5,5,1,50,100,true,0.3);
  stroke="blue";
  strokewidth=3;
  fill="wheat";
  rect([11,1],[19,5],"test5");
  addFilter("test5","testfilter2");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([15,5],"This is a test of using filters.","middleabove","test6");
  addFilter("test6","testfilter");

  stroke="blue";
  strokewidth=3;
  fill="wheat";
  rect([21,1],[29,5],"test3");
  addFilter("test3","testfilter2");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([25,5],"This is a test of using filters.","middleabove","test4");
  addFilter("test4","testfilter2");
endagraph 
agraph
  setShowCoordinates(false);
  setViewport(1000,300,0);
  setGraphArea(0,30,0,6);
  initPicture();
  createDDD("MyButton1","50","50",false);
  createDDD("MyButton2","50","50",true);
  createGradient("5%","#FA0","95%","#FF6","fadeorange",-135);
  createGradient("5%","grey","95%","lightgrey","fadegrey",Vertical);
  setGradient("fadegrey",1);
  stroke="grey";
  rect([4,1],[6,2],"buttonrect5");
  rect([1,1],[3,2],"buttonrect");
  addFilter("buttonrect","MyButton1");
  rect([4,2],[6,3],"buttonrect6");
  rect([1,2],[3,3],"buttonrect2");
  addFilter("buttonrect2","MyButton1");
  rect([4,3],[6,4],"buttonrect7");
  rect([1,3],[3,4],"buttonrect3");
  addFilter("buttonrect3","MyButton1");
  rect([4,4],[6,5],"buttonrect8");
  rect([1,4],[3,5],"buttonrect4");
  addFilter("buttonrect4","MyButton1");
  fill="none";
  stroke="green";
  strokewidth=15;
  circle([27,1.5],2,"circle2");
  circle([27,3],2,"circle1");
  addFilter("circle1","MyButton1");
  fontsize=60;
  fontweight="bolder";
  fontstroke="blue";
  fontfill="blue";
  fontstrokewidth=5;
  text([15,4],"Using filters.","middleabove","text1");
  addFilter("text1","MyButton1");
  text([15,0],"Using filters.","middleabove","text2");
  strokewidth=15;
  fill="none";
  oval([15,3],1,5,"testoval");
  addFilter("testoval","MyButton1");

  fill="green";
  oval([15,3],0.65,3,"testoval2");
  addFilter("testoval2","MyButton1");
  fontfill="green";
  fontstroke="green";
  text([15,3],"SVG","middlemiddle","text3");
  addFilter("text3","MyButton1");
endagraph
agraph
  setShowCoordinates(false);
  setViewport(1000,300,0);
  setGraphArea(0,30,0,6);
  initPicture();
  createGradient("5%","#FA0","95%","#FF6","fadeorange",-135);
  createGradient("5%","blue","95%","lightblue","fadeblue",Vertical);
  createGradient("5%","pink","95%","red","fadered",Horizontal);
  createGradient("5%","lightgreen","95%","green","fadegreen",Horizontal);
  setGradient("fadeorange",1);
  rect([1,1],[9,5],"rect1");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([5,5],"Using gradients (-135).","middleabove","text1");

  setGradient("fadeblue",1);
  rect([11,1],[19,5],"rect2");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([15,5],"Using gradients (Vertical).","middleabove","text2");

  setGradient("fadegreen",1);
  rect([21,1],[29,5],"rect3");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([25,5],"Using gradients (Horizontal).","middleabove","text3");
endagraph
agraph
  setShowCoordinates(false);
  setViewport(1000,400,0);
  setGraphArea(0,30,0,6);
  initPicture();
  createRadialGradient("5%","#FA0","95%","#FF6","fadeorange","50%");
  createRadialGradient("5%","#FF6","95%","#FA0","fadeorange2","50%");
  createRadialGradient("0%","blue","50%","cadetblue","fadeblue","50%","100%","lightblue");
  createRadialGradient("5%","pink","95%","red","fadered","50%");
  createRadialGradient("5%","lightgreen","95%","green","fadegreen","50%",null,null,"35%","35%");
  setGradient("fadeorange",1);
  rect([1,1],[9,5],"rect1");
  stroke="yellow";
  setGradient("fadeorange2",1);
  circle([5,3],2,"circle1");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([5,5],"Using radial gradients.","middleabove","text1");

  setGradient("fadeblue",1);
  rect([11,1],[19,5],"rect2");
  stroke="lightblue";
  circle([15,3],4,"circle2");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([15,5],"Using radial gradients.","middleabove","text2");

  setGradient("fadegreen",1);
  rect([21,1],[29,5],"rect3");
  stroke="green";
  circle([25,3],2,"circle3");
  setFont("Arial",24,"red","bolder",null,"blue");
  text([25,5],"Using radial gradients.","middleabove","text3");
  
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