echarts 支持svg格式

今天研究了下echarts的svg格式。发现用ai生成svg格式的图片，echarts上面显示不了。

经过了多次的百度和谷歌终于找到了用Method Draw画出来的svg格式，echarts就能加载出来。

现附上用echarts加载的svg的方法

链接地址：

足球例子

在echart下面的util包下的mapData的params.js找到mapParams object下面加上

 var mapParams = {
    	'football' : {
     			    getGeoJson: function (callback) {
    			        $.ajax({
    			            url : 'images/football.svg',
    			            dataType: 'xml',
    			            success: function(xml) {
    			                callback(decode(xml))
    			            }
    			        })
    			    }
    	}
        //省略代码
｝
require(
              [
         'echarts',
         'echarts/chart/bar',
         'echarts/chart/line',
         'echarts/chart/map',
         'echarts/util/mapData/params'
              ],
              function (ec) {
               var myChart = ec.init(document.getElementById('priceWarming'));
                 myChart.setOption( {
//	        	    backgroundColor:'#228b22',
                    title : {
                        text : '2014世界杯',
                        subtext: '地图SVG扩展',
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    tooltip : {
                        trigger: 'item'
                    },
                    toolbox: {
                        show : true,
                        feature : {
                            mark : {show: true},
                            dataView : {show: true, readOnly: false},
                            restore : {show: true},
                            saveAsImage : {show: true}
                        }
                    },
                    series : [
                        {
                            name: '2014世界杯',
                            type: 'map',
                            mapType: 'football', // 自定义扩展图表类型
                            roam:true,
                            itemStyle:{
                                normal:{label:{show:true}},
                                emphasis:{label:{show:true}}
                            },
                            data:[
                                {name: '草地', hoverable: false, itemStyle:{normal:{label:{show:false}}}}
                            ],
                            textFixed : {
                                '球门区1' : [0, -20],
                                '球门区2' : [0, -20],
                                '禁区1' : [10, 20],
                                '禁区2' : [-10, 20],
                                '禁区弧线1' : [0, -20],
                                '禁区弧线2' : [0, -20],
                                '中圈' : [0, -20],
                                '开球点' : [0, 20]
                            },
                            markPoint : {
                                symbol:'circle',
                                symbolSize : 20,
                                effect : {
                                    show: true,
                                    color: 'lime'
                                },
                                data : [
                                    {name: '开球点', value: 100, geoCoord:[425.126, 296.913]}
                                ]
                            },
                            markLine : {
                                smooth:true,
                                effect : {
                                    show: true,
                                    scaleSize: 1,
                                    period: 20,
                                    color: '#fff',
                                    shadowBlur: 5
                                },
                                itemStyle : {
                                    normal: {
                                        borderWidth:1,
                                        color: 'gold',
                                        lineStyle: {
                                            type: 'solid'
                                        }
                                    }
                                },
                                data : [
                                    [
                                        {name:'1', geoCoord:[96.879, 186.983]},
                                        {name:'2', geoCoord:[693.786, 297.939]}
                                    ],
                                    [
                                        {name:'2', geoCoord:[753.373, 186.983]},
                                        {name:'1', geoCoord:[156.467, 296.913]}
                                    ]
                                ]
                            }
                        }
                    ]
                });
              }
      );