谁能帮我改变瀑布高图的行为以显示截图中的图表?
其实我知道 isSum 和 isIntemediateSum 属性。使用它我可以用 0 y 轴开始瀑布中的一些列。
但这忽略了分配的 y 轴值,并根据之前的系列进行计算。
有什么建议么?
谁能帮我改变瀑布高图的行为以显示截图中的图表?
其实我知道 isSum 和 isIntemediateSum 属性。使用它我可以用 0 y 轴开始瀑布中的一些列。
但这忽略了分配的 y 轴值,并根据之前的系列进行计算。
有什么建议么?
我参加聚会有点晚了,但无论如何我都会给出我的解决方案。我对它并不完全满意,因为我觉得它很老套,但它确实能胜任。
假设您想在瀑布上绘制 4 个值:
A
开始于0
和结束于10
B
开始于10
和结束于20
C
开始于0
和结束于25
D
开始于25
和结束于35
您可以通过为 value 创建两个数据点来做到这一点C
:
visible
为true
)并且 y 值为-20
25
隐形条将使您的瀑布当前总和恢复为 0,但不会出现在您的图表上。
这是我的代码:
Highcharts.chart('container', {
chart: {
type: 'waterfall'
},
title: {
text: 'Highcharts Waterfall'
},
xAxis: {
type: 'category'
},
legend: {
enabled: false
},
series: [{
upColor: Highcharts.getOptions().colors[2],
color: Highcharts.getOptions().colors[3],
data: [
{y: 10, name: "A", color: "#6a329f"},
{y: 10, name: "B", color: "#6a329f"},
{y: -20, name: "C", visible: false, color: "#f44336"},
{y: 25, name: "C", color: "#f44336"},
{y: 10, name: "D", color: "#6a329f"}],
}]
});
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; max-width: 600px; height: 400px; margin: 0 auto"></div>
如果有人可以对此进行改进,我会很高兴,我发现它太复杂了,无法成为理想的解决方案。