无法在页面上创建两个以上的 c3js 图

Question

我们正在使用以下代码（由 php 生成，但最终这是在客户端）

c3.generate({'bindto':'#b65d3422__salestaffcommunication_xepan_base_view_chart_chart','data':{'keys':{'x':'name','value':['Email','Call','Meeting']},'groups':[['Email','Call','Meeting']],'json':[],'type':'bar'},'axis':{'x':{'type':'category'},'rotated':true},'onrendered':function(ev,ui){$(".widget-grid").masonry({'itemSelector':'.widget'})}});
c3.generate({'bindto':'#f67e14d8__t_masscommunication_xepan_base_view_chart_chart','data':{'keys':{'x':'name','value':['Newsletter','TeleMarketing']},'groups':[['Newsletter','TeleMarketing']],'json':[],'type':'bar'},'axis':{'x':{'type':'category'},'rotated':true},'onrendered':function(ev,ui){$(".widget-grid").masonry({'itemSelector':'.widget'})}});
c3.generate({'bindto':'#517df254__ableworkforce_xepan_base_view_chart_chart','data':{'columns':[['present',11.111111111111]],'type':'gauge'},'color':{'pattern':['#FF0000','#F97600','#F6C600','#60B044'],'threshold':{'values':[30,60,90,100]}},'onrendered':function(ev,ui){$(".widget-grid").masonry({'itemSelector':'.widget'})}});

最后一张图没有画出来。显示

SyntaxError (DOM Exception 12): The string did not match the expected pattern.

但是，我可以运行任意两个，而且效果很好。这意味着所有代码都是完美的，但是一旦绘制了第二个代码（无论顺序如何）。第三个不画

是否有任何已知错误或已知解决方法。

使用来自 c3js.org

的 c3 v0.4.11

这是我的 jsfiddle

https://jsfiddle.net/2yy2mjaf/1/

谢谢。

Answer 1

身份证件不能以数字开头，这是您的第三个身份证件的情况。

简单的解决方法就是给它加一个字母:

'bindto':'#a517df254_ //just put an "a" before the number here

这是你的fiddle：https://jsfiddle.net/7dkLdg32/

无法在页面上创建两个以上的 c3js 图

Cannot create more then two c3js graphs on a page

html

d3.js

c3.js