vue中引入的高德地图加载有时出来有时不出来,高德地图有时显示空白,刷新几次又能正常显示

在地图上根据坐标显示点标记，当鼠标移到点标记上时，弹出相应的信息小弹框，同时小弹框中有可以点击的按钮，点击地图其他地方时关闭信息窗体，实现效果如下：

 安装vue-amap文档
大概思路为，遍历接口信息，将坐标push进点标记列表中，同时将信息窗体push进来，位置为点标记的位置适当偏移，新版本el-amap-info-window中可以写内部的content及样式，省去字符串拼接的麻烦，代码：

<template>
  <div class="amap-page-container">
    <div class="toolbar">
      当前坐标: {
  { lng }}, {
  { lat }}
    </div>
    <el-amap
      vid="amapDemo"
      :center="center"
      :zoom="zoom"
      class="amap-demo"