無法從 SVG 圖像元素加載圖像

Question

我試圖加載一個圖像作為 svg 背景，但它只顯示一個損壞的圖像，我認為路徑是正確的（js 和圖像文件在同一目錄下），我嘗試添加'data:image/png;base64,'在前面它仍然不起作用，我也嘗試過localhost，它也不起作用。

  svg
  .append("image")
  .attr("width", "1352px")
  .attr("height", "721px")
  .attr("href", "img.png");

但是我可以從<img>標簽加載圖像。 我改成canvas來顯示圖片，還是不能顯示圖片，但是應用可以在線顯示圖片。

 let img = new Image();
img.onload = function() {
  context.drawImage(img, 0, 0);
};
img.src =
  "img.png";

我在 Chromium 上運行應用程序並使用 Parcel 包。

Answer 1

好的，我想問題是我使用的是 Parcel，所以我需要導入圖像文件。

import img from "./img.png";