变量抛出“未定义”错误，无法计算

I'm using Raphael.js. Everytime i load the page i get an error that reads:

我用Raphael.js。每次加载页面时，我都会看到一个错误:

con is undefined
x = con.x

I looked up con in the Raphael documentation, and this is what i found:

我在Raphael文档中查找了con，我发现:

var con = R._getContainer.apply(0, arguments),
    container = con && con.container,
    x = con.x,
    y = con.y,
    width = con.width,
    height = con.height;
    //...

con is clearly defined here. Here is the code I am trying to load:

这里明确定义了con。这是我要加载的代码:

var paper = new Raphael(ele('canvas_container'), 500, 500);

window.onload = function() {
            var circle = paper.circle(100,100,100);
            for (i = 0; i < 5; i++) {
                var multiplier = i * 5;
                paper.circle(250 + (2 * multiplier), 100 + multiplier, 50 - multiplier);
            }
    }

Has anyone else gotten this error? Is this a bug in the version of Raphael that I have or is there some other problem?

有人犯过这个错误吗?这是我的Raphael版本中的错误还是有其他问题?

2 个解决方案

#1

Try moving the paper instantiation inside your window's load function:

尝试在窗口的load函数中移动纸张实例化:

window.onload = function() {
    var paper = new Raphael(ele('canvas_container'), 500, 500);
    var circle = paper.circle(100,100,100);
    for (i = 0; i < 5; i++) {
        var multiplier = i * 5;
        paper.circle(250 + (2 * multiplier), 100 + multiplier, 50 - multiplier);
    }
}

If you try to get an element by its id before the DOM is ready, getElementById won't return anything. As you can see here, trying your code on an empty document shows the same result.

如果您试图在DOM就绪之前通过它的id获取元素，getElementById将不会返回任何内容。正如您在这里看到的，在一个空文档上尝试代码会显示相同的结果。

#2

Raphael.js expects there to be a hard coded HTML element on the page with the name of the Raphael canvas (ie: "canvas_container"). If the HTML element is created during run time (dynamically in your JavaScript code), it will throw this error.

拉斐尔。js希望在页面上有一个硬编码的HTML元素，它的名称是Raphael canvas(即“canvas_container”)。如果HTML元素是在运行时(在JavaScript代码中动态创建)创建的，它将抛出此错误。

R._engine.create = function () {
    var con = R._getContainer.apply(0, arguments),
        container = con && con.container,
        x = con.x,
        y = con.y,
        width = con.width,
        height = con.height;
    if (!container) {
        throw new Error("SVG container not found.");
    }
    var cnvs = $("svg"),
        css = "overflow:hidden;",
        isFloating;
    x = x || 0;
    y = y || 0;
    width = width || 512;
    height = height || 342;
    $(cnvs, {
        height: height,
        version: 1.1,
        width: width,
        xmlns: "http://www.w3.org/2000/svg"
    });
    if (container == 1) {
        cnvs.style.cssText = css + "position:absolute;left:" + x + "px;top:" + y + "px";
        R._g.doc.body.appendChild(cnvs);
        isFloating = 1;
    } else {
        cnvs.style.cssText = css + "position:relative";
        if (container.firstChild) {
            container.insertBefore(cnvs, container.firstChild);
        } else {
            container.appendChild(cnvs);
        }
    }
    container = new R._Paper;
    container.width = width;
    container.height = height;
    container.canvas = cnvs;
    container.clear();
    container._left = container._top = 0;
    isFloating && (container.renderfix = function () {});
    container.renderfix();
    return container;
};

#1