我目前正在制作一个二维图表,但我发现使用c3.Js库构建它时存在限制。
我的图表包含三种类型的数据,包括:数量,参与度,网站覆盖率
Y轴应显示Volume,X轴应显示websitcoverage,Scatter Plot应显示Engagement。
但是我需要绘图位置取决于X轴。我该怎么做?
var chart2 = c3.generate({
bindto:'#plotChart',
data: {
// iris data from R
columns:[mentionArr,engagementArr],
axes: {
mention: 'y',
},
type: 'scatter',
},
point: {
r: function(d) {
return d.value * 0.02; //need to replace d to something else, maybe data from API
}
},
color: {
pattern: ['#1f77b4', '#2ca02c', '#ff7f0e', '#ffbb78', '#2ca02c', '#98df8a', '#d62728', '#ff9896', '#9467bd', '#c5b0d5', '#8c564b', '#c49c94', '#e377c2', '#f7b6d2', '#7f7f7f', '#c7c7c7', '#bcbd22', '#dbdb8d', '#17becf', '#9edae5']
},
grid: {
y: {
show: true
}
},
axis: {
y: {
label: {
text: 'Participants Count',
//position: 'outer-center',
},
},
y2: {
show: true
},
x: {
label: {
text: 'Website Coverage',
position: 'outer-center',
},
type: 'category',
categories: coverageArr
}
},
legend: {
position: 'right'
}
});
上面的代码就是我如何构建它。