当前位置: 首页 > 后端技术 > Node.js

echarts访客源

时间:2023-04-03 21:23:20 Node.js

//originLines.jsletlocatePoint=[{name:"北京",position:[116.407526,39.904030]},{name:"辽宁",position:[123.429440,41.835441]},{name:"上海",position:[121.473701,31.230416]},{name:"河北",position:[114.468664,38.037057]},{name:"浙江",position:[120.152791,30.267446]},{name:"广东",position:[113.266530,23.132191]},{name:"山西",position:[112.562398,37.873531]},{name:"天津",position:[117.200983,39.084158]},{name:"吉林",position:[125.325990,43.896536]},{name:"陕西",position:[108.954239,34.265472]},{name:"丽江",position:[100.233026,26.872108]},]letoption={color:['#14f7fe'],geo:{map:'china'},series:[{type:"lines",coordinateSystem:"geo",effect:{period:6,show:true,symbolSize:3,trailLength:0.7,},lineStyle:{normal:{颜色:“#14f2fb”,曲率:0.2,不透明度:0.6,宽度:0}},数据:[]},{类型:“线”,坐标系统:“地理”,效果:{期间:6,显示:真的e,symbolSize:15,trailLength:0,symbol:"path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z",},lineStyle:{normal:{color:"#14f2fb",curveness:0.2,opacity:0.6,width:1}},data:[]},{type:"effectScatter",coordinateSystem:"geo",symbolSize:6,label:{normal:{formatter:"{b}",show:true,position:"right"}},itemStyle:{color:"#14f2fb"},data:[]},]}functionprocessData(data){让pointSize=60让linesData=data.map(item=>({coords:[getPosition(item[0]),getPosition(item[1])],fromName:item[0],toName:item[1]}))letscatterData=data.map(item=>({name:item[0],value:[...getPosition(item[0]),pointSize]}))scatterData.push({name:data0,value:...getPosition(data[0],pointSize]})option.series[0].data=linesData;option.series[1].data=linesData;option.series[2].data=scatterData;}functiongetPosition(name){returnlocatePoint.find(item=>item.name==name).position}functiongetOption(data){让tmpData=data.map(item=>[item.name,'丽江']);处理数据(tmpData);returnoption;}exportdefaultgetOptionimportflyLinefrom"./echarts/originLines"//htmldom

设置optionvuedata(){return{originData:[{name:'北京',value:11703},{name:'辽宁',value:11703},{name:'上海',value:11703},{name:'河北',value:11703},{name:'浙江',value:11703},{name:'广东',value:11703},{name:'山西',value:11703},{name:'天津',value:11703},{name:'吉林',value:11703},{name:'陕西',value:11703}],}}//echartsdom初始化this.originLines=this.echarts.init(document.getElementById("originLines")“默认”);让选项=this.flyLine(this.originData);this.originLines.setOption(选项)