0

我目前正在做一个研究项目,我需要一点帮助。由于我只是 JS/Highcharts 的新手,这个问题对许多人来说似乎很基础。我想在鼠标位置显示一个圆圈(即每当鼠标悬停在图表上时)。

当我单击鼠标(mousedown)时,我希望圆圈停留在该位置,此后圆圈不跟随鼠标位置,而是停留在鼠标点击位置。

我相信可以使用renderer.circle()来制作圆圈。并且鼠标位置可以从jQuery函数中获取。但我需要一个逻辑来将它们合并到 HighStocks 中。

任何帮助将不胜感激。如果您可以根据演示链接(jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/stock/demo/candlestick/)提供解决方案,那就是惊人的。

4

1 回答 1

1

它并不完美(有点不稳定),但以下内容应该可以帮助您入门:

// setup `chart` object ...

var circle = chart.renderer.circle(0, 0, 5).attr({
    fill: 'blue',
    stroke: 'black',
    'stroke-width': 1
}).add()
  .toFront()
  .hide();

var stuck = false;

$(chart.container).mousemove(function(event){
    circle.show();

    if (stuck) {
        return;
    }

    circle.attr({
        x: event.offsetX,
        y: event.offsetY
    });
});

$(chart.container).click(function(event){
    stuck = true;

    circle.attr({
        x: event.offsetX,
        y: event.offsetY
    });
});

这是在行动:http: //jsfiddle.net/Ukh5j/

于 2013-02-21T05:46:14.193 回答