canvas&SVG 各类坑 记录

给canvas设置高度 宽度 坑

$("canvas").attr("width",w).attr("height",40);   正确

$("canvas").css("width",w).css("height",40);     画笔比例会出问题

svg 和 jquery 一块儿使用 坑

SVG DOM和HTML DOM 是不同的 也许你在浏览器里看到的是同样的

jquery 对dom的操做是html dom的，当你试图用jquery 向dom里添加svg 元素时，被添加的是html dom而不是svg dom 因此SVG 绘图不会生效。可是使用d3.js如d3.apend("svg:g")是生效的。具体能够看源码查看。

CANVAS 在浏览器里实际上是有最高绘制限制的再超过就会出现不可预知的错误，高度大约3到4个屏幕