마우스 위치에서 이미지/모양이 필요합니다.

Question

현재 연구 프로젝트를 진행하고 있으며 약간의 도움이 필요합니다. JS/Highcharts의 초보자이기 때문에이 문제는 많은 사람들에게 기본적인 것처럼 보일 수 있습니다. 마우스를 원위치로 표시하고 싶습니다 (마우스를 차트 위에 올려 놓을 때마다).

마우스를 클릭했을 때 원이 그 위치에 고정되기를 원하면 원이 마우스 위치를 따르지 않지만 마우스 위치가 그대로 유지됩니다.

원은 renderer.circle()을 사용하여 만들 수 있다고 생각합니다. 마우스 위치는 jQuery function에서 얻을 수 있습니다. 하지만 HighStock 내부에 이들을 통합하는 논리가 필요합니다.

도움이 될 것입니다. 데모 링크 (jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/stock/demo/candlestick/)를 기반으로 솔루션을 제공 할 수 있다면 놀랄 만한.

Answer 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/