| 1 | {"version":3,"file":"facet.js","sourceRoot":"","sources":["../../src/facet/facet.ts"],"names":[],"mappings":"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","sourcesContent":["import { deepMix, each, every, get, isNil, isNumber } from '@antv/util';\nimport { LAYER } from '../constant';\nimport { IGroup } from '../dependents';\nimport { AxisCfg, Condition, Datum, FacetCfg, FacetData, FacetDataFilter, Region } from '../interface';\n\nimport View from '../chart/view';\nimport { getAxisOption } from '../util/axis';\n\n/**\n * facet 基类\n * - 定义生命周期，方便自定义 facet\n * - 提供基础的生命流程方法\n *\n * 生命周期：\n *\n * 初始化 init\n * 1. 初始化容器\n * 2. 数据分面，生成分面布局信息\n *\n * 渲染阶段 render\n * 1. view 创建\n * 2. title\n * 3. axis\n *\n * 清除阶段 clear\n * 1. 清除 view\n *\n * 销毁阶段 destroy\n * 1. clear\n * 2. 清除事件\n * 3. 清除 group\n */\nexport abstract class Facet<C extends FacetCfg<FacetData> = FacetCfg<FacetData>, F extends FacetData = FacetData> {\n /** 分面所在的 view */\n public view: View;\n /** 分面容器 */\n public container: IGroup;\n /** 是否销毁 */\n public destroyed: boolean = false;\n\n /** 分面的配置项 */\n protected cfg: C;\n /** 分面之后的所有分面数据结构 */\n protected facets: F[] = [];\n\n constructor(view: View, cfg: C) {\n this.view = view;\n this.cfg = deepMix({}, this.getDefaultCfg(), cfg);\n }\n\n /**\n * 初始化过程\n */\n public init() {\n // 初始化容器\n if (!this.container) {\n this.container = this.createContainer();\n }\n\n // 生成分面布局信息\n const data = this.view.getData();\n this.facets = this.generateFacets(data);\n }\n\n /**\n * 渲染分面，由上层 view 调用。包括：\n * - 分面 view\n * - 轴\n * - title\n *\n * 子类可以复写，添加一些其他组件，比如滚动条等\n */\n public render() {\n this.renderViews();\n }\n\n /**\n * 更新 facet\n */\n public update() {\n // 其实不用做任何事情，因为 facet 最终生成的 View 和 Geometry 都在父 view 的更新中处理了\n }\n\n /**\n * 清空，clear 之后如果还需要使用，需要重新调用 init 初始化过程\n * 一般在数据有变更的时候调用，重新进行数据的分面逻辑\n */\n public clear() {\n this.clearFacetViews();\n }\n\n /**\n * 销毁\n */\n public destroy() {\n this.clear();\n\n if (this.container) {\n this.container.remove(true);\n this.container = undefined;\n }\n\n this.destroyed = true;\n this.view = undefined;\n this.facets = [];\n }\n\n /**\n * 根据 facet 生成 view，可以给上层自定义使用\n * @param facet\n */\n protected facetToView(facet: F): View {\n const { region, data, padding = this.cfg.padding } = facet;\n\n const view = this.view.createView({\n region,\n padding,\n });\n\n // 设置分面的数据\n view.data(data || []);\n facet.view = view;\n\n // 前置钩子\n this.beforeEachView(view, facet);\n\n const { eachView } = this.cfg;\n if (eachView) {\n eachView(view, facet);\n }\n\n // 后置钩子\n this.afterEachView(view, facet);\n\n return view;\n }\n\n // 创建容器\n private createContainer(): IGroup {\n const foregroundGroup = this.view.getLayer(LAYER.FORE);\n return foregroundGroup.addGroup();\n }\n\n /**\n * 初始化 view\n */\n private renderViews() {\n this.createFacetViews();\n }\n\n /**\n * 创建 分面 view\n */\n private createFacetViews(): View[] {\n // 使用分面数据 创建分面 view\n return this.facets.map((facet): View => {\n return this.facetToView(facet);\n });\n }\n\n /**\n * 从 view 中清除 facetView\n */\n private clearFacetViews() {\n // 从 view 中移除分面 view\n each(this.facets, (facet) => {\n if (facet.view) {\n this.view.removeView(facet.view);\n facet.view = undefined;\n }\n });\n }\n\n /**\n * 解析 spacing\n */\n private parseSpacing() {\n /**\n * @example\n *\n * // 仅使用百分比或像素值\n * // 横向间隔为 10%，纵向间隔为 10%\n * ['10%', '10%']\n * // 横向间隔为 10px，纵向间隔为 10px\n * [10, 10]\n *\n * // 同时使用百分比和像素值\n * ['10%', 10]\n * // 横向间隔为 10%，纵向间隔为 10px\n */\n const { width, height } = this.view.viewBBox;\n const { spacing } = this.cfg;\n return spacing.map((s: number, idx: number) => {\n if (isNumber(s)) return s / (idx === 0 ? width : height);\n else return parseFloat(s) / 100;\n });\n }\n\n // 其他一些提供给子类使用的方法\n\n /**\n * 获取这个字段对应的所有值，数组\n * @protected\n * @param data 数据\n * @param field 字段名\n * @return 字段对应的值\n */\n protected getFieldValues(data: Datum[], field: string): string[] {\n const rst = [];\n const cache: Record<string, boolean> = {};\n\n // 去重、去除 Nil 值\n each(data, (d: Datum) => {\n const value = d[field];\n if (!isNil(value) && !cache[value]) {\n rst.push(value);\n cache[value] = true;\n }\n });\n\n return rst;\n }\n\n /**\n * 获得每个分面的 region，平分区域\n * @param rows row 总数\n * @param cols col 总数\n * @param xIndex x 方向 index\n * @param yIndex y 方向 index\n */\n protected getRegion(rows: number, cols: number, xIndex: number, yIndex: number): Region {\n const [xSpacing, ySpacing] = this.parseSpacing();\n // 每两个分面区域横向间隔xSPacing, 纵向间隔ySpacing\n // 每个分面区域的横纵占比\n /**\n * ratio * num + spacing * (num - 1) = 1\n * => ratio = (1 - (spacing * (num - 1))) / num\n * = (1 + spacing) / num - spacing\n *\n * num 对应 cols/rows\n * spacing 对应 xSpacing/ySpacing\n */\n const xRatio = (1 + xSpacing) / (cols === 0 ? 1 : cols) - xSpacing;\n const yRatio = (1 + ySpacing) / (rows === 0 ? 1 : rows) - ySpacing;\n\n // 得到第 index 个分面区域百分比位置\n const start = {\n x: (xRatio + xSpacing) * xIndex,\n y: (yRatio + ySpacing) * yIndex,\n };\n const end = {\n x: start.x + xRatio,\n y: start.y + yRatio,\n };\n return { start, end };\n }\n\n protected getDefaultCfg() {\n return {\n eachView: undefined,\n showTitle: true,\n spacing: [0, 0],\n padding: 10,\n fields: [],\n };\n }\n\n /**\n * 默认的 title 样式，因为有的分面是 title，有的分面配置是 columnTitle、rowTitle\n */\n protected getDefaultTitleCfg() {\n // @ts-ignore\n const fontFamily = this.view.getTheme().fontFamily;\n return {\n style: {\n fontSize: 14,\n fill: '#666',\n fontFamily,\n },\n };\n }\n\n /**\n * 处理 axis 的默认配置\n * @param view\n * @param facet\n */\n protected processAxis(view: View, facet: F) {\n const options = view.getOptions();\n\n const coordinateOption = options.coordinate;\n const geometries = view.geometries;\n\n const coordinateType = get(coordinateOption, 'type', 'rect');\n\n if (coordinateType === 'rect' && geometries.length) {\n if (isNil(options.axes)) {\n // @ts-ignore\n options.axes = {};\n }\n const axes = options.axes;\n\n const [x, y] = geometries[0].getXYFields();\n\n const xOption = getAxisOption(axes, x);\n const yOption = getAxisOption(axes, y);\n\n if (xOption !== false) {\n options.axes[x] = this.getXAxisOption(x, axes, xOption, facet);\n }\n\n if (yOption !== false) {\n options.axes[y] = this.getYAxisOption(y, axes, yOption, facet);\n }\n }\n }\n\n /**\n * 获取分面数据\n * @param conditions\n */\n protected getFacetDataFilter(conditions: Condition[]): FacetDataFilter {\n return (datum: Datum) => {\n // 过滤出全部满足条件的数据\n return every(conditions, (condition) => {\n const { field, value } = condition;\n\n if (!isNil(value) && field) {\n return datum[field] === value;\n }\n return true;\n });\n };\n }\n\n /**\n * @override 开始处理 eachView\n * @param view\n * @param facet\n */\n protected abstract beforeEachView(view: View, facet: F);\n\n /**\n * @override 处理 eachView 之后\n * @param view\n * @param facet\n */\n protected abstract afterEachView(view: View, facet: F);\n\n /**\n * @override 生成分面数据，包含布局\n * @param data\n */\n protected abstract generateFacets(data: Datum[]): F[];\n\n /**\n * 获取 x 轴的配置\n * @param x\n * @param axes\n * @param option\n * @param facet\n */\n protected abstract getXAxisOption(x: string, axes: any, option: AxisCfg, facet: F): object;\n\n /**\n * 获取 y 轴的配置\n * @param y\n * @param axes\n * @param option\n * @param facet\n */\n protected abstract getYAxisOption(y: string, axes: any, option: AxisCfg, facet: F): object;\n}\n"]} |