如何制作带订单条形图的堆叠图

Question

我想创建一个堆积条形图，每个 x 轴都应该有一个堆积条和一个总柱形条以供比较。

我在堆叠条上有 3 个图例，旁边有一列总计。这可能吗？

数据

[{"label":"All","data":[{"0":1433113200000,"1":0},{"0":1435705200000,"1":0},{"0":1438383600000,"1":0},{"0":1441062000000,"1":0},{"0":1443654000000,"1":4},{"0":1446336000000,"1":8},{"0":1448928000000,"1":10},{"0":1451606400000,"1":20},{"0":1454284800000,"1":41},{"0":1456790400000,"1":78},{"0":1459465200000,"1":176},{"0":1462057200000,"1":360}],"bars":{"order":0},"idx":0},{"label":"P3","data":[{"0":1433113200000,"1":0},{"0":1435705200000,"1":0},{"0":1438383600000,"1":0},{"0":1441062000000,"1":0},{"0":1443654000000,"1":0},{"0":1446336000000,"1":2},{"0":1448928000000,"1":4},{"0":1451606400000,"1":2},{"0":1454284800000,"1":7},{"0":1456790400000,"1":0},{"0":1459465200000,"1":12},{"0":1462057200000,"1":28}],"bars":{"order":1},"stack":true,"color":"#ffa500","idx":1},{"label":"P2","data":[{"0":1433113200000,"1":0},{"0":1435705200000,"1":0},{"0":1438383600000,"1":0},{"0":1441062000000,"1":0},{"0":1443654000000,"1":0},{"0":1446336000000,"1":0},{"0":1448928000000,"1":0},{"0":1451606400000,"1":0},{"0":1454284800000,"1":0},{"0":1456790400000,"1":2},{"0":1459465200000,"1":31},{"0":1462057200000,"1":136}],"bars":{"order":1},"stack":true,"color":"#f00","idx":2}]

选项

{"series":{"bars":{"show":true,"fill":1,"align":"center","barWidth":1296000000,"lineWidth":0}},"xaxis":{"mode":"time","autoscaleMargin":null,"tickSize":[1,"month"],"format":"%m %y","ticks":null},"yaxis":{"min":0,"tickDecimals":0,"minTickSize":2},"grid":{"clickable":true,"hoverable":true},"legend":{"noColumns":3,"position":"ne"}}

Answer 1

is this possible to do?

是的，我相信使用 jquery.flot.stack.js 插件是可能的。

在 how-to-make-jquery-flot-stacked-chart

上查看此示例