SVG图标看起来很模糊-谷歌地图

SVG icon looks blurry - Google Maps

本文关键字:谷歌地图 模糊 图标 看起来 SVG      更新时间:2023-09-26

我在谷歌地图上使用SVG图标作为标记。但是图标看起来很模糊。我想是因为我设置了scale:

    var icon = {
        path: "M418 1005q0 115 47 225t129 192t192 129t234 47t234 -47t192 -129t129 -192t47 -225q0 -222 -134 -388t-338 -209l-130 -410l-130 410q-204 43 -338 209t-134 388z",
        fillColor: '#328327',
        fillOpacity: 1,
        anchor: new google.maps.Point(1000,0),
        rotation: 180,
        strokeWeight: 3,
        strokeColor: 'rgba(0, 0, 0, 0.5)',
        strokeOpacity: 1,
        scale:.03
    };

JSFIDDLE

但没有scale图标就很大。我该怎么修?

谢谢!

将图标调整为:

path: "m 3.2176386,30.816773 q 0,3.152175 2.09098,6.167299 2.09098,3.015125 5.7390104,5.262764 3.6481,2.247637 8.542,3.535917 4.8937,1.288281 10.4104,1.288281 5.5166,0 10.4104,-1.288281 4.8938,-1.28828 8.5419,-3.535917 3.6481,-2.247639 5.739,-5.262764 2.091,-3.015124 2.091,-6.167299 0,-6.08507 -5.9615,-10.635167 -5.9615,-4.550096 -15.0373,-5.728736 l -5.7835,-11.2381914 -5.7836,11.2381914 q -9.0757,1.17864 -15.0373004,5.728736 -5.96149,4.550097 -5.96149,10.635167 z",
anchor: new google.maps.Point(30,0),
scale: 1

您可以使用inkscape.exe 编辑路径

更新的fiddle