VISALL和StandardChart主题机制设计

解决什么问题

架构统一，降低理解和管理的复杂度
通过架构约束，提升程序质量
增加可扩展性和可修改性，降低开发成本，给业务方提供自定义能力
改善visall的职责

终态

VISALL中没有任何主题相关的内容。
VISALL的theme、token、ThemeConfig都应该是透传到SD的:
src/core/api.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
/**
 * 规范设计参考了 Vega-Lite 和 Plot
 *
 * @see https://vega.github.io/vega-lite/docs/spec.html
 * @see https://observablehq.com/plot/getting-started
 */
export interface Specification {
  /** Hook API */
  hook: Partial<Hook>;
  /** 预设 hook */
  presetHook: Partial<Hook>;
  /** 设计 tokens */
  token: Partial<Token>;
  /** 布局 */
  layout: (typeof LAYOUT)[keyof typeof LAYOUT];
  /** 数据集 */
  data: { metadata?: unknown; values: TabularData }[];
  /**
   * 视图配置，分块
   *
   * - 例如主副图视图中，主图为一个块，副图为另一个块
   */
  view: {
    /** 主图 */
    main: NormalViewSpec | StandardChartViewSpec | HXKLineViewSpec;
    /** 副图 */
    secondary?: SimpleKLineViewSpec;
  };
  /** 是否代理（透传StandardChart） */
  proxy: boolean;
  /** StandardChart 主题（旧版，保持兼容） */
  theme?: string;
  /** 新版主题配置 */
  themeConfig?: ThemeConfig;
}

方案评审：CXH的第一版方案

存在的问题

1、机制没抽取和统一，SD和VISALL的主题机制能不能统一
2、主题模块和VISALL的边界没分清楚、UI组件的职责
3、主题没分包，存在冗余资源加载的问题(用户只用到了一个主题，但是需要加载所有的代码；或者业务方只用StandardChart)
4、搬功能，而不是优化机制

建议改进流程

1、微内核
2、看下ECharts的theme的设计、i18n的设计
3、流程跑通，写几个不同的use case场景的代码(应用SD、VISALL、开发主题等等)
4、确认VISALL的hook是否都可以下沉至StandardChart之上的theme模块

机制的职责范围

register、apply、unregister
token定义：设计师定，业务方配置
theme：配置项预处理函数parser数组(函数名字、逻辑、执行顺序可以自己定，约束输入和输出既可)
hook：生命周期，固定的，用户不可修改，由我们定

可以提供一个default theme，即跨业务线通用的那部分主题。

其他问题

公共函数该不该放theme模块中？

比如merge等，这种其实是跨项目通用的，应该单独提个团队级别的npm工具包

StandardChart和VISALL的token如何融合？

取并集
VISALL中有这个自定义的token：

[token:string]: unknown

这个其实是历史遗留问题，一开始设计师想设计一套Token涵盖我们的可视化库和沈佳棋的HexinUI组件库，所以我们设计了这个自定义的token，以兼容HexinUI组件库和其他的非可视化的UI库。实际上这个目前并未用到。

UI组件怎么办？

UI组件应该是和SD同一层级的概念。
layer其实是一个容器的设计，在layer中进行SD和UI组件的组合。