getElementsByTagName(...)。0. parentNode'为null或不是对象

时间:2013-10-23 13:06:39

标签: javascript jquery svg internet-explorer-8 bytecode

我正在为我的应用程序使用Google Chart,我必须将生成的图表转换为图像字节代码。我已经在Firefox和Chrome中完成了这个,但 IE8没有响应获取svg元素,所以现在我不能从给定的div元素中获取字节代码。我将div元素转换为字节代码的脚本如下所示

function getElement() {
    for (var i = 0; i < divelement.length; i++) {
        toImg(document.getElementById(divelement[i]), i, medicalconditionid[i]);
    }
}

function toImg(chartContainer, i, id) {
    var field = document.createElement("input");
    field.type = "hidden";
    field.id = "img_code" + i;
    field.name = "imgcode";
    document.getElementById("dynamicText").appendChild(field);
    document.getElementById('img_code' + i).value = id + "_" + getImgData(chartContainer);
    i++;
}

function getImgData(chartContainer) {

    var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode;
    var svg = chartArea.innerHTML;
    var doc = chartContainer.ownerDocument;
    var canvas = doc.createElement('canvas');
    canvas.setAttribute('width', chartArea.offsetWidth);
    canvas.setAttribute('height', chartArea.offsetHeight);
    canvas.setAttribute(
        'style',
        'position: absolute; ' +
        'top: ' + (-chartArea.offsetHeight * 2) + 'px;' +
        'left: ' + (-chartArea.offsetWidth * 2) + 'px;');
    doc.body.appendChild(canvas);
    canvg(canvas, svg);
    var imgData = canvas.toDataURL("image/png");
    canvas.parentNode.removeChild(canvas);
    return imgData;
}

我在IE8中收到Line: 85 Error: 'getElementsByTagName(...).0.parentNode' is null or not an object错误。

1 个答案:

答案 0 :(得分:0)

我在IE8中发现不支持svg或canvas元素,因此javascript图表库如谷歌图表,D3和jqplot将图表转换为vml格式所以我们不能像上面的代码那样得到字节代码。在我的应用程序中谷歌图表可以生成不推荐使用的图像格式图表,但我使用此图像图表并将图像URL发送到动作类并将URL转换为图像。请参阅谷歌图片图表的this链接