Как нарисовать круги по пути, используя React D3 для всплывающей подсказки для большого набора данных быстро

Question

Диаграмма загружается отлично без подсказки. Вызов всплывающей подсказки (построение круга по пути - около 24000 точек) компонент полностью замедляется. Spinner зависает около 12 секунд перед рендерингом. Ниже приведен цикл, который находится внутри рендера, который замедляется. Любые идеи о том, как визуализировать этот компонент позже (в фоновом режиме) после первой строки рендеринга. Может ли быть другой подход к решению этой проблемы?

tooltip = data.points.map((series, id) => { 
    return series.map((d,i) =>{ 
    return (
    <circle 
     r={this.state.radius} 
     cx={cx(d)} 
     cy={cy(d)} 
     > 
     <cover 
     x={tex} 
     y={fab} 
     /> 
    </circle> 
); 
    }) 

Answer 1

Я нашел решение в этом enter link description here

Использованием D3 с Canvas для построения большого графа является путем. Я также использовал SVG для рендеринга графика.