SVG image xlink:href 设置失败_html/css_WEB-ITnose

　　公司比较频繁的业务需求，需要在地图上面，标注地区的信息，考虑到兼容性问题，在实际开发中是通过raphael.js绘制地图信息，进行相关交互

产品部门同事辛苦的画SVG地图，可配置地图块与实际地区code之间的关系，又比较麻烦，就可了相关配置信息的工具，通过AAUTO，IE内核写的

最近实际使用了下node-webkit + 有新项目地图配置需要升级 + 看了些avalon.js,准备升级下配置工具，这个等完成了分享下，顺便分享下最近填过的坑

　　扯了半天背景，进入正题

　　SVG image xlink:href 设置失败

　　实际是在使用avalon的时候， SVG节点内需要引入图片，用作点的显示，通过level属性，动态修改图形

　　

<image ms-if-loop="el.shap == 'centre'" ms-attr-x="el.x" ms-attr-y="el.y" width="10" height="10" ms-attr-xlink:href="{{el.level}}.png"  style="cursor: pointer;" />

　　在修改level值后没有任何反映，查了半天资料未果，最后试了下，发现是xlink:href在一开始需要有相关默认值，在模版生成节点的时候其实是没有这个属性的导致的，所以手动添加了xlink:href属性

<image ms-if-loop="el.shap == 'centre'" ms-attr-x="el.x" ms-attr-y="el.y" width="10" height="10" ms-attr-xlink:href="{{el.level}}.png" xlink:href="" style="cursor: pointer;" />