Flotr2 看不到 jQuery 对象

Question

我正在尝试使用 flotr 创建一些简单的可视化效果。但是，当我尝试为图表指定 div 容器时，我收到一条错误消息：

Uncaught The target container must be visibleGraph._setEl @ flotr2.min.js:27Graph @ flotr2.min.js:27n.draw @ flotr2.min.js:27(anonymous function) @ lines.html:25i @ jquery.min.js:2j.fireWith @ jquery.min.js:2n.extend.ready @ jquery.min.js:2K @ jquery.min.js:2

然而，当我将 jQuery $("#chart") 选择器更改为 document.getElementById("chart") 时，这项工作有效。基本上，当我使用 vanilla JavaScript 时它可以工作，但是当我切换到 jQuery 时它会失败。

下面是一个简化的游戏。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="JS_libs/flotr2.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    </head>
    <body>
        <div id='chart' style="width:600px;height:300px;"></div>
        <!--[if lt IE 9]><script src="js/excanvas.min.js"></script><![endif]-->

        <script>
            $(function() { var co2 = [
            [ 1959, 315.97 ],
            [ 1960, 316.91 ],
            [ 1961, 317.64 ],
            [ 1962, 318.45 ]];
            var temp = [
            [ 1959,  0.0776 ],
            [ 1960,  0.0280 ],
            [ 1961,  0.1028 ],
            [ 1962,  0.1289 ]];

            Flotr.draw(
            $("#chart"),
            [{ data: co2, lines: {show:true} }]
            );});
        </script>

    </body>
</html>

如果我将 $("#chart") 更改为 document.getElementById("chart")，它会起作用。但我想使用 jQuery 方式。

Answer 1

要从 jQuery 获取本机 JS 对象，您必须使用 [0] :

Flotr.draw(
    $("#chart")[0],
    [{ data: co2, lines: {show:true} }]
);});

Flotr2 看不到 jQuery 对象

Flotr2 can't see jQuery object

jquery

flotr2