Добавить подсказку навсегда на конкретном SVG в D3 - PullRequest
Новая
       3

Добавить подсказку навсегда на конкретном SVG в D3

0 голосов
/ 12 марта 2020

Я пытаюсь добавить всплывающую подсказку к воронкообразной диаграмме, которая сделана из SVG. Я хочу, чтобы всплывающая подсказка была stati c, и она должна отображаться во время загрузки графика, и она должна оставаться на графике статически. Это должно выглядеть примерно так image

Я пробовал кое-что: 

var tip = d3.tip()
        .attr('class', 'd3-tip')
        .html(function (d) {
        return '<table style="width:100px"><tr><td style="font-size:14px; font-weight:bold"> ' + d.ind + '</td></tr><tr><td style="font-size:10px">Total Cases:</td></tr><tr><td font-weight-800" style="font-size:12px; color: #2B597C; font-weight: bold" >' + d.tot_cases + '</td></tr></table>'
            ;
        })
    svg.call(tip);
        g.append("polygon")
            .attr("points", points.map(function (d) { return [d.x, d.y].join(","); }).join(" "))
            .attr("stroke", "white")
            .attr("stroke-width", 1)
            .attr('fill', function () { return (color2[i]) })
            .each(function(){
                 if (data[i].ind == "Notified") {
                 // tip.style('top', (event.pageY) + 500 + "px");
                 // tip.style('left', (event.pageX) + 30+ "px");
                tip.show(data[i], this);
        }
      })

Я не получаю подсказку в правильном положении. Я изменил координаты, но это не работает. Это выглядит так: image Любые идеи о том, как сделать так, чтобы он выглядел c без наведения мыши или наведения мыши. Весь мой код в здесь

...