使用 javascript 创建路段

Create road section using javascript

在我的 React 应用程序中，我想创建的不是通常的 form 用于创建路段。

比如我有这个方案是png格式的

但我想创建一个交互式编辑器，可以在其中创建方案，将它们保存到服务器，然后重新使用。

我会尝试模拟一种情况

用户想要创建一个新路段。 道路有六车道。 （上图）

  1. 用户应该可以自己画这个图（所有线、圆、图像等）

  2. 将此数据保存到服务器

然后用户想要接收关于一条特殊车道的数据。 （此功能在另一个组件中取出）

因此，用户打开新的组件，他可以在其中通过他将选择的某些车道获得统计信息

  1. 从服务器获取保存的方案

  2. 渲染此方案并为每个车道集成复选框

选择车道后，用户向服务器发送信息，希望在哪个车道上接收摘要（统计信息）

找到了Konva框架https://konvajs.org/ or p5.js (https://p5js.org/)，但是我觉得这种做法很繁琐

我可以用什么来构建这样的东西？

有许多 canvas 框架可以完成这项工作。

或者您可以使用 SVG 直接绘制到 DOM。