javascript 简单画心型线

来源：互联网发布：centos 7.2 64位安装编辑：程序博客网时间：2024/06/04 23:34

<!-- javascript 简单画心型线 --><!DOCTYPE html><html><head><meta charset="utf-8"><title>测试</title><style>canvas{background: lawngreen;//画布背景色  }</style></head><body><canvas id="gycanvas" width="300" height="300" ></canvas><script>    //铺满屏幕var width = document.documentElement.clientWidth;var height = document.documentElement.clientHeight;//gycanvas.setAttribute("width",width);        //gycanvas.setAttribute("height",height);//DOM兼容性好document.getElementById("gycanvas").setAttribute("width",width);        document.getElementById("gycanvas").setAttribute("height",height);//开始画var x0 = width/2;var y0 = height/2;var context = document.getElementById("gycanvas").getContext("2d");context.fillStyle = "red"; 　        var x,y;//循环for(var xx = 0 ; xx<width ; xx++ ){for(var yy = 0 ; yy<height ; yy++ ){//以屏幕中心为原点                x=xx-x0;     y=y0-yy;//符合条件就画点if(x*x+Math.pow(y-Math.pow(x*x,0.33333),2)<10100&&x*x+Math.pow(y-Math.pow(x*x,0.33333),2)>9900){//在相应位置画点context.fillRect(xx,yy,1,1);}}}</script></body></html>

阅读全文

0 0