我使用 D3 和面向物件編程創建了一個包含多個圖表的網頁。
作業代碼鏈接--> 
uj5u.com熱心網友回復：
這里解決了潛在的問題，但答案并不能直接解決您的問題。基本上，有第二個可選引數d3.pointer呼叫，target這樣：
如果未指定目標，則默認為源事件的 currentTarget 屬性（如果可用）。如果目標是 SVG 元素，則使用螢屏坐標變換矩陣的逆變換事件的坐標...
您可以按照下面的說明使用此引數，注意如果您嘗試更新，它將破壞您的垂直跟蹤線vis.mouse：
// mouse moving over canvas
vis.mouse = d3.pointer(event); // keep this for the vertical tracking line
vis.mouse2 = d3.pointer(event, d3.select(vis.chartLocation)); // <--- NEW VARIABLE!
現在vis.mouse2有一個相對x和y-所以使用它們你設定style的div：
d3
.select(vis.chartLocation)
.selectAll("#tooltip")
.html((d, i) => {
vis.xDate = d.values[vis.idx - 1].date;
return vis.xDate.toLocaleDateString("pt-PT");
})
.style("display", "block")
.style("left", vis.mouse2[0] "px") // use vis.mouse2
.style("top", vis.mouse2[1] "px") // use vis.mouse2
線索在于您的第一個選擇是vis.chartLocation。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/326002.html
標籤：javascript d3.js