可點擊的線條和圓圈與HTML畫布

Question

我正在考慮製作一個應用程序，在某些點上顯示一個圖形，將人們隨着時間和空間映射。垂直訪問是位置，水平訪問是時間，每個人都由一條線標識。在任何有意義的地方，他們都有一個更大的點。從概念上講，點擊點會顯示關於該特定點的數據，但點擊該線上的其他任何位置都會顯示該人的詳細信息。假設，當你將鼠標懸停在線上時，線應該改變顏色，當你將鼠標懸停在點上時，點應該改變顏色。

我知道我可以用閃光燈很容易地做到這一點，但我想知道如果這些日子有什麼辦法可以使用html和javascript來做到這一點。可能嗎？ （兼容性不是問題，我唯一瞄準的機器是我自己的。）

謝謝！

Answer 1

您可以使用畫布進行此操作，但使用SVG可能會更簡單。

由於SVG使用DOM，因此您可以使用內置方法來處理像點擊等事件的事件，而不必像使用canvas一樣編寫自己的處理代碼。

有幾個庫使SVG更簡單和跨瀏覽器兼容，如Raphael和Dojo的dojox.gfx庫。

Answer 2

您可以創建點作爲覆蓋div s，因此您可以輕鬆處理點擊等。當然，您必須非常整齊地整理定位。 但是，突出顯示該行將涉及手動計算點到行距離並重新繪製。