# konva-designer-sample

**Repository Path**: weixinper/konva-designer-sample

## Basic Information

- **Project Name**: konva-designer-sample
- **Description**: 前端使用 Konva 实现可视化设计器
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 16
- **Created**: 2024-04-11
- **Last Updated**: 2024-04-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 使用 Konva 实现一个设计器交互

[示例地址](https://xachary.github.io/konva-designer-sample/)

![image](https://github.com/xachary/konva-designer-sample/assets/16830398/4a995eb9-5756-4ec4-a02d-f3a5eb21189a)

![2](https://github.com/xachary/konva-designer-sample/assets/16830398/e43cc89c-c543-4c22-a029-db867ad8502d)

![3](https://github.com/xachary/konva-designer-sample/assets/16830398/3f7f57d7-152b-4131-8cbd-5d94b553df4c)

## 功能点

- 无限画布（√）
- 画布拖拽（√）
- 缩放（√）
- 画布网格（√）
- 比例尺（√）
- 坐标参考线（√）
- 把素材从左侧面板拖入设计区域（√）
- 鼠标、键盘移动节点（√）
- 鼠标、键盘单选、多选节点（√）

## 更多功能

> _如果 Star 能超过 50 个（望多多支持），将很快更新_

- 放大缩小所选的“磁贴效果”（基于网格）
- 拖动所选的“磁贴效果”（基于网格）
- 节点层次单个、批量调整
- 键盘复制、粘贴
- 等等。。。