在echart中怎么让地图cad填充区域生成边线边线隐藏

e_charts如何添加地图markPoint的点击事件?????比如我要点击下图中的那个点并且出现浮动框_百度知道
e_charts如何添加地图markPoint的点击事件?????比如我要点击下图中的那个点并且出现浮动框
是点击后弹出新窗口,不是地图上那个标签框,那个原本就有的
我有更好的答案
&&&&&&&&&nbsp:'山东省事业费开支情况'&,&&&&&&&&&&&&&&&calculable&;&&&&nbsp:&&&&&,'&&&&nbsp:'bottom'&&&&&&&&&&&&&nbsp,fontWeight:&#39:'#333'&&&nbsp:&&&&&&&&&&&&},&&&&&&&&&&&&&&&&series:&[&&&&&&&&{&&&&&&&&&&&&name:'开支比例',&&&&&&&&&&&&type:'map',&&&&&&&&&&&&mapType:'山东',&&&&&&&&&&&&selectedMode:&'single',&&&&&&&&&&&&itemStyle:&{&&&&&&&&&&&&&&&&normal:&{&label:&{&show:true&},color:'black'&},&&&&&&&&&&&&&&&&emphasis:&{&label:&{&show:true}&}&&&&&&&&&&&&},&&&&&&&&&&&&mapLocation:{x:'center',y:'center'},&&&&&&&&&&&&mapValuePrecision:2,&&&&&&&&&&&&roam:false,&&&&&&&&&&&&data:&[&{name:&&烟台市&,value:&Math.round(Math.random()*1000)},&{name:&&临沂市&,value:&Math.round(Math.random()*1000)},&{name:&&潍坊市&,value:&Math.round(Math.random()*1000)},&{name:&&青岛市&,value:&Math.round(Math.random()*1000)},&{name:&&菏泽市&,value:&Math.round(Math.random()*1000)},&{name:&&济宁市&,value:&Math.round(Math.random()*1000)},&{name:&&德州市&,value:&Math.round(Math.random()*1000)},&{name:&&滨州市&,value:&Math.round(Math.random()*1000)},&{name:&'聊城市',value:&Math.round(Math.random()*1000)},&{name:&&东营市&,value:&Math.round(Math.random()*1000)},&{name:&&济南市&,value:&Math.round(Math.random()*1000)},&{name:&&泰安市&,value:&Math.round(Math.random()*1000)},&{name:&&威海市&,value:&Math.round(Math.random()*1000)},&{name:&&日照市&,value:&Math.round(Math.random()*1000)},&{name:&&淄博市&,value:&Math.round(Math.random()*1000)},&{name:&&枣庄市&,value:&Math.round(Math.random()*1000)},&{name:&&莱芜市&,value:&Math.round(Math.random()*1000)}&&&&&&&&&],&&&&&&&&geoCoord:&{&&&&&&&&&&&&&&烟台&:[120.78,37.63],&&&&&&&&&&潍坊&:[119.14,36.64],&&&&&&&&&&临沂&:[118.35,35.40],&&&&&&&&&&青岛&:[120.50,36.45],&&&&&&&&&&济南&:[117.20,36.98],&&&&&&&&&&莱芜&:[117.70,36.38],&&&&&&&&&&滨州&:[117.87,37.60],&&&&&&&&&&聊城&:[115.96,36.51],&&&&&&&&&&日照&:[119.32,35.61],&&&&&&&&&&泰安&:[117.07,36.16],&&&&&&&&&&济宁&:[116.88,35.45],&&&&&&&&&&枣庄&:[117.36,35.00],&&&&&&&&&&淄博&:[118.08,36.72],&&&&&&&&&&德州&:[116.73,37.32],&&&&&&&&&&威海&:[122.00,37.25],&&&&&&&&&&东营&:[118.75,37.67],&&&&&&&&&&菏泽&:[115.66,35.32]&&&&&&&&}&&&&&&&&},&&&&&&&&{&&&&&&&&&&&&name:&'存在超支项目',&&&&&&&&&&&&type:&'map',&&&&&&&&&&&&mapType:&'山东',&&&&&&&&&&&&data:[],&&&&&&&&&&&&markPoint&:&{&&&&&&&&&&&&&&&&symbol:'star',&&&&&&&&&&&&&&&&symbolSize&:&10,&&&&&&&&&&&&&&&&effect&:&{&&&&&&&&&&&&&&&&&&&&show:&true,&&&&&&&&&&&&&&&&&&&&color:'red',&&&&&&&&&&&&&&&&&&&&shadowColor:'red',&&&&&&&&&&&&&&&&&&&&//period:&10,&&&&&&&&&&&&&&&&&&&&shadowBlur&:&0&&&&&&&&&&&&&&&&},&&&&&&&&&&&&&&&&itemStyle:{&&&&&&&&&&&&&&&&&&&&normal:{&&&&&&&&&&&&&&&&&&&&&&&&label:{show:false}&&&&&&&&&&&&&&&&&&&&}&&&&&&&&&&&&&&&&},&&&&&&&&&&&&&&&&data&:&[&&&&&&&&&&&&&&&&&&&&&{name:&&菏泽&,&value:500}&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&]&&&&&&&&&&&&}&&&&&&&&}&&&&]&&&&};&var&ecConfig&=&require('echarts/config');&myChart.on(ecConfig.EVENT.CLICK,&eConsole);&function&eConsole(param){&&&&&&&alert(1111);&&&&&alert(param.name);&};&]API上不是有吗?option=&{&&&nbsp,&&低'&nbsp:[',&&&&&&&&&&&&&&&&&&&x:'&nbsp:&&&nbsp,&&&&&&&nbsp,&&&nbsp:'right';&高&#39:&&&&&yellow'],&&&&&&&&&&&&&&&};&]&&&&&&&&&&&&&&&},&&&&&&&&&&&&&&&&dataRange:&{&&x;&nbsp,&&&x;&&&&nbsp,&&bolder';&,'&&&&&{&&&&&&&&&&&&&&&&&&&&&&{&&&&&&&&&&&&&&&&&&&&trigger:'&&nbsp,&&&nbsp:'vertical'&&&};&nbsp,color:'center'&&&&&{&&&&&&&&&&&&&&&&&&&&&&&nbsp:&&,&&&&&&&&&&&&&&&&&&&&textStyle:{fontSize:&20;data:&['开支比例'&&&&true&&&&&&&&&&&&&&&y:&&&&&&&&&&&&1000,&&&&&&&&&&&&&&&color:['orange'&&&&&&&&&&&item'&&&&&&&&&&&&&&&&},&&&&&&&&&&&&&&&&left';&&&&&0;&&&&nbsp
采纳率:56%
){console.init(}}), function (params) {if(params.log(params).getElementById(id))var charts =charts.setOption(option);charts .on('click'.componentType == &markPoint&quot
1条折叠回答
为您推荐:
其他类似问题
换一换
回答问题,赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。echart地图如何实现在一个页面上显示2个地市或者2个县
[问题点数:40分]
echart地图如何实现在一个页面上显示2个地市或者2个县
[问题点数:40分]
只显示楼主
取消只显示楼主
匿名用户不能发表回复!|在 SegmentFault,学习技能、解决问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
问题对人有帮助,内容完整,我也想知道答案
问题没有实际价值,缺少关键内容,没有改进余地
我用echarts的中国地图,想要做到,点击某个区域被选中后,在一个文本框中显示城市的名称,还能获取到id,怎么能获取到?下面是我的配置代码:
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('J-echart'));
// 指定图表的配置项和数据
var option = {
name: '中国',
type: 'map',
mapType: 'china',
selectedMode : 'multiple',
show: true
emphasis: {
show: true
{name:'广东', selected:true}
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
答案对人有帮助,有参考价值
答案没帮助,是错误的答案,答非所问
myChart.on('click', function (params) {
console.log(params.name);
同步到新浪微博
分享到微博?
关闭理由:
删除理由:
忽略理由:
推广(招聘、广告、SEO 等)方面的内容
与已有问题重复(请编辑该提问指向已有相同问题)
答非所问,不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因(请补充说明)
我要该,理由是:
在 SegmentFault,学习技能、解决问题
每个月,我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。(龙天论坛)
(黑马课程)
(前端小白)
第三方登录:今天写项目需要一个安徽地图,但echart自带的安徽地图还是老版的,仍有巢湖市,但客户要求不能有,只好重新找,
后发现ECharts 地图数据在线生成工具 :http://ecomfe.github.io/echarts-map-tool/ 生成的json文件安徽省是新版本的,就使用echart的扩展地图功能
写了一遍总是echart.util报错,最后仔细找了下api。发现
最后这样写才没有错误显示。但是地图一直加载不出来。后面看里面的格式以为是自己下的json是压缩版的就勾掉了压缩准备先试试看是不是解码有问题
下载后发现数据好像是一样的,最后仔细观察居然都是93K,完全没有什么卵用~话说百度你是来搞笑的嘛~
没办法就在网上找啊找啊,找到很多说本地解析不了json,我就信了,重新建个项目,拖进去,运行~嚯~又白忙活了
那没办法啊,只能试试其他地图了,下了个中国地图,md居然可以!难道是安徽地图json炸了?然后我就试试钩去了,看看是不是这个问题
居然显示了
卧槽。和我想的一样。合肥也没了。。。
最后看了下json格式,又想了想前面的93k,发现很大可能是编码的问题。就想着解码下这个json
用这个方法一直报错,妈的只好在找api,发现这个和上面的格式是一样的就试了试
require('echarts/util/mapData/params').params.decode(data)
还是报错,最后就用js的decodeURI()试了试。还是不行~就在我要放弃的时候。一个不小心写成了
require('echarts/util/mapData/params').decode(data)
md !!!!!!!! 居然显示了
万恶的巢湖也没了,我的天~
最后献上代码
require('echarts/util/mapData/params').params.anhui = {
getGeoJson: function (callback) {
$.getJSON('geoJson/anhui.json', function (data) {
// 压缩后的地图数据必须使用 decode 函数转换
callback(require('echarts/util/mapData/params').decode(data));
附加套餐:
1.鼠标移动事件
var ecConfig = require('echarts/config');
myChart.on(ecConfig.EVENT.HOVER, function (param) {
var selectedName = param.
showTextInfo(selectedName);//通过选择的市名显示信息
2.自定义formatter (再也不用担心只显示一个了),这里用的是静态数据~
var data_school = [
{ name: '六安市', value: 10 },
{ name: '安庆市', value: 10 },
{ name: '滁州市', value: 10 },
{ name: '宣城市', value: 10 },
{ name: '阜阳市', value: 10 },
{ name: '宿州市', value: 10 },
{ name: '黄山市', value: 10 },
{ name: '亳州市', value: 10 },
{ name: '池州市', value: 10 },
{ name: '合肥市', value: 10 },
{ name: '蚌埠市', value: 10 },
{ name: '芜湖市', value: 10 },
{ name: '淮北市', value: 10 },
{ name: '淮南市', value: 10 },
{ name: '马鞍山市', value: 10 },
{ name: '铜陵市', value: 10 }
var data_specialty = [
{ name: '六安市', value: 20 },
{ name: '安庆市', value: 20 },
{ name: '滁州市', value: 20 },
{ name: '宣城市', value: 20 },
{ name: '阜阳市', value: 20 },
{ name: '宿州市', value: 20 },
{ name: '黄山市', value: 20 },
{ name: '亳州市', value: 20 },
{ name: '池州市', value: 20 },
{ name: '合肥市', value: 20 },
{ name: '蚌埠市', value: 20 },
{ name: '芜湖市', value: 20 },
{ name: '淮北市', value: 20 },
{ name: '淮南市', value: 20 },
{ name: '马鞍山市', value: 20 },
{ name: '铜陵市', value: 20 }
require('echarts/util/mapData/params').params.anhui = {
getGeoJson: function (callback) {
$.getJSON('geoJson/anhui.json', function (data) {
// 压缩后的地图数据必须使用 decode 函数转换
callback(require('echarts/util/mapData/params').decode(data));
// 基于准备好的dom,初始化echarts图表
var myChart = ec.init(document.getElementById('echartDiv'));
option = {
subtext: '',
tooltip: {
trigger: 'item',
formatter: function (a) {
res = a[1] + '&/br&共 ' + a[2] + ' 个建设项目';
for (var i = 0; i & data_school. i++) {
if (a[1] == data_school[i].name) {
res += '&/br&学校:' + data_school[i].
if (a[1] == data_specialty[i].name) {
res += '&/br&专业:' + data_specialty[i].
toolbox: {
show: true,
orient: 'vertical',
x: 'right',
y: 'bottom',
feature: {
saveAsImage: { show: true }
dataRange: {
text: ['多', '少'],
realtime: false,
calculable: true,
color: ['orangered', 'yellow', 'lightskyblue']
type: 'map',
mapType: 'anhui', // 自定义扩展图表类型
selectedMode: false,
itemStyle: {
normal: { label: { show: true } },
emphasis: { label: { show: true } }
{ name: '六安市', value: Math.round(Math.random() * 500) },
{ name: '安庆市', value: Math.round(Math.random() * 500) },
{ name: '滁州市', value: Math.round(Math.random() * 500) },
{ name: '宣城市', value: Math.round(Math.random() * 500) },
{ name: '阜阳市', value: Math.round(Math.random() * 500) },
{ name: '宿州市', value: Math.round(Math.random() * 500) },
{ name: '黄山市', value: Math.round(Math.random() * 500) },
{ name: '亳州市', value: Math.round(Math.random() * 500) },
{ name: '池州市', value: Math.round(Math.random() * 500) },
{ name: '合肥市', value: Math.round(Math.random() * 500) },
{ name: '蚌埠市', value: Math.round(Math.random() * 500) },
{ name: '芜湖市', value: Math.round(Math.random() * 500) },
{ name: '淮北市', value: Math.round(Math.random() * 500) },
{ name: '淮南市', value: Math.round(Math.random() * 500) },
{ name: '马鞍山市', value: Math.round(Math.random() * 500) },
{ name: '铜陵市', value: Math.round(Math.random() * 500) }
到此~ok~此时应有掌声
阅读(...) 评论()}

我要回帖

更多关于 cad填充区域生成边线 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信