|
@@ -12,10 +12,7 @@
|
|
|
:close-when-click-map="true"
|
|
|
:is-custom="true"
|
|
|
>
|
|
|
- <div id="info-window">
|
|
|
- <p>{{ window.text }}</p>
|
|
|
- </div>
|
|
|
- </el-amap-info-window>
|
|
|
+ </el-amap-info-window>
|
|
|
</el-amap>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -89,28 +86,33 @@ export default {
|
|
|
mouseover() {
|
|
|
// 方法:鼠标移动到点标记上,显示相应窗体
|
|
|
that.windows.forEach(window => {
|
|
|
- window.visible = false // 关闭窗体
|
|
|
+ window.visible = false // 关闭窗体
|
|
|
})
|
|
|
that.window = that.windows[index]
|
|
|
that.$nextTick(() => {
|
|
|
- that.window.visible = true
|
|
|
+ that.window.visible = true
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
- windows.push({
|
|
|
- position: item.position,
|
|
|
- isCustom: true,
|
|
|
- offset: [115, 55], // 窗体偏移
|
|
|
- showShadow: false,
|
|
|
- visible: false, // 初始是否显示
|
|
|
- text: item.text
|
|
|
- })
|
|
|
+
|
|
|
+ windows.push({
|
|
|
+ position: item.position,
|
|
|
+ isCustom: true, //是否自定义信息窗体
|
|
|
+ offset: [125, 45], // 窗体偏移
|
|
|
+ showShadow: false,
|
|
|
+ visible: false, // 初始是否显示
|
|
|
+ content: `<div style="color:white;width:211px;background-color:rgba(7,25,54,0.6);padding: 0 0 10px 0">
|
|
|
+ <h3 style="background-color:#071936;padding:5px;">人员信息</h3>
|
|
|
+ <img src="${item.text.avatarUrl}" width="100%" height="100%">
|
|
|
+ <strong>姓名:</strong>${item.text.name}
|
|
|
+ </div>`
|
|
|
+ })
|
|
|
})
|
|
|
- // 加点
|
|
|
- this.texts = texts
|
|
|
- // 加弹窗
|
|
|
- this.windows = windows
|
|
|
+ // 加点
|
|
|
+ this.texts = texts
|
|
|
+ // 加弹窗
|
|
|
+ this.windows = windows
|
|
|
})
|
|
|
.catch(() => {
|
|
|
});
|
|
@@ -133,21 +135,8 @@ export default {
|
|
|
vertical-align: 10px;
|
|
|
}
|
|
|
|
|
|
-.amap-demo {
|
|
|
- height: 800px;
|
|
|
- }
|
|
|
- .amap-page-container {
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- #info-window{
|
|
|
- width: 211px;
|
|
|
- height: 80px;
|
|
|
- margin-left: 30px;
|
|
|
- background:rgba(255,255,255,0.9);
|
|
|
- border-radius: 1px;
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- }
|
|
|
-
|
|
|
+ .amap-demo {
|
|
|
+ height: 800px;
|
|
|
}
|
|
|
+}
|
|
|
</style>
|