如何显示工具提示在Sparkline图从代码

问题描述 投票:0回答:1

我想创建一个仪表板页面,如果用户点击一个点的图形,然后用一个点唯一标识符所有图形应使工具提示显示。这适用于除迷你所有图表。下面的现场演示显示了默认highcharts火花的demo,但是我的只是有一个点(条形图1点)。错误仍然是相同的:

遗漏的类型错误:在a.Tooltip.refresh无法读取的未定义的属性“tooltipOptions”(highcharts.src.js:22676)

我使用的显示/隐藏工具提示的代码是:

function chartPointClick(pointidx) {
    var chartArray = Highcharts.charts;
    for (var i = 0; i < chartArray.length; i++) {
        var thechart = Highcharts.charts[i];
        var theData = thechart.series[0].data;

        if (thechart.renderTo.tagName == 'TD') {
            var theSeries = thechart.series[0]
                console.log(theSeries);
                thechart.tooltip.refresh(theSeries.options.data[0]);
        }
        thechart.redraw();
    }
}

这是通过plotOptions.series.events方法叫做:

events: {
        click: function (event) {
            chartPointClick(event.point.idx);
        }
}

如何激活所述火花工具提示?

现场demo

编辑 - 现场demo使用未功能的单条形图。

javascript highcharts
1个回答
1
投票

工具提示refresh方法接受的第一个参数仅作为点的数组:

    if (thechart.renderTo.tagName == 'TD') {
        var theSeries = thechart.series[0]
        thechart.tooltip.refresh([theSeries.points[0]]);
    }

这里接下来的问题是工具提示,这将导致另一个错误outside选项。我建议你使用:

td,
th {
    ...
    overflow: visible !important;
}

现场演示:https://jsfiddle.net/BlackLabel/qx31oa7m/

API:https://api.highcharts.com/highcharts/tooltip.outside

© www.soinside.com 2019 - 2024. All rights reserved.