使用C3JS仅在Y轴上显示最小/最大值
Show only the MIN/MAX value on Y-AXIS with C3JS
我希望y轴只包含我的数据的最小/最大值。我尝试使用d3指令,但没有结果。
我看了一下谷歌,但没有找到实现这种行为的答案。
代码下方:
$.getJSON('assets/json/chartc3.json', function(data)
{
scene=data;
var chart = c3.generate({
bindto: '#chartc3',
data:
{
json: scene,
keys:
{
x: 'round',
value: ['Marketable', 'Total Requested Capacity', 'Your Bid'],
},
types: {
Marketable: 'area'
},
colors: {
Marketable: '#A09FA2',
'Total Requested Capacity': '#272E80',
'Your Bid': '#8EBF60'
}
},
axis:
{
x: {
tick:
{
culling:
{
max: 10
}
},
type: 'category'
},
y:
{
min: 0,
padding : {
bottom : 0
},
tick:
{
values: [[0], [***d3.max(scene)]***],
format: function (d) { return d3.format(',f')(d) +' kWh/h' }
//or format: function (d) { return '$' + d; }
}
}
}.........
我如何才能达到上述结果?d3.max(场景)返回NaN。
问题是场景不是数组,而是json对象。
var k = d3.max([1,5,2])
k will be 5
因此,您需要传递一个元素数组,这些元素构成了您的y序数。
您需要使用
d3.max(arr, function(d){return numberic value});
或
var arr = scene.map(function(d){return ...the number value..})
y:{
min:d3.min(arr),
max:d3.max(arr)
},
函数取决于数据的数组元素。
我用了一个小函数来自己计算最大值。
var maxs=0;
for (var j=0; j<scene.length; j++) {
var maxtemp=Math.max(scene[j].Marketable, scene[j]['Your Bid'], scene[j]['Total Requested Capacity']);
maxs=Math.max(maxs, maxtemp);
}
相关文章:
- 在Javascript数组中查找绝对最大值
- Html5输入属性的默认值,如最小值、最大值、大小等
- 按最大值获取数组索引
- 识别滑块范围的最小值和最大值
- 如何在最大值之前的某个点停止范围滑块
- 访问Highcharts系列的最小/最大值:afterSetExtremes不会激发
- 如何在拖动后获得图表的最小值和最大值放大高图表
- 如何仅在存在最小值和最大值时才显示错误消息
- 当达到最小值和最大值时,防止在输入中显示额外的文本
- 显示最大值的控制编号
- 如果 kendo 数字文本框中的值增加最大值,则希望显示错误消息
- Jquery 最小值和最大值显示新页面
- 是否可以在剑道UI线性仪表上仅显示最大值/最小值
- Highcharts:在箱线图中显示标签(最小值,最大值,中位数等)
- 动态更改标签以显示y轴最小值和最大值
- 为什么评级总是显示评级的最大值,而隐藏字段则不然
- y轴最小和最大值范围显示
- 当最后一个点在当前x轴最小值之前,下一个点在当前x轴最大值之后时,高图不显示线
- 使用C3JS仅在Y轴上显示最小/最大值
- 如何显示星期几(我有最大值)