jquery - 空的浮动图表？

Question

我正在运行下面的代码并使用 Flot/jQuery 获取一个空图表。理想情况下，我所追求的是数据的条形图。我不高兴地看着这一切——有人有什么想法吗？

<div id="user_breakdown_placeholder" style="width:300px;height:300px"></div>

<script>
    $(function () {
        var d = [["Unassigned", 310],["Maynard Schumm", 274]];
            var options = {};
        $.plot($("#user_breakdown_placeholder"), d, options);
    });

</script>

Answer 1

当前版本的 flot (v. 0.6) 支持条形图。这是一个例子。在您的 plot() 函数中，您只需输入：

bars: { show: true}

Answer 2

一个老问题，但我认为它没有得到回答。根据 Flot API 文档：

请注意，为了简化 Flot 中的内部逻辑，x 和 y 值都必须是数字……如果您遇到神秘错误，请仔细检查您输入的是数字而不是字符串。

如果在上述情况下，您在数据中使用了字符串（例如 ["Unassigned", 310]），根据文档，这将不起作用。

Answer 3

你可以这样做，但你只需要稍微伪造你的数据。

$(function () {
    var data = [[0, 310],[1,274]];
    var datasets = [ {
                 "data": data
                     }, 
                   ];
    var options = {
                   bars: {show: true},
                   yaxis: { min: 0 },
                   xaxis: { ticks:  [
                                     [0.5, "Unassigned"],
                                     [1.5, "Maynard Schumm"]
                                    ],
                          },
                  };
   $.plot($("#user_breakdown_placeholder"), datasets, options);
});

------>

大概您可以在将数据传递给 Flot 之前适当地修改数据。

FlotUsage有很多很好的实际使用示例。例如Fedora有一些不错的条形图。最棒的是因为它是 JavaScript，您可以查看任何人的源代码和婴儿床想法 :)

Answer 4

正如 Neil Middleton 在评论中所说，Flot 不支持条形图。

也许这个或这个插件可以帮助你？