Opencart中jqvmap伊朗地图仅Edge正常 Chrome/Firefox不显示如何修复

问题根因 #

该伊朗地图文件内的SVG路径数据不符合W3C SVG规范，Edge浏览器的SVG解析器容错性更高，可识别不规范的路径语法正常渲染，Chrome、Firefox对路径格式校验严格，存在语法问题时会直接拒绝渲染。

修复操作步骤 #

• 提取地图文件中所有省份对应的path属性值，逐个校验
• 用SVG校验工具（IDE自带SVG校验插件或本地校验工具均可）定位路径中的错误点，常见错误包括：路径内存在多余空字符、坐标值存在重复小数点、路径命令（M/L/C/Z等）与坐标值之间存在非法分隔符、路径未正确闭合、字符串存在未转义的特殊字符
• 修正所有非法路径后，替换回原地图文件的对应位置，保留原有jQuery.fn.vectorMap('addMap', 'iran', ...)的整体结构，不要修改地图宽高、省份ID与名称的映射配置
• 本地验证修改后的文件，在Chrome中加载测试，若仍无法渲染可打开浏览器控制台查看SVG解析类报错，根据报错信息定位剩余问题
• 若不想手动修改路径，可更换其他社区维护的合规伊朗jqvmap地图文件，注意匹配你当前使用的jqvmap版本，避免API不兼容

Opencart后台适配注意事项 #

• 替换地图文件后，修改后台仪表盘的地图初始化代码，将原世界地图的标识参数改为iran，同时调整地图缩放、宽高参数适配现有模块尺寸
• 测试前清空Opencart系统缓存与浏览器缓存，避免旧文件干扰测试结果

内容的提问来源于stack exchange，提问作者mehdi seifabadi