用javascript实现画板的代码

2024-09-06 12:41:33

字体：大中小

来源：转载

供稿：网友

在控制台中输入
db.drawCircle([50,50],20,"black");
db.drawLine([5,5],[36,44],"red");
可以看到效果
代码如下:
<body style="margin:0px;">
</body>
<script>
    function DrawingBoard(width,height,size)
    {
        size=size||3
        var container=document.createElement("div");
        this.container=container;

        container.runtimeStyle.width=(width)*size+"px";
        container.runtimeStyle.height=(height)*size+"px";
        container.runtimeStyle.margin="0px";
        //container.style.border="solid 1px blue";
        var count=0;
                for(var y=0;y<height;y++)
        {
            for(var x=0;x<width;x++)
            {
                var curr=document.createElement("div");
                curr.runtimeStyle.height=size+"px";
                curr.runtimeStyle.width=size+"px";
                curr.runtimeStyle.display="inline";
                curr.runtimeStyle.overflow="hidden";
                curr.style.backgroundColor="green";
                curr.src="";
                container.appendChild(curr);
            }
        }
                //alert(curr.currentStyle.display);
        //document.body.appendChild(container);

        this.drawLine=function(start,end,color)