javascript - svg Canvas 上的数字

标签 javascript svg

我通过 JavaScript 以编程方式创建了多个 svg 图像。图像是线条。

function create(elem) {                         //function for create svg elem                           
    var svg = "http://www.w3.org/2000/svg";
    return document.createElementNS(svg, elem);

function set(elem, atrArr) {       //function for set attributes svg elem                      
    for (var i in atrArr) {
        elem.setAttribute(i, atrArr[i])
    }
}


function someFunc(valueWidth, valueHeight) {
   var SVG = create('svg');   //canvas
   var line = create('line');  //line

   var width = valueWidth;   //some value
   var heigth = valueHeight;  //some value

   set(SVG, {             //set canvas
       version: '1.1',
       width: width,
       height: height
   });

   //set line
   set(line, { x1: 0, x2: width, y1: 0, y2: height, style: 'stroke:rgb(0,0,0);stroke-width:1' });     

   SVG.style.position = 'absolute';
   SVG.appendChild(line);
}

如果高度或宽度 < 0.5,则仅在 IE 中绘制线条。 我可以在其他浏览器中画线而不改变 Canvas 的大小吗?

最佳答案

在纠正语法错误(高度与高度)并将 svg 元素附加到正文后,这对我来说在 Chrome 中效果很好:

var SVG = create('svg');   //canvas
document.body.appendChild(SVG);

http://jsfiddle.net/4jRZT/5/

关于javascript - svg Canvas 上的数字,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18510416/

相关文章:

javascript - JQM 自定义选择不动态选择项目

javascript - 字符串上的多个正则表达式

javascript - 可以使用 Browserify 加载 SVG 文件

html - svg 中的图像在鼠标悬停时不缩放

css - 位置为 : relative with SVG clip paths not displaying in Safari 的元素

javascript - 我可以在 Parse JavaScript SDK 中使用其他 promise 实现吗?

javascript - 如何在点击时获取未选中复选框的值?

javascript - 如何在不在 SVG 中渲染的情况下从 d3 中获取轴刻度?

javascript - 如何从 x 轴获取刻度的 X 值?

javascript - SVG 在路径现象上创建元素