鼠標懸停在畫布因此當用戶鼠標懸停形狀，功能將被調用確定的圓HTML5畫布

Question

我想知道如何設置一個區域爲半複雜形狀（圓形）。

我不希望在所有這些使用庫，KineticJS等

目前，我已經添加了一個事件偵聽器到畫布元素，以便在鼠標移動我打電話多種功能;其中一個可以找出相對於畫布的鼠標x/y座標。因此，任何矩形形狀都很容易'傾聽'使用基本的if語句（因爲畫布是交互式的並且重繪每個鼠標移動）。

對於圓形對象，以及說三角形的物體，是有辦法使用類似的方法，利用三角和if語句？

還是有更好的方法來有一個畫布上該鼠標，調用一個函數在多個領域？

乾杯

Answer 1

如果你知道鼠標是，你知道哪裏有圓圈是在畫布上，然後將鼠標的圓圈內時，從鼠標到圓心的距離小於半徑。如果這是真的，請手動撥打您需要撥打的電話。

希望這有助於

Answer 2

如果你想有多個半複雜的形狀和不想做任何複雜的數學運算功能，您可以隨時使用鬼畫布。

的想法是，當你要測試的形狀，您繪製每個相關外形在記憶畫布和測試鼠標的X/Y像素，看看如果事情是存在的。

我詳細說明如何做到這一點在this tutorial.

它精美的作品爲少量的對象，但如果您計劃在具有在屏幕上超過〜200個對象，你會想更快的切換，數學方法。