arch-diagram
v0.0.8
Published
```shell $ pnpm install $ pnpm dev ```
Readme
开发
$ pnpm install
$ pnpm dev发布
$ pnpm build
$ npm publish开发参考
- Vue Jsx 语法参考 https://github.com/vuejs/babel-plugin-jsx
- 图标资源 https://vecta.io/symbols
- 竞品参考 https://app.terrastruct.com/
- SVG 图标转为单路径的
使用
InkScape软件
- Select everything, and do Ungroup Shift+Ctrl+G 5 times to remove all those unnecessary nested groups.
- Do Path > Stroke to Path to turn the horizontal stroke into a path.
- Now you can do Path > Combine, or alternatively do Path > Union if you want to get rid of any overlaps.
- Do File > Cleanup document
- To export as optimised SVG, do File > Save as, then select "Optimised SVG" from the file type dropdown.
工具
从图标配置提取图标 图标面板上需要显示预览图标， 但是 x6 自带的 stencil 很难满足要求， 因此写了个通过自定义节点来提取 svg 图标的工具， 可以用这个工具生成 svg, 粘贴进图标配置文件中 http://localhost:5173/tools/icon/
SVG 图标 Path 编辑器 https://mavo.io/demos/svgpath/ https://svg-path-visualizer.netlify.app/ https://svg-path.com/
参考教程
- https://developer.mozilla.org/zh-CN/docs/Web/SVG/Tutorial/Introduction
- https://x6.antv.antgroup.com/tutorial/about