vue-baidu-map插件中bm-marker组件嵌套bm-info-window组件使用，在地图上生成多个点

╰半橙微兮° 2023-10-11 14:18 9阅读 0赞

### **template：** ###

markers: [
            {
              lng: 113.001546,
              lat: 28.20648,
              name: "测试矛盾111",
              showFlag: false //flag放在每一条数据里
            },
            {
              lng: 113.001546,
              lat: 27.20648,
              name: "测试矛盾112",
              showFlag: false
            }
          ],

## **data：** ##

markers: [
            {
              lng: 113.001546,
              lat: 28.20648,
              name: "测试矛盾111",
              showFlag: false //flag放在每一条数据里
            },
            {
              lng: 113.001546,
              lat: 27.20648,
              name: "测试矛盾112",
              showFlag: false
            }
          ]

## **method：** ##

// 点击点坐标赋值
        lookDetail(marker) {
          marker.showFlag = true;
          this.infoWindow.info = marker;
        },
        // 关闭弹窗
        infoWindowClose(marker) {
          marker.showFlag = false;
        },
        // 打开弹窗
        infoWindowOpen(marker) {
          marker.showFlag = true;
        },

## **3. 使用 `<bm-label>` 点位置添加标注** ##

<bm-marker>
      <bm-label
        content="1"
        :labelStyle="{color: '#fff', fontSize : '12px',background:'rgba(0, 0, 0, 0)',borderColor:'rgba(0, 0, 0, 0)'}"
        :offset="{width: 4,height:2 }"
      />
    </bm-marker>

发表评论取消回复

表情：

评论列表（有 0 条评论，9人围观）

还没有评论，来说两句吧...

相关阅读

相关 Servlet组件(上)

Servlet组件(上) 学习目标了解Web资源的概念了解为什么需要Servlet 掌握Servlet是什么掌握Servlet的Hel

迷南。/ 2024年03月30日 15:41/ 0 赞/ 45 阅读

相关组装多个@Configuration组件

在系统中，我们往往会根据业务逻辑的层次化或模块化对系统不同模块进行划分，于是，针对不同的层次或者模块，就会有不同的配置信息，当我们要用到这些层次或者模块的配置信息的时候，是不是

灰太狼/ 2023年10月17日 18:55/ 0 赞/ 22 阅读

相关 vue-baidu-map插件中bm-marker组件嵌套bm-info-window组件使用，在地图上生成多个点

template： markers: [ { lng: 113.001546, l

╰半橙微兮°/ 2023年10月11日 14:18/ 0 赞/ 10 阅读

相关 lombok组件、GenerateAllSetter插件的使用

lombok组件 > lombok组件，主要功能是让编写的代码更加优雅，（本质是快速帮我们编写getter setter 方法 toString方法构造方法，还有日志框

叁歲伎倆/ 2023年09月23日 20:15/ 0 赞/ 164 阅读

相关 Swing组件（上）

目录一、标签与按钮二、文本输入组件三、复选框与单选按钮四、下拉列表 Swing所有组件都继承自JCo

叁歲伎倆/ 2023年07月08日 09:13/ 0 赞/ 20 阅读

相关在Vue项目中使用React组件，在React项目中使用Vue组件

开发中遇到一个需求：在Vue项目中使用已经开发好的React组件。这里选择了使用vuera库来完成需求。下面记录一下使用的步骤（在Reat项目中使用Vue组件与此步骤类似）。

短命女/ 2022年10月12日 05:59/ 0 赞/ 644 阅读

相关 vue组件嵌套

背景我们知道创建脚手架项目后，index.html是入口地址，调用App.vue，想要在App.vue调用其他组件该怎么办呐方法 1.在component创建

- 日理万妓/ 2021年12月11日 23:57/ 0 赞/ 276 阅读

相关在vue中使用tinymce组件

第一步：安装tinymce npm install @tinymce/tinymce-vue --save 第二步:下载tinymce文件，要把文件放到本地使用 https:

忘是亡心i/ 2021年11月13日 22:58/ 0 赞/ 694 阅读

相关 vue组件嵌套（简易实战）

创建脚手架项目后，怎么在App.vue调用其他组件呢方法 1.在components创建自己的组件，这里创建test.vue <template>

系统管理员/ 2021年11月09日 18:26/ 0 赞/ 1112 阅读

相关 Vue组件插件大全

UI组件 [element][] \- 饿了么出品的Vue2的web UI工具套件 [Vux][] \- 基于Vue和WeUI的组件库 [mint-u

待我称王封你为后i/ 2021年09月27日 16:26/ 0 赞/ 399 阅读