Skip to content

P
pudong-elevator-map
Commit be76af1e authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

完善金杨街镇数据

parent 96eb6ce4
Show whitespace changes
Inline Side-by-side
Showing with 72229 additions and 302 deletions
index.html
View file @ be76af1e
......@@ -10,7 +10,7 @@
font-size: 1.6vh;
}
</style>
<script language="javascript" src="http://webapi.amap.com/maps?v=1.4.15&key=ee2b5d5c0c44c768f1d2593eb4a7dfa6&plugin=Map3D,AMap.DistrictSearch,AMap.ControlBar"></script>
<script language="javascript" src="http://webapi.amap.com/maps?v=1.4.15&key=ee2b5d5c0c44c768f1d2593eb4a7dfa6&plugin=Map3D,AMap.DistrictSearch,AMap.ControlBar,ElasticMarker"></script>
</head>
<body>
<div id="app"></div>
......
src/main.js
View file @ be76af1e
......@@ -5,7 +5,7 @@ import Vue from 'vue'
import App from './App'
import router from './router'
import common from './util/common'
import {Icon, Button, Collapse, Panel} from 'view-design'
import {Icon, Button, Collapse, Panel, Modal, Table} from 'view-design'
import 'view-design/dist/styles/iview.css'
Vue.config.productionTip = false
......@@ -14,6 +14,8 @@ Vue.component('Button', Button)
Vue.component('Icon', Icon)
Vue.component('Collapse', Collapse)
Vue.component('Panel', Panel)
Vue.component('Modal', Modal)
Vue.component('Table', Table)
/* eslint-disable no-new */
new Vue({
el: '#app',
......
src/mock/index.js
View file @ be76af1e
......@@ -7,6 +7,7 @@ import hudong from './hudong'
import huamu from './huamu'
import jinqiao from './jinqiao'
import jinyang from './jinyang'
import jinyangBuilding from './jinyang-building'
import lujiazui from './lujiazui'
import shuyuan from './shuyuan'
import beicai from './beicai'
......@@ -26,7 +27,7 @@ import zhangjiang from './zhangjiang'
import zhoupu from './zhoupu'
import zhuqiao from './zhuqiao'
export default {
export const mockCommunity = {
caolu,
dongming,
gaodong,
......@@ -55,3 +56,7 @@ export default {
zhoupu,
zhuqiao,
}
export const mockBuilding = {
jinyangBuilding,
}
src/mock/jinyang-building.js 0 → 100644
View file @ be76af1e
This source diff could not be displayed because it is too large. You can view the blob instead.
src/mock/jinyang.js
View file @ be76af1e
......@@ -152,7 +152,7 @@ export default {
}, {
'name': '始信北苑',
'address': '栖山路1636弄1-35号',
'level': 3,
'level': 1,
'location': [121.568141, 31.257815],
'path': [
[121.56812, 31.256573],
......@@ -182,7 +182,7 @@ export default {
}, {
'name': '黄山一村',
'address': '博山东路440弄1-50号',
'level': 3,
'level': 2,
'location': [121.568601, 31.252048],
'path': [
[121.567285, 31.251935],
......@@ -240,22 +240,7 @@ export default {
[121.566188, 31.243942],
[121.564493, 31.242436]
]
}, {
'name': '大桥花苑',
'address': '居家桥路151弄11-33号',
'level': 1,
'location': [121.5621, 31.260843],
'path': [
[121.561441, 31.260174],
[121.56113, 31.260603],
[121.561634, 31.260859],
[121.561676, 31.260941],
[121.562733, 31.261531],
[121.56304, 31.261059],
[121.56189, 31.260388],
[121.561441, 31.260174]
]
}, {
},{
name: '罗山四村北区',
address: '万德路45弄1-18号',
level: 3,
......@@ -317,7 +302,7 @@ export default {
[121.57402, 31.26034]
]
}, {
'name': '蝶恋园',
'name': '蝶恋苑',
'address': '栖山路1899弄1-49号',
'level': 3,
'location': [121.572371, 31.262355],
......@@ -366,7 +351,7 @@ export default {
}, {
'name': '上泰花苑',
'address': '张杨路2855弄1-51号',
'level': 3,
'level': 1,
'location': [121.563419, 31.246141],
'path': [
[121.562211, 31.246069],
......@@ -402,7 +387,7 @@ export default {
[121.582441, 31.252501]
]
}, {
'name': '栖山路一八六一弄',
'name': '栖山路1861弄',
'address': '栖山路1861弄1-34号',
'level': 3,
'location': [121.570679, 31.261471],
......@@ -632,7 +617,7 @@ export default {
}, {
'name': '金杨九街坊',
'address': '金杨路685弄1-57号',
'level': 3,
'level': 2,
'location': [121.581557, 31.253448],
'path': [
[121.584561, 31.255095],
......@@ -705,7 +690,7 @@ export default {
}, {
name: '金樟花苑',
address: '栖山路1555弄1-34号',
level: 1,
level: 2,
location: [121.564975, 31.258681],
path: [
[121.565303, 31.259174],
......@@ -754,7 +739,7 @@ export default {
}, {
name: '罗山二村',
address: '德平路24弄15-31号',
level: 3,
level: 2,
location: [121.556887, 31.253225],
path: [
[121.557909, 31.252971],
......@@ -780,77 +765,23 @@ export default {
[121.557909, 31.252971]
]
}, {
'name': '罗山三村',
'address': '博山东路111弄1-20号',
'level': 2,
'location': [121.55955, 31.252983],
'path': [
[121.558381, 31.252818],
[121.55836, 31.252836],
[121.558354, 31.252853],
[121.558354, 31.252872],
[121.558364, 31.252888],
[121.558596, 31.253022],
[121.558609, 31.253029],
[121.558628, 31.253029],
[121.558646, 31.253022],
[121.558675, 31.253008],
[121.558696, 31.253001],
[121.558709, 31.253001],
[121.558721, 31.253006],
[121.558729, 31.253012],
[121.558907, 31.253131],
[121.559131, 31.253275],
[121.55946, 31.25349],
[121.559473, 31.253507],
[121.559477, 31.253523],
[121.559477, 31.253532],
[121.55945, 31.253664],
[121.559457, 31.253687],
[121.559469, 31.253706],
[121.559721, 31.253875],
[121.559737, 31.253877],
[121.559755, 31.253875],
[121.559791, 31.253854],
[121.559928, 31.253721],
[121.560665, 31.253008],
[121.560731, 31.252954],
[121.560739, 31.252951],
[121.560751, 31.252952],
[121.560762, 31.252957],
[121.560775, 31.252961],
[121.561443, 31.253398],
[121.561475, 31.253416],
[121.561498, 31.253419],
[121.561525, 31.253419],
[121.561554, 31.253406],
[121.561911, 31.253099],
[121.562499, 31.252461],
[121.563215, 31.251647],
[121.563696, 31.251105],
[121.564336, 31.250377],
[121.564345, 31.250359],
[121.564345, 31.250336],
[121.564334, 31.25032],
[121.56431, 31.250302],
[121.564167, 31.250202],
[121.563907, 31.250028],
[121.563416, 31.249748],
[121.563105, 31.249524],
[121.562539, 31.249171],
[121.562486, 31.249152],
[121.562449, 31.249146],
[121.562394, 31.249142],
[121.562346, 31.249142],
[121.562311, 31.249146],
[121.562285, 31.249152],
[121.562053, 31.249373],
[121.561525, 31.249854],
[121.560909, 31.250422],
[121.559627, 31.251614],
[121.559296, 31.251991],
[121.558381, 31.252818]
]
'name': '罗山三1村',
address: '栖山路1088弄1-34号',
level: 3,
location: [ 121.559568, 31.252905 ],
path:
[ [ 121.558612, 31.253022 ],
[ 121.558707, 31.252963 ],
[ 121.558974, 31.253147 ],
[ 121.559164, 31.253278 ],
[ 121.559508, 31.253459 ],
[ 121.559465, 31.253674 ],
[ 121.559747, 31.253866 ],
[ 121.560718, 31.252948 ],
[ 121.560014, 31.252488 ],
[ 121.559272, 31.252027 ],
[ 121.558365, 31.252857 ],
[ 121.558612, 31.253022 ] ]
}, {
'name': '金芙苑',
'address': '枣庄路769弄1-10号',
......@@ -909,7 +840,7 @@ export default {
[121.562731, 31.242613]
]
}, {
name: '仁和花苑(德平路)',
name: '仁和花苑',
address: '德平路730弄1-23号',
level: 3,
location: [ 121.564508, 31.244579 ],
......@@ -931,7 +862,7 @@ export default {
}, {
'name': '黄山始信苑',
'address': '枣庄路212弄1-38号',
'level': 3,
'level': 2,
'location': [121.57045, 31.2562],
'path': [
[121.570013, 31.253879],
......@@ -1095,7 +1026,7 @@ export default {
[121.573993, 31.240016]
]
}, {
'name': '金杨路750弄小区(金杨路)',
'name': '金杨路750弄小区',
'address': '金杨路750弄29-69号',
'level': 3,
'location': [121.584756, 31.251909],
......@@ -1156,31 +1087,21 @@ export default {
[121.573004, 31.248406]
]
}, {
'name': '六街坊小区',
'address': '梅花路768弄1-30号',
'level': 2,
'location': [121.554057, 31.20863],
'path': [
[121.555052, 31.20801],
[121.553854, 31.207801],
[121.553685, 31.208504],
[121.553098, 31.208397],
[121.553042, 31.208436],
[121.552992, 31.208449],
[121.552844, 31.209136],
[121.553704, 31.209217],
[121.554357, 31.209278],
[121.554611, 31.209284],
[121.5547, 31.209265],
[121.554771, 31.2092],
[121.554799, 31.209159],
[121.55495, 31.208576],
[121.555052, 31.20801]
]
name: '金杨新村六街坊',
address: '灵山路2000弄1-39号',
level: 2,
location: [ 121.57434, 31.24232 ],
path:
[ [ 121.574577, 31.241515 ],
[ 121.574157, 31.241303 ],
[ 121.573208, 31.242698 ],
[ 121.574513, 31.243338 ],
[ 121.575482, 31.241933 ],
[ 121.574577, 31.241515 ] ]
}, {
name: '陆家嘴新景园1期',
address: '云山路1050弄1-15号',
level: 1,
level: 3,
location: [121.571909, 31.248612],
path: [
[121.571904, 31.247828],
......@@ -1241,7 +1162,7 @@ export default {
[121.574249, 31.247029]
]
}, {
'name': '金芝苑(枣庄路)',
'name': '金芝苑',
'address': '枣庄路853弄1-24号',
'level': 3,
'location': [121.582986, 31.249211],
......@@ -1290,80 +1211,24 @@ export default {
[121.58633, 31.248674],
[121.586788, 31.248273]
]
}, {
'name': '罗山三村',
'address': '博山东路111弄1-20号',
'level': 2,
'location': [121.55955, 31.252983],
'path': [
[121.558381, 31.252818],
[121.55836, 31.252836],
[121.558354, 31.252853],
[121.558354, 31.252872],
[121.558364, 31.252888],
[121.558596, 31.253022],
[121.558609, 31.253029],
[121.558628, 31.253029],
[121.558646, 31.253022],
[121.558675, 31.253008],
[121.558696, 31.253001],
[121.558709, 31.253001],
[121.558721, 31.253006],
[121.558729, 31.253012],
[121.558907, 31.253131],
[121.559131, 31.253275],
[121.55946, 31.25349],
[121.559473, 31.253507],
[121.559477, 31.253523],
[121.559477, 31.253532],
[121.55945, 31.253664],
[121.559457, 31.253687],
[121.559469, 31.253706],
[121.559721, 31.253875],
[121.559737, 31.253877],
[121.559755, 31.253875],
[121.559791, 31.253854],
[121.559928, 31.253721],
[121.560665, 31.253008],
[121.560731, 31.252954],
[121.560739, 31.252951],
[121.560751, 31.252952],
[121.560762, 31.252957],
[121.560775, 31.252961],
[121.561443, 31.253398],
[121.561475, 31.253416],
[121.561498, 31.253419],
[121.561525, 31.253419],
[121.561554, 31.253406],
[121.561911, 31.253099],
[121.562499, 31.252461],
[121.563215, 31.251647],
[121.563696, 31.251105],
[121.564336, 31.250377],
[121.564345, 31.250359],
[121.564345, 31.250336],
[121.564334, 31.25032],
[121.56431, 31.250302],
[121.564167, 31.250202],
[121.563907, 31.250028],
[121.563416, 31.249748],
[121.563105, 31.249524],
[121.562539, 31.249171],
[121.562486, 31.249152],
[121.562449, 31.249146],
[121.562394, 31.249142],
[121.562346, 31.249142],
[121.562311, 31.249146],
[121.562285, 31.249152],
[121.562053, 31.249373],
[121.561525, 31.249854],
[121.560909, 31.250422],
[121.559627, 31.251614],
[121.559296, 31.251991],
[121.558381, 31.252818]
]
}, {
'name': '罗山一村(栖山路)',
},{
name: '罗山三2村',
address: '博山东路',
level: 2,
location: [ 121.561984, 31.251126 ],
path:
[ [ 121.559648, 31.251609 ],
[ 121.559878, 31.251919 ],
[ 121.560403, 31.252348 ],
[ 121.56108, 31.252734 ],
[ 121.561831, 31.253155 ],
[ 121.562648, 31.25227 ],
[ 121.564332, 31.250357 ],
[ 121.562536, 31.249186 ],
[ 121.562301, 31.249162 ],
[ 121.559648, 31.251609 ] ]
}, {
'name': '罗山一村',
'address': '龙居路30弄2-32号',
'level': 1,
'location': [121.558473, 31.254496],
......@@ -1417,46 +1282,7 @@ export default {
[121.56599, 31.248373]
]
}, {
'name': '金杨新村五街坊',
'address': '金杨路308弄之1-52号',
'level': 2,
'location': [121.577386, 31.245434],
'path': [
[121.57944, 31.244427],
[121.579538, 31.244006],
[121.579321, 31.243886],
[121.579512, 31.243549],
[121.577379, 31.242542],
[121.577202, 31.242479],
[121.577077, 31.242544],
[121.576314, 31.243612],
[121.576857, 31.24392],
[121.576314, 31.244699],
[121.57613, 31.244917],
[121.576018, 31.245359],
[121.575283, 31.245526],
[121.575043, 31.245424],
[121.574194, 31.246668],
[121.574198, 31.246758],
[121.574239, 31.246814],
[121.57434, 31.246873],
[121.574848, 31.246986],
[121.578417, 31.247729],
[121.578579, 31.24773],
[121.578698, 31.247704],
[121.578832, 31.247642],
[121.57907, 31.247421],
[121.579622, 31.246824],
[121.579606, 31.246752],
[121.578928, 31.246615],
[121.579149, 31.245752],
[121.579098, 31.2456],
[121.57923, 31.245119],
[121.579304, 31.244869],
[121.57944, 31.244427]
]
}, {
'name': '银山小区(银山路)',
'name': '银山小区',
'address': '银山路200弄之1-71号',
'level': 3,
'location': [121.580653, 31.243379],
......@@ -1509,40 +1335,32 @@ export default {
[121.589696, 31.249566]
]
}, {
'name': '梅园三街坊',
'address': '商城路1025弄-1-29号附近',
'level': 2,
'location': [121.524249, 31.234401],
'path': [
[121.524081, 31.234806],
[121.52411, 31.234847],
[121.524371, 31.234941],
[121.525251, 31.235245],
[121.525616, 31.234676],
[121.526249, 31.23491],
[121.526478, 31.234427],
[121.526501, 31.23436],
[121.526493, 31.234315],
[121.526474, 31.234276],
[121.526412, 31.234229],
[121.525379, 31.233739],
[121.524488, 31.23331],
[121.523727, 31.232954],
[121.523651, 31.232965],
[121.523564, 31.233012],
[121.523513, 31.233068],
[121.523484, 31.233135],
[121.523027, 31.234142],
[121.522666, 31.23489],
[121.522431, 31.235377],
[121.52244, 31.235453],
[121.522496, 31.235522],
[121.522558, 31.235559],
[121.523508, 31.235875],
[121.523974, 31.234919],
[121.524025, 31.234805],
[121.524081, 31.234806]
]
name: '金杨新村三街坊',
address: '枣庄路658弄1-56号',
level: 2,
location: [ 121.577974, 31.250455 ],
path:
[ [ 121.578322, 31.248367 ],
[ 121.5776, 31.249096 ],
[ 121.576666, 31.25003 ],
[ 121.575784, 31.250903 ],
[ 121.575647, 31.251037 ],
[ 121.575842, 31.251199 ],
[ 121.57599, 31.251314 ],
[ 121.576458, 31.251653 ],
[ 121.576839, 31.251971 ],
[ 121.577088, 31.252215 ],
[ 121.577304, 31.252447 ],
[ 121.578121, 31.25187 ],
[ 121.578725, 31.251454 ],
[ 121.579185, 31.251129 ],
[ 121.579982, 31.250567 ],
[ 121.580249, 31.250307 ],
[ 121.57971, 31.249754 ],
[ 121.57963, 31.249609 ],
[ 121.579199, 31.24916 ],
[ 121.579297, 31.249053 ],
[ 121.578322, 31.248367 ] ]
}, {
'name': '罗山八村',
'address': '德平路215弄1-59号',
......@@ -1597,7 +1415,7 @@ export default {
[121.563556, 31.251426]
]
}, {
'name': '寺前浜小区(团林路)',
'name': '寺前浜小区',
'address': '浦东大道2639弄1-36号',
'level': 1,
'location': [121.567991, 31.265056],
......@@ -1689,7 +1507,7 @@ export default {
}, {
'name': '香山新村西南街坊',
'address': '德平路1134弄54号',
'level': 1,
'level': 3,
'location': [121.568808, 31.238865],
'path': [
[121.568554, 31.237417],
......
src/views/main.vue
View file @ be76af1e
<template>
<div id="container">
<Collapse @on-change="handleSelect" class="menu" accordion>
<Collapse v-model="curStreet" @on-change="handleSelect" class="menu" accordion>
<Panel v-for="street in streetList" :key="street" :name="street">
{{areaList[street].name}}小区列表
<div slot="content" class="community-list">
<Button
<!-- <Button
v-for="(item, index) in areaList[street].community"
:key="item.name + index"
@click="handleView(item)"
......@@ -12,17 +12,32 @@
type="text"
long>
{{item.name}}
</Button> -->
<div v-for="(item, index) in areaList[street].community" :key="item.name + index" style="display:flex;justify-content:space-between;">
<Button
@click="handleView(item)"
size="small"
type="text"
long>
{{item.name}}
</Button>
<a @click="handleDetail(item)" style="display:block;min-width:5rem;text-align:right;">详情</a>
</div>
</div>
</Panel>
</Collapse>
<Modal v-model="detailModal" width="90%" :footer-hide="true">
<Table :columns="columns" :data="detailData" size="small" max-height="500"/>
</Modal>
</div>
</template>
<script>
const {AMap} = window
import axios from 'axios'
import mock from '@/mock/index.js'
const star1 = require('@/assets/images/star1.png')
const star2 = require('@/assets/images/star2.png')
const star3 = require('@/assets/images/star3.png')
import {mockCommunity, mockBuilding} from '@/mock/index.js'
export default {
name: 'Map3D',
data() {
......@@ -84,13 +99,109 @@ export default {
// mapStyle:'amap://styles/light',
features:['bg','road'],
},
areaList: mock,
areaList: mockCommunity,
buildingList: mockBuilding,
streetList: [],
curStreetPolygon: null,
curStreet: null,
markerList: [],
detailModal: false,
columns: [
{
title: '小区',
key: 'name',
minWidth: 50,
},
{
title: '楼栋号',
key: 'buildingNo',
minWidth: 50,
},
{
title: '房屋性质',
key: 'type',
minWidth: 50,
},
{
title: '房龄',
key: 'age',
minWidth: 50,
},
{
title: '层高',
key: 'high',
minWidth: 50,
},
{
title: '4层以上是否有70岁以上老人',
key: 'hasOld',
minWidth: 50,
},
{
title: '4层以上是否有行动不便的残障人员',
key: 'hasDisabled',
minWidth: 50,
},
{
title: '是否已有业主发起加梯动员',
key: 'hasMobilization',
minWidth: 50,
},
{
title: '楼内邻里关系是否和睦',
key: 'hasPeace',
minWidth: 50,
},
{
title: '楼内业主自住率是否高于80%',
key: 'hasSelf',
minWidth: 50,
},
{
title: '一楼是否非居',
key: 'hasNonliving',
minWidth: 50,
},
{
title: '是否有地下层',
key: 'hasUnderground',
minWidth: 50,
},
{
title: '占用车道',
key: 'hasLane',
minWidth: 50,
},
{
title: '占用绿化',
key: 'hasGreening',
minWidth: 50,
},
{
title: '占用车位',
key: 'hasParking',
minWidth: 50,
},
{
title: '楼间距',
key: 'spacing',
minWidth: 50,
},
{
title: '连廊长度',
key: 'corridorLength',
minWidth: 50,
},
{
title: '居民意愿',
key: 'intention',
minWidth: 50,
},
],
detailData: [],
}
},
mounted() {
this.streetList = Object.keys(mock)
this.$nextTick(this.initMap)
},
methods: {
......@@ -101,10 +212,36 @@ export default {
// this.addMarker()
this.addEvents()
this.highlightPudong()
this.initMenu()
},
initMenu() {
const streets = Object.keys(this.areaList)
if (this.$route.query && this.$route.query.name) { // 判断路由有街镇则显示该街镇列表，没街镇显示所有街镇列表
const streetName = this.$route.query.name
let result = null
streets.forEach(street => {
if (streetName.indexOf(this.areaList[street].name) >= 0) {
result = street
}
})
this.streetList = [result]
this.$nextTick(() => { // 为了展开默认街镇小区列表
this.curStreet = result
this.handleSelect([this.curStreet])
})
} else {
this.streetList = streets
}
},
handleView({name, address, location}) {
this.map.setZoomAndCenter(18, location)
this.showDetail(null, location, {title: name, content: address})
this.addMarker(name)
},
handleDetail({name}) {
if (!this.buildingList[`${this.curStreet}Building`]) return
this.detailData = this.buildingList[`${this.curStreet}Building`].building.filter(item => item.name.indexOf(name) >= 0)
this.detailModal = true
},
handleSelect(key) {
if (!key || key.length <= 0) return
......@@ -122,6 +259,9 @@ export default {
const communityList = []
if (street) {
communityList.push(...this.areaList[street].community)
if (this.buildingList[`${street}Building`]) {
communityList.push(...this.buildingList[`${street}Building`].community) // 添加个别不同色的，手动上色的楼栋
}
} else {
keys.forEach(key => {
communityList.push(...this.areaList[key].community)
......@@ -140,8 +280,9 @@ export default {
map:this.map
}).on('click', e => {
const location = [e.lnglat.getLng(), e.lnglat.getLat()]
console.log(location)
console.log(e.lnglat.getLng() + ',' + e.lnglat.getLat())
this.map.setZoomAndCenter(18.8, location)
this.handleView(item)
this.showDetail(e, location, {title: item.name, content: item.address})
})
}
......@@ -190,23 +331,110 @@ export default {
}
}))
},
addMarker() {
new AMap.Marker({
map: this.map,
position: [121.498973,31.218018],
addMarker(name) {
this.map.remove(this.markerList) // 移除之前的marker
if (!this.buildingList[`${this.curStreet}Building`]) return
const whichImage = (intention) => {
if (intention.indexOf('一') >= 0) {
return {
src: star1,
size: [10, 15],
}
} else if (intention.indexOf('二') >= 0 || intention.indexOf('两') >= 0) {
return {
src: star2,
size: [15, 15],
}
} else if (intention.indexOf('三') >= 0) {
return {
src: star3,
size: [20, 15],
}
}
}
const markerList = []
this.buildingList[`${this.curStreet}Building`].building.forEach(item => {
if(item.name.indexOf(name) >= 0 && item.lon && item.lat && item.intention) {
const image = whichImage(item.intention)
const style = {
img:image.src,
size:image.size,//可见区域的大小
fitZoom:18,//最合适的级别
scaleFactor:2,//地图放大一级的缩放比例系数
maxScale:1.4,//最大放大比例
minScale:0.8//最小放大比例
}
const marker = new AMap.ElasticMarker({
position: [item.lon, item.lat],
zooms:[16,20],
extData: {
title: '测试点击',
content: '测试额外附加数据',
title: item.buildingNo,
content: `居民意愿度:${item.intention}`
},
icon: new AMap.Icon({
size: new AMap.Size(30, 30), //图标大小
image: require('@/assets/images/attorney.png'),
// imageOffset: new AMap.Pixel(0, -60)
})
styles:[
{
icon:{
ancher:[0,30],//锚点
...style,
}
},
{
icon:{
ancher:[0,45],//锚点
...style,
}
},
{
icon:{
ancher:[0,60],//锚点
...style,
}
},
{
icon:{
ancher:[0,80],//锚点
...style,
}
},
{
icon:{
ancher:[0,100],//锚点
...style,
}
}
],
zoomStyleMapping: {
16:0,
17:1,
18:2,
19:3,
20:4,
}
}).on('click', e => {
const location = [e.lnglat.getLng(), e.lnglat.getLat()]
this.showDetail(e, location, marker.getExtData())
})
markerList.push(marker)
}
})
this.map.add(markerList)
this.markerList = markerList
// new AMap.Marker({
// map: this.map,
// position: [121.498973,31.218018],
// extData: {
// title: '测试点击',
// content: '测试额外附加数据',
// },
// icon: new AMap.Icon({
// size: new AMap.Size(30, 30), //图标大小
// image: require('@/assets/images/attorney.png'),
// // imageOffset: new AMap.Pixel(0, -60)
// })
// }).on('click', e => {
// const location = [e.lnglat.getLng(), e.lnglat.getLat()]
// this.showDetail(e, location, marker.getExtData())
// })
},
showDetail(e, location, data) {
// TODO
......@@ -237,8 +465,46 @@ export default {
fillOpacity: 0.2,
fillColor: '#80d8ff',
strokeColor: '#0091ea'
}).on('click', e => {
console.log(e.lnglat.getLng() + ',' + e.lnglat.getLat())
})
this.curStreetPolygon = polygon
// const outer = [
// new AMap.LngLat(-360,90,true),
// new AMap.LngLat(-360,-90,true),
// new AMap.LngLat(360,-90,true),
// new AMap.LngLat(360,90,true),
// ]
// const holes = [area.path]
// const pathArray = [
// outer
// ]
// pathArray.push.apply(pathArray,holes)
// const polygon1 = new AMap.Polygon( {
// pathL:pathArray,
// //线条颜色，使用16进制颜色代码赋值。默认值为#006600
// strokeColor: 'rgb(20,164,173)',
// strokeWeight: 4,
// //轮廓线透明度，取值范围[0,1]，0表示完全透明，1表示不透明。默认为0.9
// strokeOpacity:0.5,
// //多边形填充颜色，使用16进制颜色代码赋值，如：#FFAA00
// fillColor: 'rgba(255,255,255,0.3)',
// //多边形填充透明度，取值范围[0,1]，0表示完全透明，1表示不透明。默认为0.9
// fillOpacity: 1,
// //轮廓线样式，实线:solid，虚线:dashed
// strokeStyle:'dashed',
// /*勾勒形状轮廓的虚线和间隙的样式，此属性在strokeStyle 为dashed 时有效， 此属性在
// ie9+浏览器有效 取值：
// 实线：[0,0,0]
// 虚线：[10,10] ，[10,10] 表示10个像素的实线和10个像素的空白（如此反复）组成的虚线
// 点画线：[10,2,10]， [10,2,10] 表示10个像素的实线和2个像素的空白 + 10个像素的实
// 线和10个像素的空白 （如此反复）组成的虚线*/
// strokeDasharray:[10,2,10]
// })
// polygon1.setPath(pathArray)
// this.map.add(polygon1)
this.map.add([polygon])
},
highlightPudong() {
......@@ -321,13 +587,13 @@ export default {
position relative
.menu
position absolute
width 15%
width 18%
text-align left
top 1rem
left 1rem
z-index 100
max-height 80vh
overflow-y auto
// max-height 90vh
// overflow-y auto
</style>
<style lang="stylus">
.amap-logo
......@@ -339,7 +605,7 @@ export default {
height 100%
.menu
.ivu-collapse-content
max-height 60vh
max-height 80vh
overflow-y auto
overflow-x hidden
padding 0 1rem
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment