我找不到任何描述使用C3库创建Dojo Widget的示例。
在尝试创建小部件之前,我尝试创建一个模块,并且该模块可以正常工作。
我是Dojo的新手,所以这就是我尝试使用c3创建Widget的原因:
require([
"dojo/_base/declare", "dojo/parser", "dojo/dom-construct", "dojo/ready", "dojo/_base/window",
"dijit/_WidgetBase", "d3/d3", "c3/c3"
],function(declare, parser, domConstruct, ready, win, _WidgetBase, d3, c3){
declare("LineChart", [_WidgetBase], {
_options: {
bindTo : '#kpi1_chart',
data : {
columns : [
['data', 23, 50, 22, 41, 10]
]
},
zoom :{
enabled : true
}
},
_chart: undefined,
constructor: function(params, srcNodeRef){
if(params.hasOwnProperty('id'))
this._options.bindTo = "#"+params.id;
else
console.log("widget LineChart : id couldn't be found");
},
buildRendering: function(){
this._chart = c3.generate(this._options);
}
});
ready(function(){
parser.parse();
});
});
这是我如何初始化HTML中的小部件
<div id="kpi1_chart" data-dojo-type="LineChart"></div>
当我启动页面时,div标签只是空的,我没有收到任何错误,您能帮上忙吗?
我会回答我的问题:
为了能够在dojo小部件中显示C3图表,您必须在startup()函数中生成图表。
例如,如果您尝试在小部件生命周期中的startup()之前的另一个函数(如postCreate())中生成图表C3 ,则无法将c3绑定到(同一小部件的)DOM元素,因为该元素尚不存在。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句