ol-vue-tsx

文档

https://keyljw.github.io/ol-vue-tsx

基于 vue3 和 tsx 封装openlayers组件库。。 支持全量导入、按需导入和自动导入

觉得有用可以给个star

快速开始

引导您如何在项目中使用ol-vue-tsx

Vue版本

当前支持的 Vue 版本^3.0.0

1. 安装

进入你的项目文件夹，使用 PNPM 安装ol-vue-tsx

# npm
npm install -S ol-vue-tsx

# yarn
yarn  add -S ol-vue-tsx

# pnpm
pnpm add -S ol-vue-tsx

2. 引入插件和配置

在src/main.ts文件中写入以下内容

// 全局注册
import omap from 'ol-vue-tsx'

createApp(App).use(omap, { tk: '天地图tk' }).mount('#app')

// 全局注册部分组件
import { OPoint } from 'ol-vue-tsx'

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

使用

在src/App.vue文件的<template>中增加以下内容

<template>
  <!-- 使用 地图 组件 -->
  <o-map height="400px" :center="[120.261466, 30.337523]" :zoom="8" />
</template>