Meteor 基于D3的流星C3图表-多重图表？

编辑：克隆此存储库以进行非工作复制

我正在使用

我从C3站点中提取了两个示例，可以让它们在页面上显示一次，但是当我尝试在同一页面上添加第二个示例时，第一个示例就消失了。没有控制台错误，javascript变量也不同

图1 html模板：

<template name="chart_cp_overview">
    <div id="cpOverview"></div>
</template>

<template name="chart_status">
    <div id="chart"></div>
</template>

图2 html模板：

<template name="chart_cp_overview">
    <div id="cpOverview"></div>
</template>

<template name="chart_status">
    <div id="chart"></div>
</template>

显示代码：

    <div class="row">
        <div class="col-md-6">
            {{> chart_cp_overview}}
        </div>
        <div class="col-md-6">
            {{> chart_status}}
        </div>
    </div>

{{>图表{cp}
{{>图表状态}

上面的代码仅显示最后一张图表-图表的状态。如果我删除任何一个把手引用，则其他图表显示良好，或者如果我有多个把手指向多个图表，则显示上次声明的内容

---

如何在一页内显示多个图表？示例位于github上的

，看起来您可能打算在模板呈现函数中选择两个变量名，

cpOverview

和

chart

，以绑定到具有这些ID的dom元素。那样不行

您选择的变量名是其函数的局部变量名，在任何情况下都不会自动附加到具有该id的元素，即使它们是全局变量。因此，c3将所有这些图表绑定到同一个dom元素（文档称默认值为

#chart

），最后一个将覆盖先前的图表

---

您希望将每个图表绑定到其各自的元素。您可以在呈现的函数中使用

this.firstNode

（根据设置方式），或者使用jquery，或者

this.find（“div#cpOverview”）

，然后使用c3 api将图表绑定到它-看起来

{bindto:“div#cpOverview”}

可能就是您想要的。答案是和bindto。非常感谢。现在，如何将其连接到数据库中的数据？这就是我被困的地方。