javascript - Was beinhaltet die Front-End-Visualisierung und was ist das Konzept der konfigurierbaren Front-End-Visualisierung?

Question

Ich bin ein Hochschulabsolvent und mache derzeit ein Praktikum in dem Unternehmen, in dem ich gearbeitet habe. Der Abteilungsleiter hat mir eine Aufgabe gegeben und mich gebeten, eine konfigurierbare visuelle Reaktionskomponente zu schreiben Das heißt, ich habe derzeit vor, Three.js als Kern zu verwenden, um eine Reaktionskomponente vom Typ Echarts zu erstellen. In den letzten Tagen war ich jedoch immer noch verwirrt Das Verständnis der Konfigurierbarkeit ist nicht sehr klar.

Answer 1

简单一点说吧，可视化最常见的媒介就是图形图表，无论是基于 canvas（比如 echart）还是 svg（比如 d3）或是 WebGL（比如 Three.js），创建图表最主要的工作就是传递合适的数据和参数。

牵扯到 React，那自然是说要把各种图表类型封装成组件来使用了，而组件都是状态驱动的，也就是说传递的状态变化可以让组件重新渲染，在视觉上的表现就是所谓的“实时更新”。

于是，“可配置”的意思无非就是数据和参数不能写死在组件里，而是能够合理的设计组件让这些东西通过参数传递的方式来渲染这些图表组件。所要打到的效果就是组件内部的实现（图表的组装和渲染过程）是隐藏的，而决定组件具体呈现的数据是可以通过参数传递的，从而达到更高的扩展性、维护性、可读性、可重用性等等。

照这个思路去做就不会有问题了，不过中间要处理的细节会很多，也很考验设计能力（我指的是代码和接口设计），先从最简单的做起吧，比如说绘制一个最基本的 Bar/Column 图，基本的属性，诸如 series data, x/y axis, label, unit, scale, legend 等等都可以通过参数传递，并且当参数变化的时候组件可以自动更新之类的。

Answer 2

需求就只有总监一句话嘛？其它什么文档都没有？