# MP-EzxrCloudMap-Demo

**Repository Path**: ezxrdev/MP-EzxrCloudMap-Demo

## Basic Information

- **Project Name**: MP-EzxrCloudMap-Demo
- **Description**: 微信小程序接入易现VPS（Visual Positioning System）的示例项目，实现基于空间定位的AR效果。本项目展示了如何在微信小程序中集成易现AR云定位服务，实现精准的空间定位和AR内容展示。
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://vps.ezxr.com
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 0
- **Created**: 2025-07-01
- **Last Updated**: 2025-08-26

## Categories & Tags

**Categories**: Uncategorized

**Tags**: ar, 6DoF, vps, 微信小程序, 视觉定位

## README

# MP-EzxrCloudMap-Demo

## 项目介绍

微信小程序接入易现 VPS（Visual Positioning System）的示例项目，实现基于空间定位的 AR 效果。本项目展示了如何在微信小程序中集成易现云定位服务，实现精准的空间定位和 AR 内容展示。

## 功能特点

- 基于易现 VPS 的精准空间定位
- 微信小程序 AR 场景渲染
- 3D 模型加载与显示
- 云定位识别与提示
- 支持 6DOF（六自由度）空间跟踪

## 技术架构

本项目基于微信小程序框架开发，主要包含以下技术组件：

- 微信小程序原生框架
- 易现 AR 插件（ezxrCloudMap）
- 微信 XR-Frame 框架
- 3D 模型渲染与交互

项目结构：
```
├── pages/                  # 小程序主页面
├── ezxrCloudAR/            # AR 功能子包
│   ├── Components/         # AR 相关组件
│   └── pages/              # AR 页面
└── utils/                  # 工具函数
```

## 安装教程

1. 克隆或下载本项目代码
2. 使用微信开发者工具导入项目
3. 在[易现 VPS 平台](https://vps.ezxr.com)上创建地图并获取云定位地址
4. 在项目中配置小程序 AppID 和插件信息
5. 在`app.json`中确认已添加 ezxrCloudMap 插件配置

## 使用说明

1. **准备工作**
   - 在[易现 VPS 平台](https://vps.ezxr.com)上完成建图
   - 获取云定位地址

2. **配置云定位地址**
   - 打开`/ezxrCloudAR/pages/index/index.js`文件
   - 修改`encodeCloudLocUrl`变量，替换为您自己的云定位地址

3. **自定义 3D 内容**
   - 打开`ezxrCloudAR/Components/ezxrContents/ARContent/ARContent.js`文件进行内容定制
   - 当前示例使用动态方式构建虚拟场景，您可以参考以下关键部分：
     - `resourceSamples`对象（L21-66）：定义场景中的视频、图片和 3D 模型资源
     - 场景构建方法（L194-196）：`addImgs`、`addModels`和`addVideos`
   - 示例代码展示了多种 AR 内容创作能力：
     - 场景构建与布局
     - 交互事件处理
     - 模型动画播放
     - 普通视频与透明视频播放
   - 更多高级功能可参考微信官方 XRFrame 文档

4. **运行项目**
   - 编译并在真机上预览项目
   - 在首页选择体验模式：
     - 点击"GO TO XRFrame CloudAR 6DoF"按钮进入六自由度 AR 体验（支持旋转和位移）
     - 点击"GO TO XRFrame CloudAR 3DoF"按钮进入三自由度 AR 体验（仅支持旋转）
   - 按照屏幕提示进行云定位识别
   - 参考页面底部的说明了解 3DoF 和 6DoF 的区别及适用场景

## 注意事项

- 本项目需要在支持 AR 的微信版本和设备上运行
- 首次使用时需要进行云定位识别，可能需要一定时间
- 建议在光线充足的环境中使用，以获得更好的定位效果

## 相关资源

- [易现 VPS 平台](https://vps.ezxr.com)
- [微信小程序开发文档](https://developers.weixin.qq.com/miniprogram/dev/framework/)
- [微信 XR-Frame 开发文档](https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/overview/)