watch: {
showData() {
// 当传进来的数据变了之后重新渲染
this.$nextTick(function () {
this.init(“ditu”)
})
},
},
mounted() {
// 初始化页面之后渲染地图
this.$nextTick(function () {
this.init(“ditu”)
})
},
methods: {
init(id) {
// 这个是根据省份名称获取到了省份对应的json文件编号，省份名称我存进了vuex，都可以
var cityId = cityMap[this.$store.state.defaultData.province];
// 拿到这个省市对应的json文件数据
var mapCode = require(“…/…/…/…/…/…/assets/map/” + cityId + “.json”);
// 两个参数，一个省份名称例如山东省，一个该省份json文件数据
echarts.registerMap(this.$store.state.defaultData.province, mapCode);
this.charts = echarts.init(document.getElementById(id))
// 下面就是造地图显示的数据
var outname = []
var outvalue = []
if (this.showData.name && this.showData.name.length > 0) {
outname = this.showData.name
outvalue = this.showData.values
} else {
outname = [‘东城区’, ‘西城区’, ‘朝阳区’, ‘丰台区’, ‘石景山区’, ‘海淀区’, ‘顺义区’, ‘通州区’, ‘大兴区’, ‘房山区’, ‘门头沟区’, ‘昌平区’, ‘平谷区’, ‘密云区’, ‘怀柔区’, ‘延庆区’];
outvalue = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
}
var outdata = [];
for (var i = 0; i < outname.length; i++) {
outdata.push({
name: outname[i],
value: outvalue[i]
})
}
let index = -1;
let option = {
tooltip: { // 提示框组件
show: true, // 显示提示框组件
trigger: “item”, // 触发类型
triggerOn: “mousemove”, // 出发条件
formatter: “地区名称：{b}
基站数量：{c}”
},
visualMap: {
type: ‘piecewise’,
left: ‘50’,
bottom: ‘40’,
itemWidth: 27,
itemHeight: 15,
textStyle: {
color: ‘#333333’,
fontSize: 14,
},
pieces: [{
min: 100,
label: ‘>100’,
}, {
max: 100,
min: 50,
label: ‘50-100’,
}, {
max: 50,
min: 0,
label: ‘<50’,
}, {
value: 0,
label: ‘无数据’,
},],
inRange: {
color: [‘#B2CAE0’, ‘#D2EAFF’, ‘#8AC6FD’, ‘#45A5F8’]
},
outOfRange: {
color: [‘#999999’]
}
},
geo: {
map: this.$store.state.defaultData.province,
show: true,
roam: false,
label: {
emphasis: {
show: false
}
},
itemStyle: {
normal: {
borderColor: ‘rgba(0,63,140,0.2)’,
shadowColor: ‘rgba(0,63,140,0.2)’,
shadowOffsetY: 10,
shadowBlur: 15
}
}
},
series: [{
type: ‘map’,
map: this.$store.state.defaultData.province,
aspectScale: 0.75,
label: {
normal: {
show: false,
},
emphasis: {
show: false,
}
},
itemStyle: {
normal: {
areaColor: ‘#B2CAE0’,
borderColor: ‘#fff’,
borderWidth: 1,
},
emphasis: {
areaColor: ‘#FFAE00’,
}
},
data: outdata
}]
};
this.charts.setOption(option, true);
},
}
}
可以了，这样就，我的效果是出来了。
china-main-city-map.js 文件
export const cityMap = {
“安徽省”: “340000”,
“澳门特别行政区”: ‘820000’,
“北京市”: ‘110000’,
“重庆市”:‘500000’,
“福建省”: ‘350000’,
“甘肃省”: ‘620000’,
“广东省”: ‘440000’,
“广西省”: “450000”,
“贵州省”: ‘520000’,
“海南省”: ‘460000’,
“河北省”: ‘130000’,
“黑龙江省”: ‘230000’,
“河南省”: ‘410000’,
“湖北省”: ‘420000’,
“湖南省”: ‘430000’,
“江苏省”: ‘320000’,
“江西省”: ‘360000’,
“吉林省”: ‘220000’,
“辽宁省”: ‘210000’,
“内蒙古自治区”: ‘150000’,
“宁夏回族自治区”: ‘640000’,
“青海省”: ‘630000’,
“山东省”: ‘370000’,
“上海”: ‘310000’,
“山西省”: ‘140000’,
“四川省”: ‘510000’,
“台湾”: ‘710000’,
“天津”: ‘120000’,
“新疆维吾尔自治区”: ‘650000’,
“陕西省”: ‘610000’,
“西藏自治区”: ‘540000’,
“云南省”: ‘530000’,
“浙江省”: ‘330000’,
“香港特别行政区”: ‘810000’,
“天津市”: “120100”,
“上海市”: “310100”,
“重庆市”: “500100”,
“崇明县”: “310200”,
“湖北省直辖县市”: “429000”,
“铜仁市”: “522200”,
“毕节市”: “522400”,
“石家庄市”: “130100”,
“唐山市”: “130200”,
“秦皇岛市”: “130300”,
“邯郸市”: “130400”,
“邢台市”: “130500”,
“保定市”: “130600”,
“张家口市”: “130700”,
“承德市”: “130800”,
“沧州市”: “130900”,
“廊坊市”: “131000”,
“衡水市”: “131100”,
“太原市”: “140100”,
“大同市”: “140200”,
“阳泉市”: “140300”,
“长治市”: “140400”,
“晋城市”: “140500”,
“朔州市”: “140600”,
“晋中市”: “140700”,
“运城市”: “140800”,
“忻州市”: “140900”,
“临汾市”: “141000”,
“吕梁市”: “141100”,
“呼和浩特市”: “150100”,
“包头市”: “150200”,
“乌海市”: “150300”,
“赤峰市”: “150400”,
“通辽市”: “150500”,
“鄂尔多斯市”: “150600”,
“呼伦贝尔市”: “150700”,
“巴彦淖尔市”: “150800”,
“乌兰察布市”: “150900”,
“兴安盟”: “152200”,
“锡林郭勒盟”: “152500”,
“阿拉善盟”: “152900”,
“沈阳市”: “210100”,
“大连市”: “210200”,
“鞍山市”: “210300”,
“抚顺市”: “210400”,
“本溪市”: “210500”,
“丹东市”: “210600”,
“锦州市”: “210700”,
“营口市”: “210800”,
“阜新市”: “210900”,
“辽阳市”: “211000”,
“盘锦市”: “211100”,
“铁岭市”: “211200”,
“朝阳市”: “211300”,
“葫芦岛市”: “211400”,
“长春市”: “220100”,
“吉林市”: “220200”,
“四平市”: “220300”,
“辽源市”: “220400”,
“通化市”: “220500”,
“白山市”: “220600”,
“松原市”: “220700”,
“白城市”: “220800”,
“延边朝鲜族自治州”: “222400”,
“哈尔滨市”: “230100”,
“齐齐哈尔市”: “230200”,
“鸡西市”: “230300”,
“鹤岗市”: “230400”,
“双鸭山市”: “230500”,
“大庆市”: “230600”,
“伊春市”: “230700”,
“佳木斯市”: “230800”,
“七台河市”: “230900”,
“牡丹江市”: “231000”,
“黑河市”: “231100”,
“绥化市”: “231200”,
“大兴安岭地区”: “232700”,
“南京市”: “320100”,
“无锡市”: “320200”,
“徐州市”: “320300”,
“常州市”: “320400”,
“苏州市”: “320500”,
“南通市”: “320600”,
“连云港市”: “320700”,
“淮安市”: “320800”,
“盐城市”: “320900”,
“扬州市”: “321000”,
“镇江市”: “321100”,
“泰州市”: “321200”,
“宿迁市”: “321300”,
“杭州市”: “330100”,
“宁波市”: “330200”,
“温州市”: “330300”,
“嘉兴市”: “330400”,
“湖州市”: “330500”,
“绍兴市”: “330600”,
“金华市”: “330700”,
“衢州市”: “330800”,
“舟山市”: “330900”,
“台州市”: “331000”,
“丽水市”: “331100”,
“合肥市”: “340100”,
“芜湖市”: “340200”,
“蚌埠市”: “340300”,
“淮南市”: “340400”,
“马鞍山市”: “340500”,
“淮北市”: “340600”,
“铜陵市”: “340700”,
“安庆市”: “340800”,
“黄山市”: “341000”,
“滁州市”: “341100”,
“阜阳市”: “341200”,
“宿州市”: “341300”,
“六安市”: “341500”,
“亳州市”: “341600”,
“池州市”: “341700”,
“宣城市”: “341800”,
“福州市”: “350100”,
“厦门市”: “350200”,
“莆田市”: “350300”,
“三明市”: “350400”,
“泉州市”: “350500”,
“漳州市”: “350600”,
“南平市”: “350700”,
“龙岩市”: “350800”,
“宁德市”: “350900”,
“南昌市”: “360100”,
“景德镇市”: “360200”,
“萍乡市”: “360300”,
“九江市”: “360400”,
“新余市”: “360500”,
“鹰潭市”: “360600”,
“赣州市”: “360700”,
“吉安市”: “360800”,
“宜春市”: “360900”,
“抚州市”: “361000”,
“上饶市”: “361100”,
“济南市”: “370100”,
“青岛市”: “370200”,
“淄博市”: “370300”,
“枣庄市”: “370400”,
“东营市”: “370500”,
“烟台市”: “370600”,
“潍坊市”: “370700”,
“济宁市”: “370800”,
“泰安市”: “370900”,
“威海市”: “371000”,
“日照市”: “371100”,
“莱芜市”: “371200”,
“临沂市”: “371300”,
“德州市”: “371400”,
“聊城市”: “371500”,
“滨州市”: “371600”,
“菏泽市”: “371700”,
跳槽是每个人的职业生涯中都要经历的过程，不论你是搜索到的这篇文章还是无意中浏览到的这篇文章，希望你没有白白浪费停留在这里的时间，能给你接下来或者以后的笔试面试带来一些帮助。
也许是互联网未来10年中最好的一年。WINTER IS COMING。但是如果你不真正的自己去尝试尝试，你永远不知道市面上的行情如何。这次找工作下来，我自身感觉市场并没有那么可怕，也拿到了几个大厂的offer。在此进行一个总结，给自己，也希望能帮助到需要的同学。
面试准备
面试准备根据每个人掌握的知识不同，准备的时间也不一样。现在对于前端岗位，以前也许不是很重视算法这块，但是现在很多公司也都会考。建议大家平时有空的时候多刷刷leetcode。算法的准备时间比较长，是一个长期的过程。需要在掌握了大部分前端基础知识的情况下，再有针对性的去复习算法。面试的时候算法能做出来肯定加分，但做不出来也不会一票否决，面试官也会给你提供一些思路。
加入社区》https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0
扫一扫
1573
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
