Deeper Spatial

一个基于Vue3的WebGL和WebGIS组件库，整合了多种开源地图和可视化组件。

特性

• 🗺️ 地图组件: 支持高德地图、OpenLayers等多种地图引擎
• 📊 图表组件: 基于ECharts的数据可视化组件
• 🎨 UI组件: 基于Element Plus的增强UI组件
• 🎬 视频组件: 支持多种视频格式播放
• 🎭 动画组件: 支持Lottie动画
• 📱 响应式: 支持移动端和桌面端
• 🎯 TypeScript: 完整的TypeScript支持

安装

npm install deeper-spatial
# 或
yarn add deeper-spatial
# 或
pnpm add deeper-spatial

使用

完整引入

import { createApp } from 'vue'
import DeeperSpatial from 'deeper-spatial'
import 'deeper-spatial/lib/style.css'

const app = createApp(App)
app.use(DeeperSpatial)
app.mount('#app')

按需引入

import { TButton, TMap, TChart } from 'deeper-spatial'
import 'deeper-spatial/lib/style.css'

// 在组件中使用
export default {
  components: {
    TButton,
    TMap,
    TChart
  }
}

组件列表

地图组件

• TMap - 高德地图组件
• BigMap - 大屏地图组件
• TMap3 - OpenLayers地图组件

图表组件

• TChart - ECharts图表组件

表单组件

• TForm - 表单组件
• TModuleForm - 模块表单组件
• TQueryCondition - 查询条件组件

数据展示组件

• TTable - 表格组件
• TSelectTable - 选择表格组件
• TDetail - 详情展示组件

基础组件

• TButton - 按钮组件
• TCheckbox - 复选框组件
• TRadio - 单选框组件
• TSelect - 选择器组件
• TDatePicker - 日期选择器组件
• TTabs - 标签页组件
• TStepWizard - 步骤向导组件

布局组件

• TAdaptivePage - 自适应页面组件
• TLayoutPage - 布局页面组件

开发

# 安装依赖
pnpm install

# 启动开发服务器
pnpm docs:dev

# 构建库
pnpm lib

# 构建文档
pnpm docs:build

许可证

MIT

作者

youPengCheng - [email protected]

仓库

• GitHub: https://github.com/youpengcheng/TimeChart