echarts的路径问题?报错
@Kener-林峰 你好，想跟你请教个问题：
我想弄一个地图扩展的echarts例子，但是总是报错
我的html文件的路径是：F:\study\web\echarts-2.2.0\echarts-2.2.0\projects\test2.html
svg文件在：F:\study\web\echarts-2.2.0\echarts-2.2.0\projects\svg\football.svg
echarts文件夹的路径：svg文件在：F:\study\web\echarts-2.2.0\echarts-2.2.0\
代码如下：请问路径到底该怎么设置，模块化加载应该注意些什么？谢谢！
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="height:400px"></div>
<!-- ECharts单文件引入 -->
<script type="text/javascript" src="..\build\dist\echarts.js"></script>
<script type="text/javascript" src="js\jquery-2.1.1.min.js"></script>
<script type="text/javascript">
// 路径配置
require.config({
paths: {
echarts: '../build/dist',
'echarts/src/util/mapData':'../src/util/mapData'
}
});
require(
[
'echarts'
],
DrawEChart
);
function DrawEChart(ec) {
var chartContainer = document.getElementById("main");
var myChart = ec.init(chartContainer);
require('echarts/src/util/mapData/params').params.football = {
getGeoJson: function (callback) {
$.ajax({
url: "svg/football.svg",
dataType: 'xml',
success: function(xml) {
callback(xml)
}
});
}
}
var option = {
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]}
]
]
}
}
]
};
myChart.setOption(option);
}
</script>
</body>
写回答
-
https://developer.aliyun.com/profile/5yerqm5bn5yqg?spm=a2c6h.12873639.0.0.6eae304abcjaIB你好请问你的问题解决了吗
2020-06-14 17:48:58赞同 展开评论 打赏
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
