Sidebar-Charts.js
8.23 KB
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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
(function () {
// Adds Atlassian shapes
// 图表
Sidebar.prototype.addChartsPalette = function () {
const generatorId = () => `echarts__instance__${ Date.now() }`
const addClickHandler = Sidebar.prototype.addClickHandler
Sidebar.prototype.addClickHandler = function (elt, ds, cells) {
var graph = this.editorUi.editor.graph;
var tol = graph.tolerance;
const cell = cells[0]
const cellValue = cell.value
const validate = cellValue && cellValue.nodeName === 'UserObject' && cellValue.getAttribute('componentsType') === 'charts'
const mouseDown = ds.mouseDown
ds.mouseDown = function (evt) {
if (validate) {
cell.value.setAttribute('id', generatorId())
graph.setAttributeForCell(cell, 'label', `<div class="echarts__instance" id="${ generatorId() }">${ generatorId() }</div>`)
}
mouseDown.apply(this, arguments)
};
const mouseUp = ds.mouseUp
ds.mouseUp = function () {
try {
mouseUp.apply(this, arguments)
} finally {
if (validate) {
const id = cell.value.id
const chartDom = document.getElementById(id);
chartDom.style.width = '400px'
chartDom.style.height = '400px'
const myChart = echarts.init(chartDom);
const option = {
xAxis: {
type: 'category',
data: [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
},
yAxis: {
type: 'value',
},
series: [
{
data: [ 150, 230, 224, 218, 135, 147, 260 ],
type: 'line',
},
],
};
option && myChart.setOption(option);
}
}
// const dom = document.getElementById()
}
addClickHandler.apply(this, arguments)
}
const convertValueToString = this.graph.convertValueToString
this.graph.convertValueToString = function (cell) {
const cellValue = cell.value
const validate = cellValue && cellValue.nodeName === 'UserObject' && cellValue.getAttribute('componentsType') === 'charts'
if (validate) {
setTimeout(() => {
const id = cell.value.id
console.log(id)
const chartDom = document.getElementById(id);
chartDom.style.width = '400px'
chartDom.style.height = '400px'
const myChart = echarts.init(chartDom);
const option = {
xAxis: {
type: 'category',
data: [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
},
yAxis: {
type: 'value',
},
series: [
{
data: [ 150, 230, 224, 218, 135, 147, 260 ],
type: 'line',
},
],
};
option && myChart.setOption(option);
})
}
return convertValueToString.apply(this, arguments)
}
var s = 'html=1;shadow=0;dashed=0;shape=mxgraph.atlassian.';
var s2 = 'html=1;shadow=0;dashed=0;fillColor=none;strokeColor=none;shape=mxgraph.bootstrap.rect;';
var s3 = mxConstants.STYLE_STROKEWIDTH + '=1;shadow=0;dashed=0;align=center;html=1;' + mxConstants.STYLE_SHAPE + "=mxgraph.mockup.";
var gn = 'mxgraph.charts';
var dt = 'charts ';
var sb = this;
this.setCurrentSearchEntryLibrary('charts');
const now = Date.now
var fns = [
this.addEntry('charts', mxUtils.bind(this, function () {
const id = generatorId()
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;');
cell.setVertex(true)
this.graph.setAttributeForCell(cell, 'placeholders', '1');
this.graph.setAttributeForCell(cell, 'componentsType', 'charts');
cell.value.setAttribute('id', id)
return this.createVertexTemplateFromCells([ cell ], cell.geometry.width, cell.geometry.height, 'charts');
})),
];
this.addPaletteFunctions('charts', '图表', false, fns);
this.setCurrentSearchEntryLibrary();
};
})();
function testChartImg() {
return 'data:image/png;base64,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'
}