Highchart - 热图是否支持值的总和?

时间:2015-10-06 19:38:38

标签: javascript charts highcharts

我正在寻找类似下面的东西 enter image description here

有没有办法实现这个目标?

2 个答案:

答案 0 :(得分:3)

一种方法是添加另一个系列,其中包含行和列的总和值。为避免默认着色和colorAxis交互,可以更改dataLabel格式,工具提示格式和数据点属性的选项。

JSFiddle:http://jsfiddle.net/8TrTU/1631/

另一种解决方案可能是在相对的两侧添加衬里轴,并将类别设置为总和值。值不会自动求和 - 您必须自己设置或通过自定义代码计算值。

JSFiddle:http://jsfiddle.net/9fp7sarx/6/

    xAxis: [{
        categories: ['Alexander', 'Marie', 'Maximilian', 'Sophia', 'Lukas', 'Maria', 'Leon', 'Anna', 'Tim', 'Laura']
    },{
        linkedTo: 0,
        opposite: true,
        categories: [34,543,235,34,4,345,123,345,56,337],
        labels: {
            autoRotationLimit: 0
        }
    }],

    yAxis: [{
        categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
        title: null
    },{
        linkedTo: 0,
        opposite: true,
        categories: [234,432,123,464,554],
        title: null
    }],

答案 1 :(得分:2)

您可以通过添加额外的轴(如Kacper所述)来加总,但捕获标签格式化程序并提取当前的x / y值。然后迭代serie并用相同的坐标对所有点求和。

xAxis: [{
            categories: ['Alexander', 'Marie', 'Maximilian', 'Sophia', 'Lukas', 'Maria', 'Leon', 'Anna', 'Tim', 'Laura']
        },{
            linkedTo: 0,
            opposite: true,
            tickLength: 0,
            labels: {
                formatter:function() {
                    var chart = this.chart,
                        each = Highcharts.each,
                        series = chart.series[0],
                        sum = 0,
                        x = this.value;

                    each(series.options.data, function(p, i) {
                        if(p[0] === x)
                            sum += p[2]; 
                    });

                    return sum;
                }
            }
        }],

        yAxis: [{
            categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
            title: null
        },{
            linkedTo: 0,
            opposite: true,
            tickLength: 0,
            labels: {
                formatter:function() {
                    var chart = this.chart,
                        each = Highcharts.each,
                        series = chart.series[0],
                        sum = 0,
                        x = this.value;
                    each(series.options.data, function(p, i) {
                        if(p[1] === x)
                            sum += p[2]; 
                    });

                    return sum;
                }
            },
            title: null
        }],

示例:http://jsfiddle.net/8t2ugtm0/1/