修改地图
parent
7931bb6093
commit
168ac91270
Binary file not shown.
|
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.4 KiB |
|
|
@ -81,6 +81,31 @@ export const accountFormSchema: FormSchema[] = [
|
|||
return !!values.id
|
||||
},
|
||||
},
|
||||
// {
|
||||
// field: 'is_blank',
|
||||
// label: '是否外部链接',
|
||||
// required: false,
|
||||
// component: 'Switch',
|
||||
// componentProps: {
|
||||
// checkedChildren: 1,
|
||||
// unCheckedChildren: 0,
|
||||
// },
|
||||
// // render: ({ model, field }) => {
|
||||
// // console.log();
|
||||
|
||||
// // return model[field] ? '是' : '否'
|
||||
// // },
|
||||
// },
|
||||
// {
|
||||
// field: 'blank_url',
|
||||
// label: '外部链接',
|
||||
// required: false,
|
||||
// component: 'Input',
|
||||
// ifShow: ({ values }) => {
|
||||
// return !!values.is_blank
|
||||
// },
|
||||
// },
|
||||
|
||||
{
|
||||
field: 'industry_key',
|
||||
label: '产业类型',
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@
|
|||
import { useVisualizationStore } from '/@/store/modules/visualization'
|
||||
import SheepImg from '/@/assets/images/sheep.png'
|
||||
import PigImg from '/@/assets/images/pig.png'
|
||||
import { forEach } from 'lodash-es'
|
||||
|
||||
const domImg = document.createElement('img')
|
||||
domImg.style.height = '8px'
|
||||
|
|
@ -90,26 +91,49 @@
|
|||
{
|
||||
value: 1,
|
||||
label: '稻渔综合种养',
|
||||
color: 'rgb(242,230,230 , 0.7)',
|
||||
color: 'rgb(30,54,80 , 0.8)',
|
||||
type: 'map',
|
||||
data: [
|
||||
{
|
||||
value: [105.198605, 29.280154],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: '优品柑桔种植',
|
||||
color: 'rgb(187,216,106 , 0.7)',
|
||||
color: 'rgb(54,89,114,0.8)',
|
||||
type: 'map',
|
||||
data: [
|
||||
{
|
||||
value: [105.383917, 29.387026],
|
||||
},
|
||||
{
|
||||
value: [105.194187, 29.364692],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
label: '高粱产业',
|
||||
color: 'rgb(238,98,73 , 0.7)',
|
||||
color: 'rgba(147, 235, 248, 0.2)',
|
||||
type: 'map',
|
||||
data: [
|
||||
{
|
||||
value: [105.116049, 29.388207],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 4,
|
||||
label: '油茶产业',
|
||||
color: 'rgb(172,220,243 , 0.7)',
|
||||
color: 'rgb(172,220,243 , 0.4)',
|
||||
type: 'map',
|
||||
data: [
|
||||
{
|
||||
value: [105.386462, 29.317352],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 5,
|
||||
|
|
@ -120,12 +144,7 @@
|
|||
{
|
||||
map: '',
|
||||
name: '猪',
|
||||
value: ['105.283094', '29.234786'],
|
||||
},
|
||||
{
|
||||
map: '',
|
||||
name: '猪',
|
||||
value: ['105.338434', '29.388883'],
|
||||
value: [105.292327, 29.401826],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -138,17 +157,7 @@
|
|||
{
|
||||
map: '',
|
||||
name: '羊',
|
||||
value: ['105.287507', '29.339408'],
|
||||
},
|
||||
{
|
||||
map: '',
|
||||
name: '羊',
|
||||
value: ['105.147012', '29.442367'],
|
||||
},
|
||||
{
|
||||
map: '',
|
||||
name: '羊',
|
||||
value: ['105.115105', '29.383271'],
|
||||
value: [105.195498, 29.420684],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
|
@ -160,6 +169,18 @@
|
|||
item = Object.assign(item, _data)
|
||||
})
|
||||
|
||||
const _typeBackArr = _defaultArr.reduce((prev, cur) => {
|
||||
cur.data?.forEach((item) => {
|
||||
prev.push({
|
||||
type: 'nylx-key',
|
||||
name: cur.label,
|
||||
value: item.value,
|
||||
key: cur.key,
|
||||
})
|
||||
})
|
||||
return prev
|
||||
}, [])
|
||||
|
||||
const _seriesData = _defaultArr
|
||||
.filter((item) => item.type === 'dot')
|
||||
.map((e) => {
|
||||
|
|
@ -227,90 +248,54 @@
|
|||
duration: 100,
|
||||
},
|
||||
geo: {
|
||||
show: true,
|
||||
map: 'lcxz',
|
||||
aspectScale: 0.75,
|
||||
layoutCenter: ['50%', '50.5%'],
|
||||
layoutSize: '100%',
|
||||
silent: true,
|
||||
roam: false,
|
||||
z: 0,
|
||||
roam: true,
|
||||
zoom: 1,
|
||||
label: {
|
||||
color: '#fff',
|
||||
show: false,
|
||||
emphasis: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
areaColor: 'rgba(0, 15, 40, 0.0)',
|
||||
shadowColor: 'rgba(0, 0, 0, 1)',
|
||||
shadowBlur: 0,
|
||||
shadowOffsetX: 0,
|
||||
shadowOffsetY: 5,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 0.1,
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
areaColor: '#2AB8FF',
|
||||
normal: {
|
||||
borderColor: 'rgba(147, 235, 248, 1)',
|
||||
borderWidth: 1,
|
||||
color: 'green',
|
||||
areaColor: {
|
||||
type: 'radial',
|
||||
x: 0.5,
|
||||
y: 0.5,
|
||||
r: 0.8,
|
||||
colorStops: [
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(147, 235, 248, 0)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(147, 235, 248, .2)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
globalCoord: false, // 缺省为 false
|
||||
},
|
||||
shadowColor: 'rgba(128, 217, 248, 1)',
|
||||
// shadowColor: 'rgba(255, 255, 255, 1)',
|
||||
shadowOffsetX: -2,
|
||||
shadowOffsetY: 2,
|
||||
shadowBlur: 10,
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
emphasis: {
|
||||
areaColor: '#389BB7',
|
||||
borderWidth: 0,
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
..._seriesData,
|
||||
// {
|
||||
// type: 'scatter',
|
||||
// name: '生猪产业分布点',
|
||||
// coordinateSystem: 'geo',
|
||||
// tooltip: {
|
||||
// trigger: 'item',
|
||||
// show: true,
|
||||
// },
|
||||
// symbol: `image://${PigImg}`,
|
||||
// symbolSize: [30, 30],
|
||||
// symbolOffset: [0, 0],
|
||||
// z: 9999,
|
||||
// data: [
|
||||
// {
|
||||
// img: `image://${PigImg}`,
|
||||
// map: '',
|
||||
// name: '羊',
|
||||
// value: ['105.2333', '29.2641'],
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// type: 'scatter',
|
||||
// name: '肉羊产业分布点',
|
||||
// coordinateSystem: 'geo',
|
||||
// tooltip: {
|
||||
// trigger: 'item',
|
||||
// show: true,
|
||||
// },
|
||||
// symbol: `image://${SheepImg}`,
|
||||
// symbolSize: [30, 30],
|
||||
// symbolOffset: [0, 0],
|
||||
// z: 9999,
|
||||
// data: [
|
||||
// {
|
||||
// img: `image://${SheepImg}`,
|
||||
// map: '',
|
||||
// name: '羊',
|
||||
// value: ['105.2333', '29.2641'],
|
||||
// },
|
||||
// {
|
||||
// img: `image://${SheepImg}`,
|
||||
// map: '',
|
||||
// name: '猪',
|
||||
// value: ['105.2333', '29.2643'],
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
|
||||
{
|
||||
type: 'map',
|
||||
zoom: 1.1,
|
||||
zoom: 1,
|
||||
roam: false,
|
||||
map: 'lcxz',
|
||||
name: 'nylx-key',
|
||||
|
|
@ -329,19 +314,63 @@
|
|||
},
|
||||
},
|
||||
itemStyle: {
|
||||
areaColor: 'rgb(242,230,230 , 0.7)',
|
||||
borderColor: '#fff',
|
||||
borderWidth: 0.1,
|
||||
},
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
label: {
|
||||
show: false,
|
||||
},
|
||||
areaColor: 'rgba(128, 217, 248, 0.2)',
|
||||
borderWidth: 0,
|
||||
},
|
||||
},
|
||||
|
||||
data: _data,
|
||||
},
|
||||
|
||||
{
|
||||
type: 'scatter',
|
||||
name: 'nylx-key1',
|
||||
coordinateSystem: 'geo',
|
||||
stateAnimation: {
|
||||
duration: 300,
|
||||
easing: 'bounceOut',
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
align: 'center',
|
||||
formatter: function (params) {
|
||||
var name = params.name
|
||||
var text = `{tline|${name}}`
|
||||
return text
|
||||
},
|
||||
color: '#fff',
|
||||
rich: {
|
||||
fline: {
|
||||
padding: [0, 25],
|
||||
color: '#fff',
|
||||
textShadowColor: '#030615',
|
||||
textShadowOffsetX: 1,
|
||||
textShadowOffsetY: 1,
|
||||
fontSize: 14,
|
||||
fontWeight: 400,
|
||||
},
|
||||
tline: {
|
||||
padding: [0, 27],
|
||||
color: '#ABF8FF',
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#00FFF6',
|
||||
},
|
||||
symbol: img2,
|
||||
symbolSize: [100, 34],
|
||||
symbolOffset: [0, -26],
|
||||
z: 999,
|
||||
data: _typeBackArr,
|
||||
},
|
||||
],
|
||||
}
|
||||
setOptions(options)
|
||||
|
|
@ -591,7 +620,7 @@
|
|||
|
||||
let tempName: any = null
|
||||
|
||||
const _seriesName = ['nylx-key', '肉羊产业分布点', '生猪产业分布点']
|
||||
const _seriesName = ['nylx-key', 'nylx-key1', '肉羊产业分布点', '生猪产业分布点']
|
||||
|
||||
onMounted(async () => {
|
||||
// await getData()
|
||||
|
|
|
|||
Loading…
Reference in New Issue