.addHitRegion（）在Chrome中不起作用

我有最新的Chrome版本，並且在規格中看到它應該支持.addHitRegion()方法，如MDN中所述。由於某種原因，我收到Uncaught TypeError: context.addHitRegion is not a function錯誤。.addHitRegion（）在Chrome中不起作用

我的代碼是如此簡單：

var canvas = document.getElementById('myCanvas'); 
var context = canvas.getContext('2d'); 
context.beginPath(); 
context.rect(10,10,100,100); 
context.fill(); 
context.addHitRegion({'id': 'The First Button', 'cursor': 'pointer'});

如何解決呢？

來源

2016-03-31 Sergei Basharov

呵呵，好像它是在3年前推出的，仍然是實驗性的？我甚至不認爲它可能仍然不穩定。不管怎麼說，還是要謝謝你！ –

因此，你需要在此處設置

從兼容性表實驗標誌在你的鏈接頁面的底部：

此功能的背後是一個功能標誌。將標誌 ExperimentalCanvasFeatures設置爲true以啓用它。

要打開實驗畫布功能，請瀏覽至「chrome：// flags」，打開「啓用實驗畫布功能」並重新啓動。

來源

2016-03-31 15:29:42 JordanHendrix

轉到這裏與您的瀏覽器：鉻：//標誌

然後

設置標誌ExperimentalCanvasFeatures爲true來啓用它。

來源

2016-03-31 15:31:20 Bolza

由於其他答案的狀態，你可以通過標誌來啓用它，但是：你將無法要求你的用戶這樣做。支持僅限於少數瀏覽器。我會因此建議尋找其他解決方案 - 我在這裏列出一些：

一個更好的辦法是使用Path2D objects。它們在定義命中形狀方面提供了相同的靈活性。與isPointInPath()一起使用這些也需要一個路徑對象。將每個路徑存儲在一個數組中，您可以使用該位置進行循環測試。不幸的是，這也僅限於少數瀏覽器，但您至少可以使用poly-fill such as this來解決這個問題（請參閱鏈接中的說明以瞭解限制）。

關於支持和可用性以及需要更多工作的更好的選擇是重建每個想要在上下文上測試的單個路徑，然後使用上面的isPointInPath()來查看鼠標位置在該路徑內。

如果形狀很簡單，例如矩形或圓形，則可以進行簡單的數學測試，這是一種高性能的選擇。

來源

2016-04-01 02:28:12 K3N

.addHitRegion（）在Chrome中不起作用

回答

相關問題