最前端｜低代码平台轻松设计可视化图表【内含网站资源】

布满荆棘的人生 2024-02-18 13:20 41阅读 0赞

在前端设计中，我们经常需要使用可视化图表来呈现数据和信息。然而，每次都要自己从头开始设计图表未免太过繁琐。为了解决这个问题，我们调研了low code平台上的可视化图表功能。

本篇文章为大家带来以下问题的解答：

**（1）low code 中“可视化图表分类组件”有哪些？**

**（2）可以在哪里找到 low code“可视化图表”的前端/设计资源？**

**目录**

一、low code介绍

二、low code 可视化图表分类

三、low code“可视化图表”的资源

四、总结

--------------------

### **一、low code介绍** ###

低代码（Low-Code）是一种快速设计和开发软件应用程序并且手动编码最少的方法。它可以为技术人员提供更快，更可靠的价值。通过在图形界面中使用可视化建模来组装和配置应用程序，开发人员可以跳过所有基础架构让开发速度提升起来

![format_png][]

### 二、**low code 可视化图表分类** ###

我们调研了 datav、Dooring、Raydata 光启光数据可视化的工具，其中可视化图表大致可以分“29”种不同的图表

![0a32c5de08a9b17c18cf6c89399d1ee8.png][]

*  **low code 可视化图表 29 种分类中的分组**

![011ec731ac5d04848f45c40a57f04a16.png][]

分组下的设计形式链接：

[https://www.figma.com/file/Zj87SKT9PgYBSsfr691knY/Untitled?node-id=0%3A1&t=duOdYHc1BFhXwZqP-1][https_www.figma.com_file_Zj87SKT9PgYBSsfr691knY_Untitled_node-id_0_3A1_t_duOdYHc1BFhXwZqP-1]

![format_png 1][]

### 三、**low code“可视化图表”的资源** ###

*  **部分“前端”可视化图表资源整合：**

![ecd9246e12d0c5588ebdb109ccaae67e.png][]

可以在Gutup（[https://github.com/][https_github.com]）中进行搜索，以查找已经集成了可视化图表的现有资源。

Gutup是一个面向开发人员的社交平台，提供了许多与开发相关的资源和工具。通过在Gutup上搜索可视化图表，可以找到许多可用的集成资源，这些资源可以帮助大家更快地创建各种类型的图表。

*  **部分“设计”可视化图表资源整合：**

![cc98ebc11f5056fffa6b05fc8bd73af0.png][]

可以在 figma 社区搜索中去搜索可视化图表，Figma的社区搜索中，用户可以寻找到与设计相关的各种Charts资源。包括各种类型的可视化图表，如折线图、柱状图、饼图等，适用于各种场景，如数据可视化、报表生成等。

### **四、总结** ###

我们在调研low code工具的过程中，通过快速的构建和定制，能够轻松地搭建出自己想要的内容。为了实现这一目标，我们需要大量的模块组件，并且这些组件的样式也需要多样化。

1.  low code可视化图表具有29种分类和具体的分组，这些分类包括折线图、柱状图、饼图等常见的图表类型，同时也包括一些较为特殊的图表类型，如热力图、树状图等。
2.  我们还需要知道如何寻找合适的资源（前端/设计）来辅助我们设计可视化图表。在low code平台上，我们可以从资源库中查找可视化图表分类组件，也可以通过搜索引擎或社交媒体等途径找到其他类似的资源。

**公众号搜索【神州数码云基地】回复关键词【可视化图表】，获取文中可视化图表资源**

--------------------

***公众号搜索神州数码云基地，了解更多技术干货。***

[format_png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/b0a1f068b51b4835a677d9bf9e8fc856.png
[0a32c5de08a9b17c18cf6c89399d1ee8.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/f0aec882b83149d584d128b11a6b20bf.png
[011ec731ac5d04848f45c40a57f04a16.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/9f2e7280929e4e54a1cf1d4ad2870d61.png
[https_www.figma.com_file_Zj87SKT9PgYBSsfr691knY_Untitled_node-id_0_3A1_t_duOdYHc1BFhXwZqP-1]: https://link.zhihu.com/?target=https%3A//www.figma.com/file/Zj87SKT9PgYBSsfr691knY/Untitled%3Fnode-id%3D0%253A1%26t%3DduOdYHc1BFhXwZqP-1
[format_png 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/d1e9a7d9dc964281b6fc0c78afaa3ea7.png
[ecd9246e12d0c5588ebdb109ccaae67e.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/6965eaaec1b94d0690bff4a6a09ac7e6.png
[https_github.com]: https://link.zhihu.com/?target=https%3A//github.com/
[cc98ebc11f5056fffa6b05fc8bd73af0.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/02/18/d62f0e31338e4553a102bb7066e6ae80.png