Question

我创建了混合应用程序，默认设置是当我们悬停在图表中时显示的工具提示..但是，不会悬停在移动设备中。如何在混合应用程序图表中显示工具提示??

$(function () {

    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Stacked column chart'
        },
        xAxis: {
            categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total fruit consumption'
            }
        },
        tooltip: {
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
            shared: true
        },
        plotOptions: {
            column: {
                stacking: 'percent',
                dataLabels: {

                        format : '{point.percentage:.2f}%',
                        enabled: true,
                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                        style: {
                            textShadow: '0 0 3px black'
                        }
                    }
            }
        },
        series: [{"name":"Noc Siklus 5","data":[0]},{"name":"Noc Siklus 4","data":[4503]},{"name":"Noc Siklus 3","data":[44114]},{"name":"Noc Siklus 2","data":[208034]},{"name":"Noc Siklus 1","data":[483951]}]
    });
});

我为此问题创建了jsfiddle

我希望工具提示显示所有带触摸功能的数据，我可以这样做吗？

非常感谢

Answer 1

工具提示无法显示，因为堆栈未全部选中，就像悬停方法一样，但如果全部选中堆栈，则可以显示工具提示。

我刚才添加了以下代码：

      series: {
                    events: {
                        mouseOver: function() {
                             this.series.setState('hover');

                        },
                        mouseOut: function(){
                             this.series.setState('');
                        }
                    }
            }

混合应用中的工具提示Highcharts

1 个答案: