Img map vs canvas

Question

我正在做一個項目，工作人員必須在飛機上找到組件。飛機將被掃描並放在一個網絡應用程序中，然後用戶選擇放置的位置。我的第一個想法是imgmap（我工作，計算機仍然有IE瀏覽器，我們正試圖改變爲Firefox或Chrome），但我不知道如何使用戶可見的區域（某種動態覆蓋彩色區域），所以我的第二個建議是使用HTML 5 canvas。

是否最好能與imgmap一起工作，找到一些解決方案來重疊點或至少使用canvas？

注意：在我工作的地方，他們必須更改爲非Windows操作系統，並使用基於Firefox的瀏覽器或Chromium，因此瀏覽器不會被視爲問題的一部分。

Answer 1

是的，我建議使用canvas來做到這一點。

https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial從引用：

<canvas>是可被用於繪製使用 腳本（通常是JavaScript）的圖形的HTML元素。例如，它可以用於繪製圖形，製作照片組合或做簡單（並非如此簡單）的動畫。右側的圖像顯示了一些<canvas> 實現的示例，我們將在本教程的後面部分看到這些實現。

<canvas>最初由Apple爲Mac OS X儀表板和後來在Safari和Google Chrome中實現的 引入。基於Gecko 1.8的 瀏覽器（例如Firefox 1.5）也支持此元素。該元素是WhatWG Web應用程序1.0規範的一部分，也稱爲HTML5的 。

本教程描述如何使用<canvas>元素繪製2D 圖形，從基礎開始。所提供的例子應該給你 你一些清晰的想法，你可以使用畫布做什麼，並將提供代碼 片段，可以讓你開始建立自己的內容。 開始之前

使用元素並不是非常困難，但您確實需要對基本的HTML和JavaScript有所瞭解的 。 <canvas>元素不是 在某些較舊的瀏覽器中受支持，但在所有主流瀏覽器的最新版本 中都受支持。畫布的默認大小爲300px * 150px （width * height）。但是可以使用CSS高度和 寬度屬性來定義自定義大小。爲了在畫布上繪製圖形，我們使用一個 JavaScript上下文對象，它可以即時創建圖形。