d3.js скользящая средняя линейная диаграмма (пользовательская интерполяция) с подсказкой

Question

Я пытаюсь добавить подсказку в свою линейную диаграмму d3 js. Большинство решений, по-видимому, основаны на вычислениях кругов, чтобы облегчить всплывающие подсказки. Но это, к сожалению, не работает для меня. У моей линейной диаграммы есть пользовательская интерполяция (основанная на движущейся функции avarage), и когда я использую свои данные для построения кругов, они заканчиваются по всей диаграмме (что ожидается, строка - среднее значение, а не сами значения).

У кого-нибудь есть указатели? Круги (путь рассеяния) отлично подходят, но их нужно рассчитывать с той же скользящей средней, что и линия. Я думаю о какой-то функции, которая дает координаты для функции скользящего среднего, а затем выполняет «нормальный» круглый материал? Но это означает, что дубликат функции в одном у меня уже есть ...

Update3 - Это не работает, так как я до сих пор, очевидно, только получать значения, я думаю, что я получил сейчас

// 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}; 
    }); 
}; 

Приведенных выше код даст значения для первого/последнего наблюдения, но таковые не являются н-скользящим средним. Итак, почти там.

Answer 1

Если вы знаете положение своего графика и индекс оси y в текущем отображаемом фрейме, вы можете связать эти значения с координатами мыши x и y из события mouseover и вычислить значение, которое должна иметь строка «should» этоgiven пункт. Это не слишком точно, но это помогло мне.

Это ответ на технику, если вы хотите увидеть какой-то код, который я могу предоставить вам позже, когда им домой.