d3.js 툴팁으로 이동 평균 라인 차트 (맞춤 보간)

Question

d3 js 라인 차트에 툴팁을 추가하려고합니다. 대부분의 솔루션은 도구 설명 팝업을 사용하기 위해 계산 된 원을 기반으로 한 것 같습니다. 그러나 그것은 나를 위해 불행하게 일하지 않습니다. 내 선형 차트에는 사용자 정의 보간법 (이동 평균 기능을 기반으로 함)이 있으며 데이터를 사용하여 원형을 그릴 때 차트 전체에서 끝납니다 (이는 예상되는 값이며 값 자체가 아니라 평균입니다).

누군가에게 어떤 지침이 있습니까? 원 (scatterplot-way)은 완벽하게 괜찮지 만 라인과 동일한 이동 평균으로 계산해야합니다. 나는 이동 평균 함수에 대한 좌표를 제공하고 "정상적인"서클 물건을 수행하는 일종의 함수를 생각하고 있습니까? 하지만 그건 내가 이미 가지고있는 것과 중복 기능 ...

갱신 3의 의미 - 나는 아직도 분명히 값만 받고 있어요 때문에 작동하지 않습니다, 나는 지금

// Add event listeners/handlers 
svg.on('mouseover', function() { 
    marker.style('display', 'inherit'); 
}).on('mouseout', function() { 
    marker.style('display', 'none'); 
}).on('mousemove', function() { 
    var mouse = d3.mouse(this); 
    marker.attr('cx', mouse[0]); 
    var datumVar = x.invert(mouse[0]), 
    index = bisect(dataFilter, datumVar), 
    startDatum = dataFilter[index - 1], 
    endDatum = dataFilter[index], 
    interpolate = d3.interpolateNumber(startDatum.Kvot, endDatum.Kvot), 
    range = endDatum.datum - startDatum.datum, 
    valueY = interpolate((datumVar % range)/range); 
    console.log((valueY)); 
    marker.attr('cy', y(valueY)); 
}); 

을 거 같아요 내 값의 엄마를 포함하는 객체를 생성

최종 코드 :

var movingWindowAvg = function (arr, step) { // Window size = step 
    return arr.map(function (_, idx) { 
     var wnd = arr.slice(idx, idx + step); 
     var result = d3.sum(wnd.map(function(d) { return d.Kvot; }))/wnd.length; if (isNaN(result)) { result = _; } 
     var tmpDate = wnd[0].datum; 
     return {Kvot: result, datum: tmpDate}; 
    }); 
}; 

위의 코드는 마지막/첫 번째 관측 값을 줄 것이다하지만, 그 평균을 N-이동하지 않습니다. 그래서 거의 다 왔어.

Answer 1

그래프의 위치와 표시된 현재 프레임의 y 축 인덱스를 알고있는 경우 mouseover 이벤트의 마우스 x 및 y 좌표에 해당 값을 연결하고 'should'의 값을 계산할 수 있습니다 그 점. 그것의 너무 정확하지 않지만 그것은 나를 위해 직업을했다.

나중에 im home을 제공 할 수있는 코드를보고 싶다면이 기술에 대한 응답입니다.