提交 0d13cde2 编写于 作者: yma16's avatar yma16

perf:no cdn

上级 b8a42265
......@@ -80,7 +80,7 @@
<!-- >&nbsp;&nbsp;在线聊天室</i-->
<!-- >-->
<div style="float: right; overflow: hidden;display: flex;justify-items: center;align-items:center;word-spacing: 16px;">
<span style="cursor: pointer; width: 80px" v-if="currentUserName">
<span style="cursor: pointer;padding-right: 50px" v-if="currentUserName">
<el-popover
trigger="click">
<span @click="loginOut" style="cursor: pointer; height: 16px">注销</span>
......
......@@ -98,169 +98,162 @@ export default {
this.initOptionData()
},
initOptionData: function () {
const echarts = this.$echarts
if (!echarts) return
let that = this
// const echarts = this.$echarts
// if (!echarts) return
const that = this
// 置空
that.linesCoord = []
function task1 () {
let that = this
async function task1 () {
return new Promise((resolve) => {
setTimeout(() => {
console.log('第1个任务geojson获取')
this.$axios
.get('https://yongma16.xyz/static/json/map/guizhou.json')
.then(function (response) {
let res = response.data
that.gisData = res
console.log('贵州数据', res)
let itemData = res.features
let length = itemData.length
that.aimPointData = []
for (let loc = 0; loc < length; ++loc) {
let name = itemData[loc].properties.name
that.aimPointData.push({
value: name
})
let center = itemData[loc].properties.center
// 中心位置
if (name === that.focusCity) {
that.centerLoction = center
}
that.$axios
.get('https://yongma16.xyz/static/json/map/guizhou.json')
.then(function (response) {
let res = response.data
that.gisData = res
console.log('贵州数据', res)
let itemData = res.features
let length = itemData.length
that.aimPointData = []
for (let loc = 0; loc < length; ++loc) {
let name = itemData[loc].properties.name
that.aimPointData.push({
value: name
})
let center = itemData[loc].properties.center
// 中心位置
if (name === that.focusCity) {
that.centerLoction = center
}
for (let loc = 0; loc < length; ++loc) {
let name = itemData[loc].properties.name
let number = (Math.random() * 100).toFixed(2)
let center = itemData[loc].properties.center
that.locationGis.push({
value: center
})
// eslint-disable-next-line eqeqeq
if (name !== that.focusCity) {
that.linesCoord.push([center, that.centerLoction])
}
// eslint-disable-next-line eqeqeq
if (name && name !== '') {
let temp = {
name: `${name}`,
value: Number(number)
}
that.airData.push(temp)
}
for (let loc = 0; loc < length; ++loc) {
let name = itemData[loc].properties.name
let number = (Math.random() * 100).toFixed(2)
let center = itemData[loc].properties.center
that.locationGis.push({
value: center
})
// eslint-disable-next-line eqeqeq
if (name !== that.focusCity) {
that.linesCoord.push([center, that.centerLoction])
}
// eslint-disable-next-line eqeqeq
if (name && name !== '') {
let temp = {
name: `${name}`,
value: Number(number)
}
continue
that.airData.push(temp)
}
console.log('测试热力处理', that.airData)
echarts.registerMap('geoJson', res)
})
resolve('第一个任务')
}, 1000)
}).catch((error) => {
throw Error(error)
continue
}
console.log('测试热力处理', that.airData)
echarts.registerMap('geoJson', res)
resolve('第一个任务')
}).catch(r => {
resolve(r)
})
})
}
function task2 () {
async function task2 () {
return new Promise((resolve) => {
setTimeout(() => {
console.log('第2个任务option配置')
that.option = {
title: {
text: '贵州省地图',
subtext: 'geoJson'
},
geo: {
// 经纬度中心
center: that.centerLoction,
that.option = {
title: {
text: '贵州省地图',
subtext: 'geoJson'
},
geo: {
// 经纬度中心
center: that.centerLoction,
type: 'map',
map: 'geoJson', // 这里的值要和上面registerMap的第一个参数一致
roam: true, // 拖拽
nameProperty: 'name',
// 悬浮标签
label: {
type: 'map',
map: 'geoJson', // 这里的值要和上面registerMap的第一个参数一致
roam: true, // 拖拽
// roam: false, // 拖拽
nameProperty: 'name',
// 悬浮标签
label: {
type: 'map',
map: 'geoJson', // 这里的值要和上面registerMap的第一个参数一致
// roam: false, // 拖拽
nameProperty: 'name',
show: true,
color: '#fff',
backgroundColor: '#546de5',
align: 'center',
fontSize: 10,
width: (function () {
// let n = parseInt(Math.random() * 10)
return 110
})(),
height: 50,
shadowColor: 'rgba(0,0,0,.7)',
borderRadius: 10
show: true,
color: '#fff',
backgroundColor: '#546de5',
align: 'center',
fontSize: 10,
width: (function () {
// let n = parseInt(Math.random() * 10)
return 110
})(),
height: 50,
shadowColor: 'rgba(0,0,0,.7)',
borderRadius: 10
},
zoom: 1.2
},
series: [
// 坐标点的热力数据
{
data: that.airData,
geoIndex: 0, // 将热力的数据和第0个geo配置关联在一起
type: 'map'
},
{
type: 'effectScatter',
// 渲染显示
zlevel: 2,
showEffectOn: 'render',
data: that.locationGis, // 配置散点的坐标数据
coordinateSystem: 'geo', // 指明散点使用的坐标系统
rippleEffect: {
// 缩放
scale: 4,
// 涟漪的颜色
color: '#cf6a87',
// 波纹数量
number: 2,
// 扩散方式 stroke(线条) fill(区域覆盖)
brushType: 'fill'
},
zoom: 1.2
// 形状
symbol: 'circle'
},
series: [
// 坐标点的热力数据
{
data: that.airData,
geoIndex: 0, // 将热力的数据和第0个geo配置关联在一起
type: 'map'
// 飞线层
{
// name: '贵阳市飞线',
type: 'lines',
coordinateSystem: 'geo',
polyline: true,
zlevel: 3,
effect: {
show: true,
period: 5,
trailLength: 0, // 拖尾
symbol: 'arrow', // 箭头
color: 'red', // 样式颜色
symbolSize: 5
},
{
type: 'effectScatter',
// 渲染显示
zlevel: 2,
showEffectOn: 'render',
data: that.locationGis, // 配置散点的坐标数据
coordinateSystem: 'geo', // 指明散点使用的坐标系统
rippleEffect: {
// 缩放
scale: 4,
// 涟漪的颜色
color: '#cf6a87',
// 波纹数量
number: 2,
// 扩散方式 stroke(线条) fill(区域覆盖)
brushType: 'fill'
},
// 形状
symbol: 'circle'
lineStyle: {
color: '#000',
width: 2,
type: 'solid',
dashOffset: 0
// cap: butt,
// join: bevel
},
// 飞线层
{
// name: '贵阳市飞线',
type: 'lines',
coordinateSystem: 'geo',
polyline: true,
zlevel: 3,
effect: {
show: true,
period: 5,
trailLength: 0, // 拖尾
symbol: 'arrow', // 箭头
color: 'red', // 样式颜色
symbolSize: 5
},
lineStyle: {
color: '#000',
width: 2,
type: 'solid',
dashOffset: 0
// cap: butt,
// join: bevel
},
// 飞线层数据
data: that.linesCoord
}
],
visualMap: {
min: 0,
max: 100,
inRange: {
color: ['white', '#0984e3'] // 控制颜色渐变的范围
},
calculable: false // 出现滑块
// 飞线层数据
data: that.linesCoord
}
],
visualMap: {
min: 0,
max: 100,
inRange: {
color: ['white', '#0984e3'] // 控制颜色渐变的范围
},
calculable: false // 出现滑块
}
resolve('2')
}, 1000)
}
resolve('echarts options')
})
}
async function allTasks () {
......@@ -274,7 +267,7 @@ export default {
})
},
initMapGis: function (optionParams) {
let that = this
const that = this
try {
// 基于准备好的dom,初始化echarts实例
console.log('echarts_map渲染')
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册