欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

SVG的学习(34—36)

程序员文章站 2022-10-23 11:10:01
使用js来动态绘制svg图片,首先就是要创建svg 节点。 使用createElementNS(),语法: 参数: 有效的命名空间URL有: 代码举例: ......

使用js来动态绘制svg图片,首先就是要创建svg 节点。

使用createElementNS(),语法:

document.createElementNS(namespaceURI, qualifiedName[, options]);

参数:

SVG的学习(34—36)

有效的命名空间URL有:

SVG的学习(34—36)

代码举例:

var nameSpace = 'http://www.w3.org/2000/svg';  //命名空间url
    var max = Math.max.apply(null, data);
    var proportion = max/350;
    var interval = 40;
    var columnStyle = 'stroke: blue; fill: blue';
    for (var singleColumn of data) {
        document.createElementNS(nameSpace,'rect') //创建矩形
    }