企业网站建设模板,百度识图查另一半情头,登陆建设银行官方网站,网站建设公司特色https://datav.aliyun.com/portal/school/atlas/area_selector 可以选择省#xff0c;市#xff0c;区。 也可以直接在地图上点击对应区域。
我的应用场景
我这里用到这个还是一个特别老的大屏项目#xff0c;用的jq写的。显示中国地图边界区域
我们在上面的这个地区选择…https://datav.aliyun.com/portal/school/atlas/area_selector 可以选择省市区。 也可以直接在地图上点击对应区域。
我的应用场景
我这里用到这个还是一个特别老的大屏项目用的jq写的。显示中国地图边界区域
我们在上面的这个地区选择中国区域 点击复制复制下来这个json数据。新建一个china.js
(function (root, factory) {if (typeof define function define.amd) {// AMD. Register as an anonymous module.define([exports, echarts], factory);} else if (typeof exports object typeof exports.nodeName ! string) {// CommonJSfactory(exports, require(echarts));} else {// Browser globalsfactory({}, root.echarts);}
}(this, function (exports, echarts) {var log function (msg) {if (typeof console ! undefined) {console console.error console.error(msg);}}if (!echarts) {log(ECharts is not Loaded);return;}if (!echarts.registerMap) {log(ECharts Map is not loaded)return;}echarts.registerMap(china, 这里是复制下来的json数据);
}));
接着在index.html中引入
script src./js/china.js/script设置echarts 主要配置geo的map属性前面echarts.registerMap的第一个参数是啥咱这里写啥就行了
var option {backgroundColor: #080a20,title: {left: left,textStyle: {color: #fff}},tooltip: {trigger: item},geo: {map: china,zoom: 1,label: {emphasis: {show: false}},roam: true,itemStyle: {normal: {areaColor: #142957,borderColor: #0692a4},emphasis: {areaColor: #0b1c2d}}},
};
var myecharts echarts.init($(.map .geo)[0])
myecharts.setOption(option)html
div classmapdiv classgeo/div
/div