相关疑难解决方法(0)

我正在使用Javascript绘制SVG网格.我已设法绘制轴,以及我的象限标签.但是我遇到了一个添加动态点的问题.

我正在尝试在SVG元素的onload事件中绘制点.使用Firebug时,我已经能够确认代表我的点的圆形元素被添加到SVG DOM中,并为位置,画笔描边等设置了正确的属性.

不幸的是,我的浏览器(Firefox 3)渲染的实际图像没有更新,以反映我添加了这些新DOM元素的事实!

以下是我用于将元素添加到正确DOM节点的代码:

function drawPoints()
  {
    var points = pointCollection.points;
    var grid = SVGDoc.getElementById("gridGroup");

    for(var i = 0 in points)
    {
        var x = points[i].x;
        var y = points[i].y;
        var label = points[i].event;

        //<circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/>

        var dot = SVGDoc.createElement("circle");
        dot.setAttribute("cx", x);
        dot.setAttribute("cy", y);
        dot.setAttribute("r", 15);
        dot.setAttribute("stroke", "red");
        dot.setAttribute("stroke-width", "2");
        dot.setAttribute("fill", "black");

        grid.appendChild(dot);
    }
  }

之后的Firefox的Firebug调试扩展所示的SVG结构是:

<svg width="800" height="800" version="1.1" xmlns="http://www.w3.org/2000/svg" onload="init(evt); drawAxis(); drawPoints()">
  <g id="gridGroup" stroke="green">
    <line id="xAxis" x1="0" x2="800" y1="400" y2="400" …