Skip to content

Commit 0f05687

Browse files
Jason-chen-coderJason-chen-coder
committed
'优化mxgraph导入方式'
1 parent 59c9bc5 commit 0f05687

6 files changed

Lines changed: 373 additions & 202 deletions

File tree

‎src/graph/index.js‎

Lines changed: 66 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,66 @@
1-
import mx from 'mxgraph'
2-
const mxgraph = mx({})
3-
// decode bug https://github.com/jgraph/mxgraph/issues/49
4-
window.mxGraph = mxgraph.mxGraph
5-
window.mxGraphModel = mxgraph.mxGraphModel
6-
window.mxEditor = mxgraph.mxEditor
7-
window.mxGeometry = mxgraph.mxGeometry
8-
window.mxDefaultKeyHandler = mxgraph.mxDefaultKeyHandler
9-
window.mxDefaultPopupMenu = mxgraph.mxDefaultPopupMenu
10-
window.mxStylesheet = mxgraph.mxStylesheet
11-
window.mxDefaultToolbar = mxgraph.mxDefaultToolbar
12-
export default mxgraph
1+
/*
2+
* @Descripttion:
3+
* @version:
4+
* @Author: Jason chen
5+
* @Date: 2020-07-09 17:04:43
6+
* @LastEditors: Jason chen
7+
* @LastEditTime: 2021-08-31 11:14:26
8+
*/
9+
const mx = require('mxgraph')
10+
11+
const mxgraph = mx({
12+
// 核心中所有图像url的Basepath，不带斜杠。在mxClient.imageBasePath中指定路径.
13+
mxImageBasePath: 'mxgraph/images',
14+
// 核心中的所有url的Basepath，不带斜杠。在mxClient.basePath中指定路径。
15+
// 指向的路径一定要是一个可以通过 url 访问的静态资源目录
16+
mxBasePath: 'mxgraph',
17+
// 可选的全局配置变量。切换加载mxGraph和mxEditor中的两个资源文件。
18+
// 默认值是true。在主线程警告上禁用同步XMLHttpRequest
19+
mxLoadResources: true
20+
// 指定是否应加载任何样式表。 默认值是true。
21+
// mxLoadStylesheets: false,
22+
// 可选的全局配置变量，在开发模式下强制加载JavaScript文件。
23+
// mxForceIncludes: true,
24+
// 可选的全局配置变量来指定资源文件的扩展名。
25+
// mxResourceExtension: '.txt'
26+
})
27+
28+
const MxCell = mxgraph.mxCell
29+
const MxConstants = mxgraph.mxConstants
30+
const MxEvent = mxgraph.mxEvent
31+
const MxGraph = mxgraph.mxGraph
32+
33+
const MxRubberBand = mxgraph.mxRubberband
34+
35+
const MxUtils = mxgraph.mxUtils
36+
const MxCodec = mxgraph.mxCodec
37+
const MxGeometry = mxgraph.mxGeometry
38+
const MxEditor = mxgraph.mxEditor
39+
const MxGraphHandler = mxgraph.mxGraphHandler
40+
const MxRectangleShape = mxgraph.mxRectangleShape
41+
const MxCellTracker = mxgraph.mxCellTracker
42+
const MxClient = mxgraph.mxClient
43+
const MxPerimeter = mxgraph.mxPerimeter
44+
const MxEventObject = mxgraph.mxEventObject
45+
const ActiveXObject = mxgraph.activeXObject
46+
47+
48+
MxRubberBand.prototype.defaultOpacity = 30
49+
50+
export {
51+
MxEvent,
52+
MxGraph,
53+
MxEditor,
54+
MxUtils,
55+
MxGraphHandler,
56+
MxConstants,
57+
MxCodec,
58+
MxRectangleShape,
59+
MxCellTracker,
60+
MxClient,
61+
MxPerimeter,
62+
MxEventObject,
63+
MxGeometry,
64+
MxCell,
65+
ActiveXObject
66+
}

‎src/views/customToolbar/GroupToolbarItems.js‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import mxgraph from '../../graph/index';
1+
import { MxConstants } from '../../graph/index';
22

3-
const { mxConstants } = mxgraph;
3+
// const { MxConstants } = mxgraph;
44
export const grouptoolItems = [
55
{
66
title: '分组1',
@@ -16,8 +16,8 @@ export const grouptoolItems = [
1616
fillColor: '#409eff',
1717
strokeColor: '#629EA0',
1818
fontColor: '#000000',
19-
verticalAlign: mxConstants.ALIGN_TOP,
20-
align: mxConstants.ALIGN_CENTER,
19+
verticalAlign: MxConstants.ALIGN_TOP,
20+
align: MxConstants.ALIGN_CENTER,
2121
},
2222
created (graph, cell, index) {
2323
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -48,8 +48,8 @@ export const grouptoolItems = [
4848
fillColor: '#409eff',
4949
strokeColor: '#629EA0',
5050
fontColor: '#000000',
51-
verticalAlign: mxConstants.ALIGN_TOP,
52-
align: mxConstants.ALIGN_CENTER,
51+
verticalAlign: MxConstants.ALIGN_TOP,
52+
align: MxConstants.ALIGN_CENTER,
5353
},
5454
created (graph, cell, index) {
5555
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -80,8 +80,8 @@ export const grouptoolItems = [
8080
fillColor: '#409eff',
8181
strokeColor: '#629EA0',
8282
fontColor: '#000000',
83-
verticalAlign: mxConstants.ALIGN_TOP,
84-
align: mxConstants.ALIGN_CENTER,
83+
verticalAlign: MxConstants.ALIGN_TOP,
84+
align: MxConstants.ALIGN_CENTER,
8585
},
8686
created (graph, cell, index) {
8787
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -112,8 +112,8 @@ export const grouptoolItems = [
112112
fillColor: '#409eff',
113113
strokeColor: '#629EA0',
114114
fontColor: '#000000',
115-
verticalAlign: mxConstants.ALIGN_TOP,
116-
align: mxConstants.ALIGN_CENTER,
115+
verticalAlign: MxConstants.ALIGN_TOP,
116+
align: MxConstants.ALIGN_CENTER,
117117
},
118118
created (graph, cell, index) {
119119
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -144,8 +144,8 @@ export const grouptoolItems = [
144144
fillColor: '#409eff',
145145
strokeColor: '#629EA0',
146146
fontColor: '#000000',
147-
verticalAlign: mxConstants.ALIGN_TOP,
148-
align: mxConstants.ALIGN_CENTER,
147+
verticalAlign: MxConstants.ALIGN_TOP,
148+
align: MxConstants.ALIGN_CENTER,
149149
},
150150
created (graph, cell, index) {
151151
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -176,8 +176,8 @@ export const grouptoolItems = [
176176
fillColor: '#409eff',
177177
strokeColor: '#629EA0',
178178
fontColor: '#000000',
179-
verticalAlign: mxConstants.ALIGN_TOP,
180-
align: mxConstants.ALIGN_CENTER,
179+
verticalAlign: MxConstants.ALIGN_TOP,
180+
align: MxConstants.ALIGN_CENTER,
181181
},
182182
created (graph, cell, index) {
183183
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);
@@ -208,8 +208,8 @@ export const grouptoolItems = [
208208
fillColor: '#409eff',
209209
strokeColor: '#629EA0',
210210
fontColor: '#000000',
211-
verticalAlign: mxConstants.ALIGN_TOP,
212-
align: mxConstants.ALIGN_CENTER,
211+
verticalAlign: MxConstants.ALIGN_TOP,
212+
align: MxConstants.ALIGN_CENTER,
213213
},
214214
created (graph, cell, index) {
215215
const deleteIconDom = document.querySelector(`.deleteIcon_${index}`);

‎src/views/customToolbar/general-shape.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import mxgraph from "../../graph/index";
2-
const { mxConstants } = mxgraph;
1+
import { MxConstants } from "../../graph/index";
2+
// const { MxConstants } = mxgraph;
33
export const generalToolbarItems = [
44
{
55
index: 0,
@@ -151,8 +151,8 @@ export const generalToolbarItems = [
151151
strokeWidth: '1',
152152
html: 1,
153153
fillColor: '#FFFFFF',
154-
verticalAlign: mxConstants.ALIGN_MIDDLE,
155-
align: mxConstants.ALIGN_CENTER,
154+
verticalAlign: MxConstants.ALIGN_MIDDLE,
155+
align: MxConstants.ALIGN_CENTER,
156156
whiteSpace: 'wrap',
157157
rounded: 0,
158158
}

0 commit comments

Comments
 (0)