在标记图标中使用带有参数的svg

Question

我有一个接受参数来旋转自己的svg文件,并且在html中的对象标记中使用此语法可以正常工作:

<object id="myicon" data="../static/images/icons/icon.svg?trans=rotate(75 16 16)" type="image/svg+xml"></object>

但是,如果我尝试像图标一样使用它,则不起作用,仅显示默认图像标题.

markers[0].set("icon", "../static/images/icons/icon.svg?trans=rotate(75 16 16)")

要么

markers[0].setIcon("../static/images/icons/icon.svg?trans=rotate(75 16 16)")

要么

markers[0].setIcon("../static/images/icons/icon.svg?trans=rotate(75+16+16)")

这不是缓存问题,如果我检查生成的html代码,我可以看到指向图像的完整URL:

<img src="../static/images/icons/icon.svg?trans=rotate(75 16 16)" draggable="false" style="position: absolute; left: 0px; top: 0px; -webkit-user-select: none; width: auto; height: auto; border: 0px; padding: 0px; margin: 0px;">

我缺少什么？,我希望在任何程度上干净地旋转图标.谢谢.

PD:如果我从生成的代码中按照新的chrome选项卡中的图像链接,我可以看到带有正确标题的图像,并且url被映射到:

/images/icons/icon.svg?trans=rotate(75%2016%2016) 

但只能远离地图.

Answer 1

出于隐私原因，如果您使用 SVG 作为图像，即通过 SVG<image>标签、HTML<img>标签或作为背景图像引用它，那么JavaScript将被禁用。