Question

我有以下格式的一系列地图缩减作业的不同阶段的数据：

{"GC Time":"[0.0,0.0,0.0,0.0]",
 "Result Serialization Time":"[3.0,3.0,3.0,2.0]",
 "Getting Result Time":"[0.0,0.0,0.0,0.0]",
 "Task Deserialization Time":"[17.0,16.0,16.0,16.0]",
 "Scheduler Delay":"[55.0,46.0,47.0,46.0]"}

基本上，每个阶段的数组包含该阶段增加任务编号顺序所需的时间。

我想使用dimple.js / d3.js绘制如下所示的堆积条形图：

http://ibin.co/1yH9raFgUtPs

我无法弄清楚如何做到这一点（对于那些对dimple.js有好处的人来说应该非常简单），所以非常感谢任何帮助。

Answer 1

我认为，如果能够展示到目前为止所做的工作，那么帮助你会更容易。

尽管如此，我认为您定义数据的方式是错误的。

尝试像这样定义数组：

var xpoints=["a","b","c"];
var ypoints=[1,2,3];
var x2points=[5,6,7];
var dataset=[];
for(var i=0;i<xpoints.length;i++){
dataset.push({
                    x : xpoints[i],
                    y : parseFloat(ypoints[i]),                         
                    z : x2points[i]

                    });
        }

console.log(dataset);

/*Output:

[[object Object] {
  x: "a",
  y: 1,
  z: 5
}, [object Object] {
  x: "b",
  y: 2,
  z: 6
}, [object Object] {
  x: "c",
  y: 3,
  z: 7
}]

*/

希望它有所帮助！

Dimple.js堆积条形图

1 个答案: