SVG與Canvas 可以重疊在一起嗎
SVG與canvas完全重疊，我想做個地圖的可視化，在地圖上加線條動畫，想用SVG畫地圖，在地圖上獲取坐標，然后在canvas層畫線條動畫
阿呆不呆
2015-01-30
3 回答
舉報
0/150
提交
取消
2020-05-24
canvas可以直接載入svg，下面附上代碼
<!DOCTYPE?html>???? <html?lang="en">???? <head>???? <meta?charset="UTF-8">???? <title>Document</title>???? </head>???? <body>???? <svg?id="svg"?width="100"?height="100"?style="background:?wheat;">???? <circle?cx="50"?cy="50"?r="25"?fill="red"></circle>???? </svg>???? <canvas?id="canvas"?style="background:?pink"></canvas>???? <script>???? const?canvas?=?document.getElementById('canvas')???? const?gd?=?canvas.getContext('2d')???? const?svg?=?document.getElementById('svg')???? let?xml?=?new?XMLSerializer().serializeToString(svg)???? xml?=?encodeURIComponent(xml)???? xml?=?unescape(xml)???? xml?=?btoa(xml)???? const?img?=?new?Image()???? img.src?=?'data:image/svg+xml;base64,'?+?xml???? img.onload?=?()?=>?{???? console.log(img.width,?img.height)???? gd.drawImage(???? img,???? 0,?0,?img.width,?img.height???? )???? }???? </script>???? </body>???? </html>2017-12-14
請問貼主實現了嗎？
2016-09-05
這個是可以的