Я пытаюсь добавить всплывающую подсказку, по какой-то причине она не отображается. Пожалуйста помоги. Вот код https://codepen.io/gladiator_kris/pen/pojgEyQ?editors=0010
var tooltip = svg.append("div")
.attr("id", "tooltip")
.style("opacity", 0.8);
.on("mouseover", function(d) {
tooltip.style("display", "flex")
.html(function() {return 'tooltip'})
.style("left", (d3.event.pageX + 10)+"px")
.style("top", (d3.event.pageY - 28) + "px")
})
.on("mouseout", () => {
tooltip.style("display", "none")
});
Благодарю!
0
Krishna
15 Апр 2020 в 20:01
1 ответ
Лучший ответ
Проблема вызвана тем, что всплывающая подсказка представляет собой HTML-код div
и добавляется к SVG. div
не является допустимым тегом SVG, поэтому не отображается.
Это можно исправить, добавив div к div#graph
, как показано ниже:
var tooltip = d3.select("#Graph").append("div")
0
Mehdi
15 Апр 2020 в 22:24
Похожие вопросы
Новые вопросы
d3.js
D3.js - это библиотека JavaScript для создания интерактивных связанных с данными визуализаций документов с использованием HTML, SVG и Canvas.