我可以将SVG图像路径转换为图像地图坐标吗?
假设我有这个SVG图片
http://www.openclipart.org/people/ArtFavor/anatomy26.svg我想以某种方式将SVG中的路径转换为Imagemap坐标这样我就可以在其上产生效果/脚本http://www.netzgesta.de/mapper/!
意思是当我在那个解剖结构的特定部分滚动时,我想做出突出显示的效果(要使用的脚本不必是“ mapper”,但我只是作为示例而已]
您可能对此脚本感兴趣:creating-an-image-map-from-svg
[我发现要转换向量/ svg图形的最精确方法是在Adobe Illustrator中打开向量/ eps文件(我使用过Adobe Illustrator CC 2017)。
突出显示路径,然后在“属性”(在主菜单中,“窗口”>“属性”中)中将“图像映射”字段设置为所需的形状。如果要为文字地图构建图像地图,请选择“多边形”。您也可以选择设置“ URL”字段。
一旦遍历每个形状并分配了适用的属性,请进入主菜单,文件>导出>另存为Web(旧版)。然后单击左下方的“预览”,这将在浏览器中打开窗口。在预览时,您可以查看图像下方的HTML图像地图代码。
注意:向量/ svg形状必须是路径。因此,您可能必须释放复合路径(通过右键单击突出显示的形状并选择“发布复合路径”。
[在Adobe中不是很直观,但是到目前为止,我已经找到了最准确的方法。
我发现这本非常有前途的指南。它使用一个名为Mapedit
和Sea Monkey
的程序,我相信它们都是免费的。 http://socrtwo.info/image_map.htm
编辑:
完成同一件事的简单方法是
任何突出显示的区域都可以从原始SVG中剪切,另存为PNG,并夹在div之间以进行翻转和其他操作。 (我以此方式与发光的国家一起制作了世界地图,但效果比预期的要好一些。