禁用具有标志的点的工具提示

时间:2013-07-09 15:15:32

标签: highstock

我正在尝试创建一个高价图表,其中一些点标有圆圈。当您将鼠标悬停在图表上时,图表中的所有点都有一个工具提示。

但是,带有标志的点的工具提示应该是标志中的一个。我一直试图看看highstock是否有一个API,我可以通过它来说明是否应该显示工具提示而不是基于该点有标志的条件。但是,我仍然坚持如何找到一个点是否有旗帜。

这是我的例子的小提琴:http://jsfiddle.net/ulhas87/WSDza/

{
    rangeSelector: {
        selected: 1
    },
    title: {
        text: 'USDtoEURexchangerate'
    },
    yAxis: {
        title: {
            text: 'Exchangerate'
        }
    },
    tooltip: {
        formatter: function(){
            console.log(this);
            if(this.point){
                //if this point has a flag then return false 
                //else return the tooltip for this point 
                return this.y;
            }else{
                //this is a flag - hence return the flag tooltip
                return this.y;
            }
        },

    },
    series: [
        {
            name: 'USDtoEUR',
            data: data,
            id: 'dataseries',
            tooltip: {
                valueDecimals: 4
            },
            followPointer: false
        },
        {
            type: 'flags',
            data: [
                {
                    x: Date.UTC(2011,
                    1,
                    14),
                    title: '',
                    text: 'Shape: "circle"'
                },
                {
                    x: Date.UTC(2011,
                    3,
                    28),
                    title: '',
                    text: 'Shape: "circle"'
                }
            ],
            onSeries: 'dataseries',
            shape: 'circle',
            width: 1,
            height: 1,
            y: -4,
            states: {
                hover: {
                    fillColor: '#395C84'//darker
                }
            },
            point: {
                events: {
                    mouseOver: function(){
                        console.log(this);
                    }
                }
            },
            zIndex: 10
        },
        {
            type: 'flags',
            data: [
                {
                    x: Date.UTC(2011,
                    2,
                    10),
                    title: 'C',
                    text: 'Shape: "flag"'
                },
                {
                    x: Date.UTC(2011,
                    3,
                    11),
                    title: 'C',
                    text: 'Shape: "flag"'
                }
            ],
            color: '#5F86B3',
            fillColor: '#5F86B3',
            onSeries: 'dataseries',
            width: 16,
            style: {
                //textstylecolor: 'white'
            },
            states: {
                hover: {
                    fillColor: '#395C84'//darker
                }
            },
            marker: {
                fillColor: '#000000'
            }
        }
    ]
}

感谢任何帮助。感谢

1 个答案:

答案 0 :(得分:0)

问题在于你的樱桃与你用于旗帜的樱桃不一样。查看更新版本:http://jsfiddle.net/WSDza/3/

另外,我建议将较低的hideDelay设置为观察者,该点没有工具提示。