# gpui_map

**Repository Path**: Vimer_test/gpui_map

## Basic Information

- **Project Name**: gpui_map
- **Description**: AI生成的GPUI Map 示例 只做测试使用~
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-01
- **Last Updated**: 2025-11-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# GPUI Map

基于 [gpui 0.2.2](https://github.com/zed-industries/zed/tree/main/crates/gpui) 的地图组件库，提供类似于 [flutter_map](https://pub.dev/packages/flutter_map) 的地图功能。

## 特性

- ✅ 瓦片地图渲染（支持 OpenStreetMap 等瓦片服务）
- ✅ 标记图层（支持自定义图标和聚类）
- ✅ 覆盖图层（多边形、折线、圆形、矩形）
- ✅ 地图交互（平移、缩放、旋转）
- ✅ 图层管理系统
- ✅ 地图控制器 API
- ✅ 事件系统

## 快速开始

### 添加依赖

在 `Cargo.toml` 中添加：

```toml
[dependencies]
gpui_map = "0.1.0"
```

### 基础用法

```rust
use gpui::{App, WindowOptions};
use gpui_map::prelude::*;

fn main() {
    App::new().run(|cx: &mut AppContext| {
        let options = WindowOptions::default();
        cx.open_window(options, |cx| {
            // 创建地图视图
            let map_view = MapViewBuilder::new()
                .with_options(MapOptions::default())
                .build(cx);
            
            // 添加瓦片图层
            map_view.update(|map, cx| {
                let tile_layer = TileLayer::new(TileLayerOptions::default());
                map.layer_manager().add_layer(Box::new(tile_layer));
            });
            
            map_view
        });
    });
}
```

### 运行示例

```bash
cargo run --example basic_map
```

## 架构概览

### 核心组件

- **MapWidget**: 主要的地图组件，负责渲染和交互
- **MapCamera**: 地图相机系统，处理坐标转换和视图控制
- **LayerManager**: 图层管理器，负责图层的添加、移除和渲染
- **MapController**: 地图控制器，提供程序化控制接口

### 图层系统

- **TileLayer**: 瓦片图层，负责加载和渲染地图瓦片
- **MarkerLayer**: 标记图层，支持标记的显示和交互
- **OverlayLayer**: 覆盖图层，支持各种几何图形的绘制

### 坐标系统

使用 Web Mercator 投影（EPSG:3857），支持经纬度坐标和屏幕坐标之间的转换。

## API 文档

### 地图选项 (MapOptions)

```rust
let options = MapOptions {
    initial_center: LatLng::new(39.9042, 116.4074), // 初始中心点
    initial_zoom: 10.0,                              // 初始缩放级别
    initial_rotation: 0.0,                          // 初始旋转角度
    interaction: InteractionOptions {
        dragging_enabled: true,                      // 启用拖拽
        scroll_wheel_zoom_enabled: true,            // 启用滚轮缩放
    },
    zoom: ZoomOptions {
        min_zoom: 0.0,                               // 最小缩放级别
        max_zoom: 18.0,                              // 最大缩放级别
    },
    view: ViewOptions {
        background_color: "#f0f0f0".to_string(),      // 背景颜色
    },
};
```

### 标记图层

```rust
let mut marker_layer = MarkerLayer::new(MarkerLayerOptions::default());

// 添加标记
marker_layer.add_marker(Marker::new(LatLng::new(39.9042, 116.4074))
    .with_title("北京".to_string())
    .with_description("中国首都".to_string()));

// 添加到地图
map_view.update(|map, cx| {
    map.layer_manager().add_layer(Box::new(marker_layer));
});
```

### 覆盖图层

```rust
let mut overlay_layer = OverlayLayer::new(OverlayLayerOptions::default());

// 添加圆形覆盖物
let circle = OverlayTools::create_circle(
    LatLng::new(39.9042, 116.4074),
    50000.0, // 50公里半径
    "beijing_circle".to_string()
);

overlay_layer.add_overlay(circle);

// 添加到地图
map_view.update(|map, cx| {
    map.layer_manager().add_layer(Box::new(overlay_layer));
});
```

### 地图控制器

```rust
let controller = Arc::new(MapController::new());

// 程序化控制地图
controller.move_to(LatLng::new(31.2304, 121.4737), 12.0); // 移动到上海，缩放级别12
controller.zoom_to(15.0);                                 // 缩放到级别15
controller.rotate_to(45.0);                              // 旋转45度

// 监听地图事件
controller.add_event_listener(|event| {
    match event {
        MapEvent::Zoom { zoom, center } => {
            println!("地图缩放至: {}", zoom);
        }
        MapEvent::Drag { position, delta } => {
            println!("地图拖拽: {:?}", delta);
        }
        _ => {}
    }
});
```

## 开发状态

当前版本为 0.1.0，处于开发阶段。主要功能已实现，但还需要完善：

- [ ] 异步瓦片加载优化
- [ ] 标记图标渲染实现
- [ ] 覆盖物几何图形渲染
- [ ] 性能优化和缓存改进
- [ ] 更多测试用例

## 贡献

欢迎提交 Issue 和 Pull Request！

## 许可证

MIT OR Apache-2.0