我在svg标签内嵌入图像并设置为标记网址,即使图像有效,图像也不显示它显示为已损坏。我该如何显示图像?在下面的小提琴我试图显示svg标记。 svg标记不显示已嵌入svg标记的图像。
<div id="map_canvas"></div>
var geocoder;
var map;
function initialize() {
var map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(37.4419, -122.1419),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var time = "00:15:30";
var testIcon = {
anchor: new google.maps.Point(10, 10),
url: 'data:image/svg+xml;utf-8,<svg width="100" height="100"
class="crop-shapes" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"> <line x1="28" y1="40"
x2="32" y2="60" style="stroke:#666; stroke-width:1"/><line x1="32"
y1="60" x2="50" y2="50" style="stroke:#666; stroke-width:1"/><circle
cx="45" cy="30" r="20" fill="#2ECC71" style="stroke:#000; stroke-
width:1"/><text id="timer_text" class="timer" x="30" y="32"
fill="#000000" font-size="9" font-weight="bold">00:10:30</text>
<circle id="svg_circle" cx="20" cy="70" r="15" fill="#ffffff"
style="stroke:#000; stroke-width:1"/><image
xlink:href="https://www.gstatic.com/webp/gallery3/1.png" x="0"
y="45" height="50px" width="50px"/></svg>'
}
marker = new google.maps.Marker({
position: map.getCenter(),
map: map,
icon: testIcon,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, "load", initialize);