Commit e0700ed13c5b205b51c32de041a99d2a82a58cab

Authored by ww
1 parent 2b611ccb

feat: implement chart component

No preview for this file type
No preview for this file type
... ... @@ -1109,7 +1109,7 @@
1109 1109 // 阀门
1110 1110 this.addValvePalette();
1111 1111 // 图表
1112   - // this.addChartsPalette();
  1112 + this.addChartsPalette();
1113 1113 // 风机
1114 1114 this.addFanPalette();
1115 1115 // 污水处理
... ...
1 1 (function () {
  2 +
  3 + const enumConst = {
  4 +
  5 + /**
  6 + * @description 图表cell 默认宽度
  7 + */
  8 + CHART_CELL_DEFAULT_WIDTH: 400,
  9 +
  10 + /**
  11 + * @description 图表cell 默认高度
  12 + */
  13 + CHART_CELL_DEFAULT_HEIGHT: 400,
  14 +
  15 + /**
  16 + * @description 图表cell的 width attribute
  17 + */
  18 + CHART_CELL_WIDTH: 'width',
  19 +
  20 + /**
  21 + * @description 图表cell的 height attribute
  22 + */
  23 + CHART_CELL_HEIGHT: 'height',
  24 +
  25 + /**
  26 + * @description cell 类型是否为 charts
  27 + */
  28 + IS_CHART_COMP: 'charts',
  29 +
  30 + /**
  31 + * @description cell id key
  32 + */
  33 + CHART_CELL_ID: 'chartInstanceId',
  34 +
  35 + /**
  36 + * @description 图表类型key
  37 + */
  38 + CHART_CELL_TYPE: 'componentsType',
  39 +
  40 + /**
  41 + * @description 图表容器 class name
  42 + */
  43 + CHART_CONTAINER_CLS: 'echarts__instance',
  44 +
  45 + /**
  46 + * @description 图表容器 id 前缀
  47 + */
  48 + CHART_CONTAINER_ID_PREFIX: 'echarts__instance__',
  49 +
  50 + /**
  51 + * @description 图表图片占位符大小
  52 + */
  53 + CHART_IMG_PLACEHOLDER_SIZE: 30,
  54 + }
  55 +
2 56 // Adds Atlassian shapes
3 57 // 图表
4 58 Sidebar.prototype.addChartsPalette = function () {
  59 + const graph = this.graph
  60 + chartsComponentInit(graph)
5 61
6   - const generatorId = () => `echarts__instance__${ Date.now() }`
  62 + const s = 'html=1;shadow=0;dashed=0;shape=mxgraph.atlassian.';
  63 + const s2 = 'html=1;shadow=0;dashed=0;fillColor=none;strokeColor=none;shape=mxgraph.bootstrap.rect;';
  64 + const s3 = mxConstants.STYLE_STROKEWIDTH + '=1;shadow=0;dashed=0;align=center;html=1;' + mxConstants.STYLE_SHAPE + "=mxgraph.mockup.";
  65 + const gn = 'mxgraph.charts';
  66 + const dt = 'charts ';
  67 + const sb = this;
  68 + this.setCurrentSearchEntryLibrary('charts');
  69 +
  70 + const fns = [
  71 + this.addEntry('charts', mxUtils.bind(this, function () {
  72 + const id = generatorChartsId()
  73 + const cell = generatorCell(id, enumConst.CHART_IMG_PLACEHOLDER_SIZE, enumConst.CHART_IMG_PLACEHOLDER_SIZE, graph)
  74 + return this.createVertexTemplateFromCells([ cell ], cell.geometry.width, cell.geometry.height, 'charts');
  75 + })),
  76 + ];
  77 +
  78 + this.addPaletteFunctions('charts', '图表', false, fns);
  79 +
  80 + this.setCurrentSearchEntryLibrary();
  81 + };
  82 +
  83 + /**
  84 + * @description 创建cell
  85 + * @param id
  86 + * @param width
  87 + * @param height
  88 + * @returns {*}
  89 + */
  90 + function generatorCell(id, width, height, graph) {
  91 + const cell = new mxCell(createChartsNode(id, width, height), new mxGeometry(0, 0, width, height), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
  92 + cell.setVertex(true)
  93 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_TYPE, 'charts');
  94 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_ID, id);
  95 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_WIDTH, width)
  96 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_HEIGHT, height)
  97 + return cell
  98 + }
  99 +
  100 + function generatorChartsId() {
  101 + return `${ enumConst.CHART_CONTAINER_ID_PREFIX }${ Date.now() }`
  102 + }
  103 +
  104 +
  105 + function createChartsNode(id, width = 400, height = 400) {
  106 + const chartImg = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAAAlUlEQVRIie2UWwqAIBBFD+0hqR21lVpuffRfC7GPJpAYNe1BQRcGxcc9MyrCrwxZiUtUXGX0FMAAbWxR7IiMhDY+yN4uF1ACPTACtTJuZa7KAbgmm1Gdau4DuOUPgb52dFGAlqFWTTRzDRAq372Pw+Z7QEe4fN+LOgyA9V0nm6QATulzX8U7ALO09kQE1QDTnYBfz2oBmQJYp8UoXcoAAAAASUVORK5CYII='
  107 + return `<div class="echarts__instance" style="width: ${ width }px; height: ${ height }px" id="${ id }"><img src="${ chartImg }" alt=""></div>`
  108 + }
  109 +
  110 + /**
  111 + * @description 折线图配置
  112 + * @returns {{yAxis: {type: string}, xAxis: {data: string[], type: string}, series: [{data: number[], type: string}]}}
  113 + */
  114 + function chartsLineChartsConfig() {
  115 + return {
  116 + xAxis: {
  117 + type: 'category',
  118 + data: [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
  119 + },
  120 + yAxis: {
  121 + type: 'value',
  122 + },
  123 + series: [
  124 + {
  125 + data: [ 150, 230, 224, 218, 135, 147, 260 ],
  126 + type: 'line',
  127 + },
  128 + ],
  129 + }
  130 + }
7 131
  132 + function chartsComponentInit(graph) {
  133 + const chartsInstanceMapping = new Map()
  134 +
  135 + /**
  136 + * @description 拓展添加charts 实例方法
  137 + */
8 138 const addClickHandler = Sidebar.prototype.addClickHandler
9 139 Sidebar.prototype.addClickHandler = function (elt, ds, cells) {
10   - var graph = this.editorUi.editor.graph;
11   - var tol = graph.tolerance;
12 140 const cell = cells[0]
13 141 const cellValue = cell.value
14   - const validate = cellValue && cellValue.nodeName === 'UserObject' && cellValue.getAttribute('componentsType') === 'charts'
15   - const mouseDown = ds.mouseDown
  142 + const validate = cellValue && cellValue.nodeName === 'UserObject' && isChartCell(cell)
16 143
  144 + const mouseDown = ds.mouseDown
17 145 ds.mouseDown = function (evt) {
18 146 if (validate) {
19   - cell.value.setAttribute('id', generatorId())
20   - graph.setAttributeForCell(cell, 'label', `<div class="echarts__instance" id="${ generatorId() }">${ generatorId() }</div>`)
  147 + const id = generatorChartsId()
  148 + const geo = Object.assign(graph.model.getGeometry(cell), { width: 400, height: 400 })
  149 + cell.setGeometry(geo)
  150 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_ID, id);
  151 + graph.setAttributeForCell(cell, 'label', createChartsNode(id))
21 152 }
22 153 mouseDown.apply(this, arguments)
23 154 };
... ... @@ -28,97 +159,116 @@
28 159 mouseUp.apply(this, arguments)
29 160 } finally {
30 161 if (validate) {
31   - const id = cell.value.id
  162 + const id = getCellId(cell)
32 163 const chartDom = document.getElementById(id);
33   - chartDom.style.width = '400px'
34   - chartDom.style.height = '400px'
35 164 const myChart = echarts.init(chartDom);
36   - const option = {
37   - xAxis: {
38   - type: 'category',
39   - data: [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
40   - },
41   - yAxis: {
42   - type: 'value',
43   - },
44   - series: [
45   - {
46   - data: [ 150, 230, 224, 218, 135, 147, 260 ],
47   - type: 'line',
48   - },
49   - ],
50   - };
51   -
  165 + const option = chartsLineChartsConfig()
52 166 option && myChart.setOption(option);
  167 + chartsInstanceMapping.set(id, myChart)
53 168 }
54 169 }
55   - // const dom = document.getElementById()
56 170 }
57 171 addClickHandler.apply(this, arguments)
58 172 }
59 173
60   - const convertValueToString = this.graph.convertValueToString
61   - this.graph.convertValueToString = function (cell) {
62   - const cellValue = cell.value
63   - const validate = cellValue && cellValue.nodeName === 'UserObject' && cellValue.getAttribute('componentsType') === 'charts'
64   - if (validate) {
65   - setTimeout(() => {
66   - const id = cell.value.id
67   - console.log(id)
68   - const chartDom = document.getElementById(id);
69   - chartDom.style.width = '400px'
70   - chartDom.style.height = '400px'
71   - const myChart = echarts.init(chartDom);
72   - const option = {
73   - xAxis: {
74   - type: 'category',
75   - data: [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
76   - },
77   - yAxis: {
78   - type: 'value',
79   - },
80   - series: [
81   - {
82   - data: [ 150, 230, 224, 218, 135, 147, 260 ],
83   - type: 'line',
84   - },
85   - ],
86   - };
87   -
88   - option && myChart.setOption(option);
89   - })
90   - }
  174 + /**
  175 + * @description charts cell发生resize时改变charts size
  176 + * @type {mxGraph.cellResized}
  177 + */
  178 + const cellResized = mxGraph.prototype.cellResized
  179 + mxGraph.prototype.cellResized = function (cell, rect) {
  180 + const { width, height } = rect
  181 + const id = getCellId(cell)
  182 + const chartDom = document.getElementById(id)
  183 + chartDom.style.width = `${ width }px`
  184 + chartDom.style.height = `${ height }px`
  185 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_WIDTH, width)
  186 + graph.setAttributeForCell(cell, enumConst.CHART_CELL_HEIGHT, height)
  187 + const instance = chartsInstanceMapping.get(id)
  188 + instance.resize()
  189 + cellResized.apply(this, arguments)
  190 + }
91 191
92   - return convertValueToString.apply(this, arguments)
  192 + /**
  193 + * @description 删除charts cell 时 删除保存的charts 实例
  194 + */
  195 + const deleteCells = Graph.prototype.deleteCells
  196 + Graph.prototype.deleteCells = function (cell) {
  197 + const id = getCellId(cell)
  198 + chartsInstanceMapping.delete(id)
  199 + return deleteCells.apply(this, arguments)
93 200 }
94 201
95   - var s = 'html=1;shadow=0;dashed=0;shape=mxgraph.atlassian.';
96   - var s2 = 'html=1;shadow=0;dashed=0;fillColor=none;strokeColor=none;shape=mxgraph.bootstrap.rect;';
97   - var s3 = mxConstants.STYLE_STROKEWIDTH + '=1;shadow=0;dashed=0;align=center;html=1;' + mxConstants.STYLE_SHAPE + "=mxgraph.mockup.";
98   - var gn = 'mxgraph.charts';
99   - var dt = 'charts ';
100   - var sb = this;
101   - this.setCurrentSearchEntryLibrary('charts');
  202 + /**
  203 + * @description 获取charts cell 的id
  204 + * @param cell
  205 + * @returns {*}
  206 + */
  207 + function getCellId(cell) {
  208 + return graph.getAttributeForCell(cell, enumConst.CHART_CELL_ID)
  209 + }
102 210
103   - const now = Date.now
104   - var fns = [
105   - this.addEntry('charts', mxUtils.bind(this, function () {
106   - const id = generatorId()
107   - var cell = new mxCell(`<div id="${ id }" class="echarts__instance"></div>`, new mxGeometry(0, 0, 400, 400), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
108   - cell.setVertex(true)
109   - this.graph.setAttributeForCell(cell, 'placeholders', '1');
110   - this.graph.setAttributeForCell(cell, 'componentsType', 'charts');
111   - cell.value.setAttribute('id', id)
112   - return this.createVertexTemplateFromCells([ cell ], cell.geometry.width, cell.geometry.height, 'charts');
113   - })),
114   - ];
  211 + function generatorEChartInstance(id, width, height) {
  212 + const chartDom = document.getElementById(id);
  213 + chartDom.style.width = `${ width }px`
  214 + chartDom.style.height = `${ height }px`
  215 + const myChart = echarts.init(chartDom);
  216 + const option = chartsLineChartsConfig()
  217 + option && myChart.setOption(option);
  218 + chartsInstanceMapping.set(id, myChart)
  219 + }
115 220
116   - this.addPaletteFunctions('charts', '图表', false, fns);
  221 + // 初始化图表
  222 + const openFileHandle = EditorUi.prototype.openFileHandle
  223 + EditorUi.prototype.openFileHandle = function () {
  224 + try {
  225 + openFileHandle.apply(this, arguments)
  226 + } finally {
  227 + const allCell = this.editor.graph.getDefaultParent().children
  228 + const domIdMapping = new Map()
  229 + for (const cell of allCell) {
  230 + const chartInstanceId = graph.getAttributeForCell(cell, enumConst.CHART_CELL_ID)
  231 + if (isChartCell(cell) && chartInstanceId) {
  232 + const width = graph.getAttributeForCell(cell, enumConst.CHART_CELL_WIDTH)
  233 + const height = graph.getAttributeForCell(cell, enumConst.CHART_CELL_HEIGHT)
  234 + domIdMapping.set(chartInstanceId, { width, height })
  235 + }
  236 + }
  237 + const chartsDomList = document.querySelectorAll(`.${ enumConst.CHART_CONTAINER_CLS }`)
  238 + for (const chartDom of chartsDomList) {
  239 + const id = chartDom.getAttribute('id')
  240 + const { width, height } = domIdMapping.get(id)
  241 + generatorEChartInstance(id, width, height)
  242 + }
  243 + }
  244 + }
117 245
118   - this.setCurrentSearchEntryLibrary();
119   - };
120   -})();
  246 + /**
  247 + * @description 是否是图表cell
  248 + * @param cell
  249 + * @returns {boolean}
  250 + */
  251 + function isChartCell(cell) {
  252 + const componentsType = graph.getAttributeForCell(cell, enumConst.CHART_CELL_TYPE)
  253 + return !!(componentsType && componentsType === enumConst.IS_CHART_COMP)
  254 + }
121 255
122   -function testChartImg() {
123   - return 'data:image/png;base64,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'
124   -}
\ No newline at end of file
  256 + const createTooltip = Sidebar.prototype.createTooltip
  257 + Sidebar.prototype.createTooltip = function (elt, cells) {
  258 + const id = generatorChartsId()
  259 + const validateFlag = isChartCell(cells[0])
  260 + try {
  261 + if (validateFlag) {
  262 + const cell = generatorCell(id, enumConst.CHART_CELL_DEFAULT_WIDTH, enumConst.CHART_CELL_DEFAULT_HEIGHT, graph)
  263 + const _arguments = Array.prototype.slice.call(arguments, 0)
  264 + _arguments.splice(1, 1, [ cell ])
  265 + createTooltip.apply(this, _arguments)
  266 + } else {
  267 + createTooltip.apply(this, arguments)
  268 + }
  269 + } finally {
  270 + if (validateFlag) generatorEChartInstance(id, enumConst.CHART_CELL_DEFAULT_WIDTH, enumConst.CHART_CELL_DEFAULT_HEIGHT)
  271 + }
  272 + }
  273 + }
  274 +})();
... ...