# 图表编辑器

**Repository Path**: backestrokefish/graph-editor-

## Basic Information

- **Project Name**: 图表编辑器
- **Description**: 基于vue和nodejs得图表编辑器，实现了图表编辑，看板的删除
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 3
- **Forks**: 2
- **Created**: 2022-05-27
- **Last Updated**: 2023-02-20

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 图表编辑器

#### 介绍
基于vue和nodejs得图表编辑器，实现了图表编辑，看板的删除

#### 软件架构
软件架构说明


#### 安装教程

1.  前端npm init
2.  后端nodemon app.js启动服务器
3.  数据库使用开源的mysql


#### 使用说明

1.  前端是基于vue2
2.  后端是使用nodejs来搭建
3.  代码部分逻辑不是很好，有待优化
4.  有空会继续优化

#### 功能
1. 图表拖拽缩放编辑

使用第三方组件vue-draggable-resizable-gorkys实现

2. 图表数据，样式编辑
3. 保存画布
4. 删除画布
5. 查看画布图表


#### 效果

![图表编辑](https://images.gitee.com/uploads/images/2022/0528/112712_1e188ddf_8881926.png "微信图片_20220528112615.png")

![保存画布](https://images.gitee.com/uploads/images/2022/0528/112751_b5fdcd21_8881926.png "微信图片_20220528112623.png")

![删除画布](https://images.gitee.com/uploads/images/2022/0528/112820_5a81540b_8881926.png "微信图片_20220528112631.png")

![点击查看画布](https://images.gitee.com/uploads/images/2022/0528/112857_d2a45b9c_8881926.png "微信图片_20220528112627.png")

#### 补充说明与参考

1.  项目思路有参考网络上的项目，时间较长，没有找到参考出处，如发现可联系我，再标明参考链接
2.  项目有待优化的地方很多，希望大家能够一起参与