Question

我目前有一些动态生成的基于JS的人力图，类似于http://code.shutterstock.com/rickshaw/examples/extensions.html

我对JS，html等有点新手。如何在同一个html页面上显示多个人力图？

注意：我不是要求在同一图表上显示多个趋势。

Answer 1

假设您有以下图表：

var graph = new Rickshaw.Graph({
    series: [ { data: [ { x: 0, y: 2 }, { x: 1, y: 4 } ...
    renderer: 'area',
    element: document.querySelector('#graph')
});

graph.render();

你刚刚做的是创建一个名为graph的全局变量，它是Rickshaw类*的一个实例，它将内容呈现给id是图形的HTML元素（即：＆lt; div id =“graph”＆gt;＆lt; / div＆gt;）。

要渲染另一个图形，请创建一个新实例：

var graph2 = new Rickshaw.Graph({
    series: [ { data: [ { x: 0, y: 5 }, { x: 1, y: 9 } ...
    renderer: 'area',
    element: document.querySelector('#graph2')
});

graph2.render();

...并将其绑定到新元素：

<div id="graph2">

*虽然Javascript有原型而不是类，但是当您使用new关键字调用函数时，有时会用经典术语来考虑函数。

在同一个html页面上显示多个人力车图

1 个答案: