javascript - 如何获得Float图表在Rails中工作？

因此，我正在努力使自己绘制图表，但似乎无法正常工作。这是我现在所拥有的：

<div class="col-md-6" style="width:600px;height:300px">
          <script src="http://cdnjs.cloudflare.com/ajax/libs/flot/0.8.1/jquery.flot.min.js"></script>
          <div id="flot-graph"></div>
            <script>
                $(function() {
                    var myData = [[1, 2010], [2, 2543], [3, 2520], [4, 2354]];

                    $.plot($("#flot-graph"), [
                        {
                            data: myData
                        }
                    ]);

                });
            </script>
        </div>

现在，这似乎确实在做某事，因为它在页面上添加了画布来完成div，但是它仍然是空白的，实际上并未呈现任何内容。

<div id="flot-graph" style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; position: relative;">
    <canvas class="flot-base" style="direction: ltr; position: absolute; left: 0px; top:  0px;">
    </canvas>
</div>

我试过使用flot-rails gem，以及将flot包添加到vendor / assets文件夹中（并需要在application.js中重新加载资产管道），但是发生了相同的事情，我已经疯了。

最佳答案

如果检查浏览器的javascript错误，则可能会看到以下内容：

Uncaught Error: Invalid dimensions for plot, width = , height =

您在情节div上need to specify a CSS height and width：

<div id="flot-graph" style="width:300px; height: 200px"></div>

另外，正如我在评论中建议的那样，应避免在HTML正文中插入<script src=...。

关于javascript - 如何获得Float图表在Rails中工作？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19966615/