Kezdőlap Felfedezés Súgó
Bejelentkezés
aexiaoliou
/
example-auto-version
Figyelés 1
Kedvenc 0
Másolás 0
Fájlok Problémák 0 Beolvasztási kérések 0 Wiki
Fa: 5a52e582a9
Branch-ok Tag-ek
example-auto...
/
api
/
public
/
test
/
assets
/
demo1.11e19adb.js

demo1.11e19adb.js 15 KB
Előzmények Nyers

12345678910111213141516171819202122232425262728 
  1. import{L as C,i as r,a2 as D,l as I,a1 as O,o as V,a as Y,W as h,b as t,Y as G,e as Q,aE as R,aF as Z}from"./vue.e1d8f8c6.js";import{i as c,L as d}from"./echarts.20c3f7a1.js";import"./bmap.ed0fe83d.js";import{f as S}from"./formatTime.29ac8c52.js";import{N as J,_ as N}from"./index.5ec7a9d7.js";const F=[{name:"深圳市人民政府",value:"100"},{name:"莲花山公园",value:"100"},{name:"世界之窗",value:"100"},{name:"华侨城欢乐谷",value:"100"},{name:"宝安区西乡",value:"100"}],H={深圳市人民政府:[114.064524,22.549225],莲花山公园:[114.0658,22.560072],世界之窗:[113.979419,22.540579],华侨城欢乐谷:[113.986066,22.548056],宝安区西乡:[113.869053,22.581714]},$=[{url:"https://img1.baidu.com/it/u=2425496005,2401702709&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500",name:"深圳市人民政府",add:"深圳市福田区福中三路市民中心C区",dec:"深圳市人民政府是根据《中华人民共和国地方各级人民代表大会和地方各级人民政府组织法》设立的，是深圳市人民代表大会的执行机关，是深圳市的国家行政机关。"},{url:"https://img0.baidu.com/it/u=2666213152,2487785512&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=500",name:"莲花山公园",add:"广东省深圳市福田区莲花街道莲花北社区红荔路6030号",dec:"莲花山公园筹建于1992年10月10日 ，1997年6月23日正式对外局部开放。"},{url:"https://img1.baidu.com/it/u=1595204841,1838139326&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500",name:"世界之窗",add:"深圳市南山区深南大道9037号",dec:"这里，世界首座实景拍摄悬空式球幕影院“飞跃美利坚””，为游客提供集休闲放松于一体的都市时尚生活空间。"},{url:"https://img0.baidu.com/it/u=1586832283,2276617306&fm=253&fmt=auto&app=138&f=JPEG?w=476&h=500",name:"华侨城欢乐谷",add:"广东省深圳市南山区沙河街道星河街社区侨城西街1号",dec:"深圳欢乐谷注重满足人们参与、体验的新型诱游需求，营造出自然、清新、活泼、惊奇、热烈、刺激的休闲旅游氛围。"},{url:"https://img0.baidu.com/it/u=2899429152,3158963267&fm=253&fmt=auto&app=138&f=JPEG?w=200&h=200",name:"宝安区西乡",add:"西乡街道下辖25个社区",dec:"西乡街道，隶属于广东省深圳市宝安区，位于宝安区西南部，东接石岩街道，南接新安街道，西至珠江口岸边，北接航城街道。"}],n=p=>(R("data-v-1876ce84"),p=p(),Z(),p),j={class:"visualizing-demo1"},U={class:"visualizing-container"},q={class:"visualizing-container-head"},K={class:"visualizing-container-head-left"},X={class:"visualizing-container-head-left-text"},tt={class:"visualizing-container-head-left-text-box"},et=Q('<div class="visualizing-container-head-center" data-v-1876ce84><div class="visualizing-container-head-center-box" data-v-1876ce84><div class="visualizing-container-head-center-maintitle" data-v-1876ce84>深圳市xxx软件科技有限公司</div><div class="visualizing-container-head-center-subtitle" data-v-1876ce84>旅游经济</div></div></div><div class="visualizing-container-head-right" data-v-1876ce84><div class="visualizing-container-head-right-text" data-v-1876ce84><div class="visualizing-container-head-right-text-box" data-v-1876ce84>🌤 多云转晴东南风 26~30℃</div></div></div>',2),it={class:"visualizing-container-content-left"},ot={class:"visualizing-container-content-left-flex"},at=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-shop"}),t("span",null,"产业概况")],-1)),st=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),lt={class:"visualizing-container-content-left-flex"},nt=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-promotion"}),t("span",null,"A级风景区对比")],-1)),rt=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),ct={class:"visualizing-container-content-center"},dt={class:"visualizing-container-content-center-bottom"},ut={class:"visualizing-container-content-center-bottom-flex"},ht=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-custom"}),t("span",null,"游客过夜情况")],-1)),pt=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),mt={class:"visualizing-container-content-center-bottom-flex"},ft=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-flag"}),t("span",null,"游客驻留时长")],-1)),gt=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),vt={class:"visualizing-container-content-right"},yt={class:"visualizing-container-content-right-flex"},xt=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-marketing"}),t("span",null,"当日游客趋势分析")],-1)),bt=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),wt={class:"visualizing-container-content-right-flex"},_t=n(()=>t("div",{class:"visualizing-container-title"},[t("i",{class:"el-icon-s-data"}),t("span",null,"当月游客趋势分析")],-1)),zt=n(()=>t("hr",{class:"visualizing-container-title-colorful"},null,-1)),St=C({name:"visualizingLinkDemo1"}),Ct=C({...St,setup(p){const g=r(),v=r(),y=r(),x=r(),b=r(),w=r(),_=r(),i=D({echartsMapList:F,echartsMapData:H,echartsMapImgs:$,time:{txt:"",fun:0},myCharts:[]}),L=()=>{i.time.txt=S(new Date,"YYYY-mm-dd HH:MM:SS WWW QQQQ ZZZ"),i.time.fun=window.setInterval(()=>{i.time.txt=S(new Date,"YYYY-mm-dd HH:MM:SS WWW QQQQ ZZZ")},1e3)},z=e=>{let o=[];for(let l=0;l<e.length;l++){let u=i.echartsMapData[e[l].name];u&&o.push({name:e[l].name,value:u.concat(e[l].value)})}return o},k=()=>{const e=c(g.value),o={tooltip:{trigger:"item",formatter(s){let a=i.echartsMapImgs.find(f=>f.name===s.name);return`<div style="width: 240px">
    2. 

  2. 							<div style="display: flex; align-items: center">
    3. 

  3. 								<img src="${a==null?void 0:a.url}" style="width: 50px; height: 50px; border-radius: 100%; position: relative; border: 4px solid #ffffff; margin-left: -4px" />
    4. 

  4. 								<div
    5. 

  5. 									style="
    6. 

  6. 										background: #51c1ff;
    7. 

  7. 										width: 100%;
    8. 

  8. 										height: 32px;
    9. 

  9. 										margin-left: -14px;
    10. 

  10. 										display: flex;
    11. 

  11. 										align-items: center;
    12. 

  12. 										padding-left: 20px;
    13. 

  13. 										color: #fff;
    14. 

  14. 									"
    15. 

  15. 								>
    16. 

  16. 									${a==null?void 0:a.name}
    17. 

  17. 								</div>
    18. 

  18. 							</div>
    19. 

  19. 							<div style="margin-top: 10px; font-size: 12px">
    20. 

  20. 								<div style="width: 61px"><i class="el-icon-location-information" style="margin-right: 5px"></i>地址：</div>
    21. 

  21. 								<div style="flex: 1; white-space: pre-wrap; word-break: break-all; margin-top: 5px; color: #333">${a==null?void 0:a.add}</div>
    22. 

  22. 							</div>
    23. 

  23. 							<div style="margin-top: 10px; font-size: 12px">
    24. 

  24. 								<div style="width: 61px"><i class="el-icon-chat-dot-round" style="margin-right: 5px"></i>概括：</div>
    25. 

  25. 								<div style="flex: 1; white-space: pre-wrap; word-break: break-all; margin-top: 5px; color: #333">${a==null?void 0:a.dec}</div>
    26. 

  26. 							</div>
    27. 

  27. 						</div>`}},color:["#ea7ccc"],bmap:{center:[114.064524,22.549225],zoom:11,roam:!0,mapStyle:{}},series:[{name:"门票收入",type:"scatter",coordinateSystem:"bmap",data:z(i.echartsMapList),symbolSize:function(s){return s[2]/10},encode:{value:2},label:{formatter:"{b}",position:"right",show:!1},emphasis:{label:{show:!0}}},{name:"门票收入",type:"effectScatter",coordinateSystem:"bmap",data:z(i.echartsMapList.sort(function(s,a){return a.value-s.value}).slice(0,6)),symbolSize:function(s){return s[2]/10},encode:{value:2},showEffectOn:"render",rippleEffect:{brushType:"stroke"},hoverAnimation:!0,label:{formatter:"{b}",position:"right",show:!0},itemStyle:{shadowBlur:100,shadowColor:"#333"},zlevel:1}]};e.setOption(o),i.myCharts.push(e);const l=e.getModel().getComponent("bmap").getBMap();l.setMapType(BMAP_SATELLITE_MAP),new BMap.Boundary().get("深圳",function(s){let a=s.boundaries.length;for(let m=0;m<a;m++){let f=new BMap.Polygon(s.boundaries[m],{strokeWeight:4,strokeOpacity:1,StrokeStyle:"dashed",strokeColor:"#febb50",fillColor:""});l.addOverlay(f),l.setViewport(f.getPath())}l.centerAndZoom(new BMap.Point(114.064524,22.549225),11)})},A=()=>{const e=c(v.value),o={grid:{top:50,right:0,bottom:50,left:30},tooltip:{trigger:"axis"},xAxis:{data:["1月","2月","3月","4月","5月","6月"],axisLine:{lineStyle:{color:"rgba(22, 207, 208, 0.1)",width:1}},axisTick:{show:!1},axisLabel:{color:"#16cfd0"}},yAxis:[{type:"value",name:"价格",axisLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.1)"}},axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}}],series:[{name:"预购队列",type:"line",data:[200,85,112,275,305,415],itemStyle:{color:"#16cfd0"}},{name:"最新成交价",type:"line",data:[50,85,22,155,170,25],itemStyle:{color:"#febb50"}}]};e.setOption(o),i.myCharts.push(e)},T=()=>{const e=c(y.value),o={grid:{top:50,right:10,bottom:40,left:30},tooltip:{trigger:"axis"},xAxis:{type:"category",boundaryGap:!1,data:["1月","2月","3月","4月","5月"],axisLine:{lineStyle:{color:"rgba(22, 207, 208, 0.1)",width:1}},axisTick:{show:!1},axisLabel:{interval:0,color:"#16cfd0",textStyle:{fontSize:10}}},yAxis:[{type:"value",name:"销量",axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}}],series:[{name:"客流",type:"line",stack:"总量",smooth:!0,lineStyle:{width:0},areaStyle:{opacity:.8,color:new d(0,0,0,1,[{offset:0,color:"rgba(128, 255, 165)"},{offset:1,color:"rgba(1, 191, 236)"}])},emphasis:{focus:"series"},data:[140,232,101,264,90]},{name:"天数",type:"line",stack:"总量",smooth:!0,lineStyle:{width:0},areaStyle:{opacity:.8,color:new d(0,0,0,1,[{offset:0,color:"rgba(0, 221, 255)"},{offset:1,color:"rgba(77, 119, 255)"}])},emphasis:{focus:"series"},data:[120,282,111,234,220]}]};e.setOption(o),i.myCharts.push(e)},M=()=>{const e=c(x.value),o=100,l=1e3,u={grid:{top:50,right:10,bottom:66,left:38},tooltip:{trigger:"axis",axisPointer:{type:"shadow"}},xAxis:[{type:"category",data:["地区","地区","地区","地区","地区","地区","地区","地区","地区","地区"],axisLabel:{color:"#16cfd0",textStyle:{fontSize:9},interval:0,rotate:-45},axisLine:{lineStyle:{color:"rgba(22, 207, 208, 0.1)",width:1}},axisTick:{show:!1}}],yAxis:[{type:"value",name:"天数",nameGap:25,axisLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.1)"}},axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}}],series:[{type:"bar",barWidth:15,itemStyle:{normal:{color:new d(0,0,0,1,[{offset:0,color:"#de682e"},{offset:1,color:"#ecc232"}])}},label:{normal:{show:!0,position:"top",formatter:function(s){return s.value==l||s.value==o?"":s.value},textStyle:{color:"rgba(22, 207, 208, 0.8)",fontSize:10}}},markPoint:{symbolSize:30,label:{normal:{textStyle:{color:"#ffffff",fontSize:10}}},data:[{name:"年最低",value:o,xAxis:0,yAxis:100},{name:"年最高",value:l,xAxis:9,yAxis:1e3}]},data:[100,200,300,400,500,600,700,800,900,1e3]}]};e.setOption(u),i.myCharts.push(e)},B=()=>{const e=c(b.value),o={tooltip:{trigger:"axis",axisPointer:{type:"shadow"}},grid:{top:26,right:10,bottom:66,left:45},xAxis:{type:"value",axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}}},yAxis:{type:"category",axisLabel:{color:"#16cfd0"}},series:[{name:"已完成",type:"bar",stack:"total",label:{show:!0},emphasis:{focus:"series"},barWidth:12,itemStyle:{label:{show:!0},labelLine:{show:!1},color:new d(0,0,1,0,[{offset:0,color:"rgba(7,165,255,0.2)"},{offset:1,color:"rgba(7,165,255,1)"}])}},{name:"进行中",type:"bar",stack:"total",label:{show:!0},emphasis:{focus:"series"},barWidth:12,itemStyle:{label:{show:!0},labelLine:{show:!1},color:new d(0,0,1,0,[{offset:0,color:"rgba(41,244,236,0)"},{offset:1,color:"rgba(41,244,236,1)"}])}}],dataset:{source:[{status:"已签收",value1:33,value2:93},{status:"配送中",value1:53,value2:32},{status:"已出库",value1:78,value2:65},{status:"采购中",value1:12,value2:35},{status:"接单中",value1:90,value2:52}]}};e.setOption(o),i.myCharts.push(e)},E=()=>{const e=c(w.value),o={grid:{top:50,right:30,bottom:50,left:20},tooltip:{trigger:"axis",axisPointer:{type:"shadow"}},xAxis:{data:["1月","2月","3月","4月","5月","6月"],axisLine:{lineStyle:{color:"rgba(22, 207, 208, 0.5)",width:1}},axisTick:{show:!1},axisLabel:{color:"#16cfd0"}},yAxis:[{type:"value",name:"亿元",axisLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.1)"}},axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}},{type:"value",name:"同比",position:"right",axisLine:{show:!1},axisLabel:{show:!0,formatter:"{value}%",textStyle:{color:"#16cfd0"}},splitLine:{show:!1},axisTick:{show:!1},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}}],series:[{name:"销售水量",type:"line",yAxisIndex:1,smooth:!0,showAllSymbol:!0,symbol:"circle",itemStyle:{color:"#058cff"},lineStyle:{color:"#058cff"},areaStyle:{color:"rgba(5,140,255, 0.2)"},data:[4.2,3.8,4.8,3.5,2.9,2.8]},{name:"主营业务",type:"bar",barWidth:15,itemStyle:{normal:{color:new d(0,0,0,1,[{offset:0,color:"#00FFE3"},{offset:1,color:"#4693EC"}])}},data:[4.2,3.8,4.8,3.5,2.9,2.8]}]};e.setOption(o),i.myCharts.push(e)},P=()=>{const e=c(_.value),o={grid:{top:50,right:10,bottom:40,left:30},tooltip:{trigger:"axis"},xAxis:{data:["1月","2月","3月","4月","5月","6月"],axisLine:{lineStyle:{color:"rgba(22, 207, 208, 0.1)",width:1}},axisTick:{show:!1},axisLabel:{color:"#16cfd0"}},yAxis:[{type:"value",name:"人数(万)",axisLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.1)"}},axisLabel:{color:"#16cfd0"},splitLine:{show:!0,lineStyle:{color:"rgba(22, 207, 208, 0.3)"}},splitArea:{show:!0,areaStyle:{color:"rgba(22, 207, 208, 0.02)"}},nameTextStyle:{color:"#16cfd0"}}],series:[{name:"预购队列",type:"line",data:[20,15,40,55,65,85],smooth:!0,itemStyle:{color:"#EA7CCC"}},{name:"最新成交价",type:"line",data:[30,45,65,85,60,105],smooth:!0,itemStyle:{color:"#FAC958"}}]};e.setOption(o),i.myCharts.push(e)},W=()=>{window.addEventListener("resize",()=>{for(let e=0;e<i.myCharts.length;e++)i.myCharts[e].resize()})};return I(async()=>{J.done(),L(),await k(),await A(),await T(),await M(),await B(),await E(),await P(),await W()}),O(()=>{window.clearInterval(i.time.fun)}),(e,o)=>(V(),Y("div",j,[h(" 地图 "),t("div",{ref_key:"visualizingDemo1",ref:g,style:{height:"100%"}},null,512),t("div",U,[h(" 头部 "),t("div",q,[t("div",K,[t("div",X,[t("div",tt,G(i.time.txt),1)])]),et]),h(" 图表左侧 "),t("div",it,[t("div",ot,[at,st,t("div",{ref_key:"visualizingContentLeftTop",ref:v,style:{height:"100%"}},null,512)]),t("div",lt,[nt,rt,t("div",{ref_key:"visualizingContentLeftBottom",ref:y,style:{height:"100%"}},null,512)])]),h(" 图表中间 "),t("div",ct,[t("div",dt,[t("div",ut,[ht,pt,t("div",{ref_key:"visualizingContentCenterTop",ref:x,style:{height:"100%"}},null,512)]),t("div",mt,[ft,gt,t("div",{ref_key:"visualizingContentCenterBottom",ref:b,style:{height:"100%"}},null,512)])])]),h(" 图表右侧 "),t("div",vt,[t("div",yt,[xt,bt,t("div",{ref_key:"visualizingContentRightTop",ref:w,style:{height:"100%"}},null,512)]),t("div",wt,[_t,zt,t("div",{ref_key:"visualizingContentRightBottom",ref:_,style:{height:"100%"}},null,512)])])])]))}});const Bt=N(Ct,[["__scopeId","data-v-1876ce84"],["__file","E:/code/wwwroot/local81.lzj/simple_storage/vue-next-admin/src/views/visualizing/demo1.vue"]]);export{Bt as default};
    28. 

  28.