docs: improve the migration guide from mxGraph (#271)
Provide various improvements - fix `InternalEvent` - improve `Client` - improve explanations about plugins - removed `mxUtils` methods - removed `isVisible` methods Also use more admonitions.development
Thomas Bouffard
GitHub
parent
17f31fcc5c
commit
d46e99a114
|
|
@ -7,8 +7,9 @@ on:
|
|||
paths:
|
||||
- '.github/workflows/generate-website.yml'
|
||||
- '.nvmrc'
|
||||
- 'packages/core/*'
|
||||
- 'packages/website/*'
|
||||
- 'packages/core/**/*'
|
||||
- 'packages/website/**/*'
|
||||
- '!packages/website/README.md'
|
||||
- 'package.json'
|
||||
|
||||
jobs:
|
||||
|
|
|
|||
|
|
@ -41,7 +41,12 @@ npm uninstall mxgraph
|
|||
```shell
|
||||
npm install maxgraph@core
|
||||
```
|
||||
ℹ️ The `maxgraph@core` package contains the core functionality of `maxGraph`.
|
||||
|
||||
:::info
|
||||
|
||||
The `maxgraph@core` package contains the core functionality of `maxGraph`.
|
||||
|
||||
:::
|
||||
|
||||
### Initialize `maxGraph`
|
||||
|
||||
|
|
@ -107,7 +112,11 @@ Here are some general guidelines to keep in mind when migrating from `mxGraph` t
|
|||
This section outlines specific code changes required when migrating from `mxGraph` to `maxGraph`.
|
||||
Please update your code accordingly.
|
||||
|
||||
> **Note:** Much information is available at https://github.com/maxGraph/maxGraph/pull/70.
|
||||
:::note
|
||||
|
||||
A wide range of information is available at https://github.com/maxGraph/maxGraph/pull/70.
|
||||
|
||||
:::
|
||||
|
||||
### Overlay
|
||||
The `strokewidth` property has been renamed to `strokeWidth` in `maxGraph`.
|
||||
|
|
@ -144,6 +153,14 @@ Several functions in `mxUtils` have been moved to their own namespaces in `maxGr
|
|||
- `getXml`(): Update your code to use `xmlUtils.getXml()` instead of `mxUtils.getXml()`.
|
||||
- `createXmlDocument()`: Update your code to use `xmlUtils.createXmlDocument()` instead of `mxUtils.createXmlDocument()`.
|
||||
|
||||
|
||||
### Removed methods from `mxUtils`
|
||||
|
||||
The following methods of `mxUtils` have been removed without replacements in `maxGraph`. Use your own implementation or 3rd party libraries instead:
|
||||
- `mxUtils.button`
|
||||
- `mxUtils.error`
|
||||
|
||||
|
||||
### `mxAbstractCanvas2D`
|
||||
|
||||
The `mxAbstractCanvas2D` class has been renamed to `AbstractCanvas2D` in `maxGraph`, and there is a parameter type change in one of its methods.
|
||||
|
|
@ -186,7 +203,7 @@ const canvas = new SvgCanvas2D(svgElement, oneBoolean);
|
|||
|
||||
#### `getAlternateText()`
|
||||
|
||||
change types ???????
|
||||
**TODO** change types ???????
|
||||
|
||||
#### `format()`
|
||||
|
||||
|
|
@ -208,6 +225,9 @@ format:(value: number) => number
|
|||
The `mxGraph` class has been renamed to `Graph` in `maxGraph`.
|
||||
There have also been some changes related to properties and methods.
|
||||
|
||||
Some properties have been removed in favor of the usage of plugins. Plugins are registered at the Graph initialization by passing
|
||||
an array of plugins to the constructor.
|
||||
|
||||
#### `panningHandler` property
|
||||
|
||||
The `panningHandler` property has been removed and replaced by a plugin. Instead of accessing `panningHandler` directly, you can use the `getPlugin()` method to get the `PanningHandler` plugin instance. Here's an example:
|
||||
|
|
@ -269,7 +289,25 @@ graph.insertEdge({ parent, id, value, source, target, style });
|
|||
|
||||
|
||||
### Client
|
||||
renamed properties: TODO which
|
||||
|
||||
The `mxClient` class has been removed into `Client`.
|
||||
|
||||
Removed properties
|
||||
- `defaultBundles`
|
||||
- `mxForceIncludes`: it was used to force loading the JavaScript files in development mode in mxGraph. We are not
|
||||
managing development mode in that way anymore.
|
||||
- `mxLoadResources`: not used anymore
|
||||
- `mxLoadStylesheets`: not used anymore
|
||||
- `mxResourceExtension`: it was only used in `Translations`, so only keep the property in `Translations`
|
||||
|
||||
Removed methods
|
||||
- `setForceIncludes`: the `mxForceIncludes` property has been removed
|
||||
- `setLoadResources`: the `mxLoadResources` property has been removed
|
||||
- `setLoadStylesheets`: the `mxLoadStylesheets` property has been removed
|
||||
- `setResourceExtension`: the `mxResourceExtension` property has been removed
|
||||
|
||||
Moved methods
|
||||
- `link` method moved and renamed `domUtils.addLinkToHead`
|
||||
|
||||
|
||||
### Cell manipulation
|
||||
|
|
@ -278,13 +316,25 @@ Only the functions for mxCell/Cell remain. See https://github.com/maxGraph/maxGr
|
|||
|
||||
|
||||
Some functions previously available in `mxGraph` and `mxGraphModel` have been removed. These functions allowed for customizing the behavior of `mxGraphModel` and `mxCell`. However, now only the functions specific to `mxCell`/`Cell` remain.
|
||||
ℹ️ You can find more information about these changes in the following GitHub pull request: https://github.com/maxGraph/maxGraph/pull/24.
|
||||
|
||||
:::note
|
||||
|
||||
You can find more information about these changes in the following GitHub pull request: https://github.com/maxGraph/maxGraph/pull/24.
|
||||
|
||||
:::
|
||||
|
||||
#### `mxCell`
|
||||
|
||||
The `mxCell` class has been renamed to `Cell` for simplicity.
|
||||
|
||||
The `style` property of `Cell` has undergone a type change from `string` to `CellStyle`.
|
||||
The `style` property of `Cell` has undergone a type change from `string` to `CellStyle`. See the paragraph about "Migration of specific style properties applied to dedicated cells"
|
||||
for more details about how to migrate the style property.
|
||||
|
||||
|
||||
#### `mxGraph`
|
||||
|
||||
Some methods were removed:
|
||||
- `mxGraph.isCellVisible(cell)` see https://github.com/maxGraph/maxGraph/discussions/179#discussioncomment-5389942 for rationale
|
||||
|
||||
|
||||
#### `mxGraphDataModel`
|
||||
|
|
@ -296,6 +346,8 @@ Several functions from the `mxGraphDataModel` class have been moved to the `Cell
|
|||
- `isEdge()`
|
||||
- `getParent()`
|
||||
|
||||
Others were removed:
|
||||
- `mxGraphModel.isVisible(cell)` see https://github.com/maxGraph/maxGraph/discussions/179#discussioncomment-5389942 for rationale
|
||||
|
||||
### Misc
|
||||
|
||||
|
|
@ -315,10 +367,10 @@ The event handling mechanism in `maxGraph` has been updated. Use the following g
|
|||
- Use the `eventUtils.isLeftMouseButton()` method, to detect mouse events, instead of `mxEvent.isLeftMouseButton()`.
|
||||
|
||||
#### `InternalEvent`
|
||||
- Use the `eventUtils.PAN_START` property instead of `mxEvent.PAN_START`.
|
||||
- Use the `eventUtils.PAN_END` property instead of `mxEvent.PAN_END`.
|
||||
- Use the `eventUtils.addMouseWheelListener()` method instead of `mxEvent.addMouseWheelListener()`.
|
||||
- Use the `eventUtils.consume()` method instead of `mxEvent.consume()`.
|
||||
- Use the `InternalEvent.PAN_START` property instead of `mxEvent.PAN_START`.
|
||||
- Use the `InternalEvent.PAN_END` property instead of `mxEvent.PAN_END`.
|
||||
- Use the `InternalEvent.addMouseWheelListener()` method instead of `mxEvent.addMouseWheelListener()`.
|
||||
- Use the `InternalEvent.consume()` method instead of `mxEvent.consume()`.
|
||||
|
||||
|
||||
### Styling
|
||||
|
|
|
|||
Loading…
Reference in New Issue