Fri, 17 May 2024


JavaScript function which renders a VML grid

By: Anton, NetArt Media
Tue, 1 February 2022

Very useful when you wish to place a grid behind your
VML chart graphics.

RenderGrid(gridWidth,gridHeight,hLines,vLines)
gridWidth - width of the gridht
gridHeight - height of the gridth
hLines - number of horizontal lines
vLines - number of vertical lines

Example:

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns="http://www.w3.org/TR/REC-html40">
<!--[if !mso]>
<style>
v:* {behavior:url(#default#VML);}
o:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]-->
<head>

</head>

<script>

function RenderGrid(gridWidth,gridHeight,hLines,vLines)
{

document.write("<table>");
document.write("<tr>");
document.write("<td>");

for(i=0;i<=hLines;i++)

{
document.write("<v:line from='0,"+(i*(gridHeight/hLines))+"' to='"+gridWidth+","+(i*(gridHeight/hLines))+"' ></v:line>");
}

for(i=0;i<=vLines;i++)
{

document.write("<v:line from='"+(i*(gridWidth/vLines))+",0' to='"+(i*(gridWidth/vLines))+","+gridHeight+"' ></v:line>");
}
document.write("</td>");
document.write("</tr>");
document.write("</table>");

}

RenderGrid(600,100,5,10);
</script>



</body>
</html>


Category: Other
Share this post:



See All Scripts






Subscribe for our newsletter

Receive the latest blog posts direct in your mailbox