charts - 在 AmCharts 中查找两个点值序列之间的差异？

Question

我正在使用AmCharts. 我需要在气球文本中显示值，该值不是值字段。

例如：X axis Value 0 , Y axis 1, (0,1) is 2 ; (1,2) is 5。

我需要显示值之间的差异(0,1)-(1,2)这意味着“3”作为点中的气球(1,2)。有任何想法吗 ？

Answer 1

是的，您的屏幕截图上的图表是可以实现的。

首先，向图表数据添加其他字段，例如labelGraph1, labelGraph2. 然后就可以使用对象的labelText属性了AmCharts.AmGraph。

var chartData = [{
    title: "Apples",
    value1: 24,
    value2: 28,
    labelGraph1: null,
    labelGraph2: null
}, {
    title: "Bananas",
    value1: 27,
    value2: 31,
    labelGraph1: null,
    labelGraph2: null
}, {
    title: "Cherries",
    value1: 27,
    value2: 39,
    labelGraph1: null,
    labelGraph2: null
}];

for(var i = 0; i < chartData.length; i++) {
    chartData[i].labelGraph1 = chartData[i].value1;
    chartData[i].labelGraph2 = chartData[i].value2 - chartData[i].value1;
}

var chart;

AmCharts.ready(function () {
    // SERIAL CHART
    chart = new AmCharts.AmSerialChart();
    chart.dataProvider = chartData;
    chart.categoryField = "title";

    // GRAPHS                                            
    var graph1 = new AmCharts.AmGraph();
    graph1.valueField = "value1";
    graph1.type = "line";
    graph1.fillAlphas = 0.6;
    graph1.labelText = "[[labelGraph1]]";
    chart.addGraph(graph1);

    var graph2 = new AmCharts.AmGraph();
    graph2.valueField = "value2";
    graph2.type = "line";
    graph2.fillAlphas = 0.6;
    graph2.labelText = "[[labelGraph2]]";
    chart.addGraph(graph2);

    // WRITE
    chart.write("chartdiv")
});

唯一的困难是计算显示字段的值。我这样做了，您应该根据您的数据更改该功能：

for(var i = 0; i < chartData.length; i++) {
    chartData[i].labelGraph1 = chartData[i].value1;
    chartData[i].labelGraph2 = chartData[i].value2 - chartData[i].value1;
}