Question

我已经为气泡图创建了一个明细。此深入分析的数据如下：

cf ic exec testnode python /local/hello.py

我可以按顺序使用数据进行深入研究，例如： id：动物数据将是如此，当我滚动水平数据点时，Cats将逐一呈现。

drilldown: {
        series: [{
            id: 'animals',
            data: [
                ['Cats', 5],
                ['Dogs', 2],
                ['Cows', 1],
                ['Sheep', 2],
                ['Pigs', 1]
            ]
        }, {
            id: 'fruits',
            data: [
                ['Apples', 4],
                ['Oranges', 2]
            ]
        }, {
            id: 'cars',
            data: [
                ['Toyota', 4],
                ['Opel', 2],
                ['Volkswagen', 2]
            ]
        }]
    }

JSFiddle

Answer 1

Motion插件目前不支持向下钻取系列，但很有可能实现。

你的JSFiddle是在正确的道路上，但它需要一种解决方法，让Motion在图表向下钻取时注意到系列中的变化。

JSFiddle的工作解决方案：http://jsfiddle.net/larsac07/Lon306y5/。

必须为Motion准备钻取系列，Motion必须了解系列的变化：

// Array that keeps track of prepared drilldown series.
var preparedDrilldowns = [];

// This function is called for each series, including drilldown
// series, and prepares it by setting an initial value for each
// point if the series is not already prepared.
function prepareDrilldowns(e) {
    var chart = e.target,
        motion = chart.motion,
        value;
    if (motion) {
        Highcharts.each(chart.series, function (series) {
            if (preparedDrilldowns.indexOf(series.name) < 0) {
                Highcharts.each(series.points, function (point) {
                    value = point.sequence[motion.round(motion.playRange.value)];
                    point.update(value, false, false);
                });
                preparedDrilldowns.push(series.name);
                series.chart.redraw();
            }
        });
    }
}

// This function updates Motion with the current series (when 
// drilldown is triggered, the current chart series are swapped).
function updateChart(e) {
    var motion = e.target.motion;
    if (motion) {
        motion.dataSeries = e.target.series;
    }
}

通过图表事件调用函数：

chart: {
    events: {
        // Called for each redraw
        redraw: function (e) {
            // Call updateChart() for each redraw
            updateChart(e);

            // This is only called once per series and
            // drilldown series.
            prepareDrilldowns(e);
        }
    }
}

Answer 2

向下钻取图表不应以这种方式使用。它们旨在显示数据的类别和子类别。您无法深入查看子类别，然后将一组数据与另一组数据进行比较。

根据您的示例数据，我有两个建议：

从三个主要类别（动物，水果，汽车）开始，让他们深入到子类别（例如，“动物”钻到猫，狗，牛，羊，猪）。每个类别和子类别只有一列（五只猫，两只狗等）。
从两个主要类别（猫，狗）开始，让他们深入到他们的子类别（例如，“猫”深入到值[5,1,2,3,4]）。您需要有理由将猫与狗进行比较（可能是五只短毛，一种是长毛，两种是混合品种等）。

考虑一下您希望向读者解释什么样的比较，以及他们理解这些比较的最清晰，最简单的方法。

钻取气泡图Highcharts中的动作

2 个答案: