Я сделал линейный график с помощью d3.js (см. Прикрепленное изображение 1).
Мне удалось вставить подсказки на графике точек при наведении курсора. Я бы тоже хотел изменить цвет и размер точек. Я пытался разными способами, но это кажется действительно сложным. Любая помощь? Вот кусок кода:
svg.selectAll("dot")
.data(data)
.enter().append("circle")
.attr("r", 5.5)
.style("fill", "#fff8ee")
.style("opacity", .8) // set the element opacity
.style("stroke", "#f93") // set the line colour
.style("stroke-width", 3.5)
.attr("cx", function(d) { return x(d.date); })
.attr("cy", function(d) { return y(d.close); })
.on("mouseover", function(d) {
div.transition()
.duration(70)
.style("opacity", .7)
;
div .html(formatTime(d.date) + "<br/>" + d.close)
.style("left", (d3.event.pageX) + "px")
.style("top", (d3.event.pageY - 28) + "px");
})
.on("mouseout", function(d) {
div.transition()
.duration(200)
.style("opacity", 0);
});