The current repo belongs to Paused status, and some functions are restricted. For details, please refer to the description of repo status
19 Star 203 Fork 50

gyy / vue-bmap-gl
Paused

Create your Gitee Account
Explore and code with more than 8 million developers,Free private repositories !:)
Sign up
Clone or Download
contribute
Sync branch
Cancel
Notice: Creating folder will generate an empty file .keep, because not support in Git
Loading...
README.md

vue-bmap-gl

npm (tag) NPM downloads JS gzip size NPM star

:x: 由于百度需要开源文档认证,组件库停止维护,后续文档也会同步下线,有需要的可以下载代码本地运行查看文档,百度key也会失效,可以更换为自己的key

vue-bmap-gl@next是一套基于Vue3 和百度GL的地图组件。 该版本对原组件进行升级,主要适配Vue3,同时调整事件绑定形式,调整为使用v-on进行事件绑定。 支持全量导入、按需导入和自动导入

vue2请使用0.x版本,对应分支vue2

觉得有用可以给个star

:q

捐赠支持

支付宝 微信

安装

npm i -S vue-bmap-gl@next

文档

https://vue-bmap-gl.guyixi.cn

快速上手

引入vue-bmap-gl@next

// 引入vue-bmap-gl
import VueBMap, {initBMapApiLoader} from 'vue-bmap-gl';
import 'vue-bmap-gl/dist/style.css';

// 初始化vue-bmap-gl
initBMapApiLoader({
  // 高德的key
  ak: 'YOUR_KEY',
});
createApp(App).use(VueBMap)

自动导入

首先你需要安装unplugin-vue-componentsunplugin-auto-import@vuemap/unplugin-resolver这三款插件

npm install -D unplugin-vue-components unplugin-auto-import @vuemap/unplugin-resolver

然后在main.ts中导入css和进行初始化key

import App from './App.vue'
import {initBMapApiLoader} from 'vue-bmap-gl';
import 'vue-bmap-gl/dist/style.css'
initBMapApiLoader({
    ak: 'YOUR_KEY'
})

createApp(App)
    .mount('#app')

再修改配置文件,把下列代码插入到你的 Vite 或 Webpack 的配置文件中

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import {VueBmapGlResolver} from '@vuemap/unplugin-resolver'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      resolvers: [VueBmapGlResolver()],
    }),
    Components({
      resolvers: [VueBmapGlResolver()],
    }),
  ]
})

组件

地图

<el-bmap  :zoom="zoom" :center="center">
</el-bmap>

About

vue-bmap-gl是一套支持Vue2、Vue3和百度地图WebGL版本的地图组件 expand collapse
Cancel

Releases (25)

All

vue-bmap-gl

Contributors

All

Activities

Load More
can not load any more
JavaScript
1
https://gitee.com/guyangyang/vue-bmap-gl.git
git@gitee.com:guyangyang/vue-bmap-gl.git
guyangyang
vue-bmap-gl
vue-bmap-gl
dev

Search

E71a60c3 8189591 Df7b7c6b 8189591