Fixing stories...
Junsik Shim
parent
e3562c8a08
commit
eda54946bb
|
|
@ -112,19 +112,19 @@ export { default as mxRootChangeCodec } from './util/serialization/mxRootChangeC
|
|||
export { default as mxStylesheetCodec } from './util/serialization/mxStylesheetCodec';
|
||||
export { default as mxTerminalChangeCodec } from './util/serialization/mxTerminalChangeCodec';
|
||||
|
||||
export { default as Actor } from './view/geometry/shape/Actor';
|
||||
export { default as ActorShape } from './view/geometry/shape/ActorShape';
|
||||
export { default as LabelShape } from './view/geometry/shape/node/LabelShape';
|
||||
export { default as Shape } from './view/geometry/shape/Shape';
|
||||
export { default as SwimlaneShape } from './view/geometry/shape/node/SwimlaneShape';
|
||||
export { default as TextShape } from './view/geometry/shape/node/TextShape';
|
||||
export { default as TriangleShape } from './view/geometry/shape/node/TriangleShape';
|
||||
|
||||
export { default as Arrow } from './view/geometry/shape/edge/Arrow';
|
||||
export { default as ArrowConnector } from './view/geometry/shape/edge/ArrowConnector';
|
||||
export { default as Connector } from './view/geometry/shape/edge/Connector';
|
||||
export { default as Line } from './view/geometry/shape/edge/Line';
|
||||
export { default as Marker } from './view/geometry/shape/edge/Marker';
|
||||
export { default as Polyline } from './view/geometry/shape/edge/Polyline';
|
||||
export { default as ArrowShape } from './view/geometry/shape/edge/ArrowShape';
|
||||
export { default as ArrowConnectorShape } from './view/geometry/shape/edge/ArrowConnectorShape';
|
||||
export { default as ConnectorShape } from './view/geometry/shape/edge/ConnectorShape';
|
||||
export { default as LineShape } from './view/geometry/shape/edge/LineShape';
|
||||
export { default as MarkerShape } from './view/geometry/shape/edge/MarkerShape';
|
||||
export { default as PolylineShape } from './view/geometry/shape/edge/PolylineShape';
|
||||
|
||||
export { default as CloudShape } from './view/geometry/shape/node/CloudShape';
|
||||
export { default as CylinderShape } from './view/geometry/shape/node/CylinderShape';
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ export type CellStateStyles = {
|
|||
perimeter: Function | string | null;
|
||||
perimeterSpacing: number;
|
||||
pointerEvents: boolean;
|
||||
resizeable: boolean;
|
||||
resizable: boolean;
|
||||
resizeHeight: boolean;
|
||||
resizeWidth: boolean;
|
||||
rotatable: boolean;
|
||||
|
|
|
|||
|
|
@ -7,14 +7,11 @@
|
|||
|
||||
import { DIALECT_SVG, GUIDE_COLOR, GUIDE_STROKEWIDTH } from './Constants';
|
||||
import Point from '../view/geometry/Point';
|
||||
import Polyline from '../view/geometry/shape/edge/Polyline';
|
||||
import PolylineShape from '../view/geometry/shape/edge/PolylineShape';
|
||||
import CellState from '../view/cell/datatypes/CellState';
|
||||
import Shape from '../view/geometry/shape/Shape';
|
||||
import Rectangle from '../view/geometry/Rectangle';
|
||||
import { Graph } from '../view/Graph';
|
||||
import EventObject from '../view/event/EventObject';
|
||||
import GraphView from '../view/view/GraphView';
|
||||
import { ColorValue } from '../types';
|
||||
|
||||
/**
|
||||
* Class: mxGuide
|
||||
|
|
@ -130,7 +127,7 @@ class Guide {
|
|||
*/
|
||||
createGuideShape(horizontal = false) {
|
||||
// TODO: Should vertical guides be supported here?? ============================
|
||||
const guide = new Polyline([], GUIDE_COLOR, GUIDE_STROKEWIDTH);
|
||||
const guide = new PolylineShape([], GUIDE_COLOR, GUIDE_STROKEWIDTH);
|
||||
guide.isDashed = true;
|
||||
return guide;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2364,6 +2364,6 @@ export const mixInto = (dest: any) => (mixin: any) => {
|
|||
});
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('Error while mixing', e);
|
||||
console.error('Error while mixing', e);
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -974,7 +974,7 @@ class SvgCanvas2D extends AbstractCanvas2D {
|
|||
if (flipH ? !flipV : flipV) {
|
||||
theta *= -1;
|
||||
}
|
||||
console.log('theta', theta);
|
||||
|
||||
if (theta !== 0) {
|
||||
s.transform += `rotate(${this.format(theta)},${this.format(cx)},${this.format(
|
||||
cy
|
||||
|
|
|
|||
|
|
@ -7,7 +7,13 @@
|
|||
|
||||
import mxClient from '../mxClient';
|
||||
import InternalEvent from './event/InternalEvent';
|
||||
import { contains, convertPoint, getRotatedPoint, toRadians } from '../util/Utils';
|
||||
import {
|
||||
contains,
|
||||
convertPoint,
|
||||
getRotatedPoint,
|
||||
isNumeric,
|
||||
toRadians,
|
||||
} from '../util/Utils';
|
||||
import RectangleShape from './geometry/shape/node/RectangleShape';
|
||||
import mxGuide from '../util/Guide';
|
||||
import Point from './geometry/Point';
|
||||
|
|
@ -1562,8 +1568,8 @@ class GraphHandler implements GraphPlugin {
|
|||
this.cell &&
|
||||
this.first &&
|
||||
(this.shape || this.livePreviewUsed) &&
|
||||
this.currentDx &&
|
||||
this.currentDy
|
||||
isNumeric(this.currentDx) &&
|
||||
isNumeric(this.currentDy)
|
||||
) {
|
||||
const { graph } = this;
|
||||
const cell = me.getCell();
|
||||
|
|
@ -1607,7 +1613,6 @@ class GraphHandler implements GraphPlugin {
|
|||
me.getGraphY()
|
||||
);
|
||||
} else if (this.cells) {
|
||||
console.log('move', this.cells, dx, dy, clone, this.target, me.getEvent());
|
||||
this.moveCells(this.cells, dx, dy, clone, this.target, me.getEvent());
|
||||
}
|
||||
}
|
||||
|
|
@ -1714,7 +1719,7 @@ class GraphHandler implements GraphPlugin {
|
|||
|
||||
// Removes cells from parent
|
||||
const parent = this.cell.getParent();
|
||||
console.log('parent', parent);
|
||||
|
||||
if (
|
||||
!target &&
|
||||
parent &&
|
||||
|
|
@ -1725,7 +1730,7 @@ class GraphHandler implements GraphPlugin {
|
|||
}
|
||||
|
||||
// Cloning into locked cells is not allowed
|
||||
clone = clone && !this.graph.isCellLocked(target || this.graph.getDefaultParent());
|
||||
clone = !!clone && !this.graph.isCellLocked(target || this.graph.getDefaultParent());
|
||||
|
||||
this.graph.getModel().beginUpdate();
|
||||
try {
|
||||
|
|
@ -1750,7 +1755,7 @@ class GraphHandler implements GraphPlugin {
|
|||
}
|
||||
}
|
||||
}
|
||||
console.log('moveCells', cells, dx, dy, clone, target, evt);
|
||||
|
||||
// Passes all selected cells in order to correctly clone or move into
|
||||
// the target cell. The method checks for each cell if its movable.
|
||||
cells = this.graph.moveCells(cells, dx, dy, clone, target, evt);
|
||||
|
|
|
|||
|
|
@ -365,9 +365,9 @@ class CellMarker extends EventSource {
|
|||
|
||||
if (!cell) return null;
|
||||
|
||||
const state = this.getStateToMark(view.getState(cell) as CellState);
|
||||
const state = this.getStateToMark(view.getState(cell));
|
||||
|
||||
return this.intersects(state, me) ? state : null;
|
||||
return state && this.intersects(state, me) ? state : null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -386,7 +386,7 @@ class CellMarker extends EventSource {
|
|||
* Returns the <mxCellState> to be marked for the given <mxCellState> under
|
||||
* the mouse. This returns the given state.
|
||||
*/
|
||||
getStateToMark(state: CellState) {
|
||||
getStateToMark(state: CellState | null) {
|
||||
return state;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -7,18 +7,18 @@ import RectangleShape from '../geometry/shape/node/RectangleShape';
|
|||
import EllipseShape from '../geometry/shape/node/EllipseShape';
|
||||
import RhombusShape from '../geometry/shape/node/RhombusShape';
|
||||
import CylinderShape from '../geometry/shape/node/CylinderShape';
|
||||
import Connector from '../geometry/shape/edge/Connector';
|
||||
import Actor from '../geometry/shape/Actor';
|
||||
import ConnectorShape from '../geometry/shape/edge/ConnectorShape';
|
||||
import ActorShape from '../geometry/shape/ActorShape';
|
||||
import TriangleShape from '../geometry/shape/node/TriangleShape';
|
||||
import HexagonShape from '../geometry/shape/node/HexagonShape';
|
||||
import CloudShape from '../geometry/shape/node/CloudShape';
|
||||
import Line from '../geometry/shape/edge/Line';
|
||||
import Arrow from '../geometry/shape/edge/Arrow';
|
||||
import ArrowConnector from '../geometry/shape/edge/ArrowConnector';
|
||||
import LineShape from '../geometry/shape/edge/LineShape';
|
||||
import ArrowShape from '../geometry/shape/edge/ArrowShape';
|
||||
import ArrowConnectorShape from '../geometry/shape/edge/ArrowConnectorShape';
|
||||
import DoubleEllipseShape from '../geometry/shape/node/DoubleEllipseShape';
|
||||
import SwimlaneShape from '../geometry/shape/node/SwimlaneShape';
|
||||
import ImageShape from '../geometry/shape/node/ImageShape';
|
||||
import Label from '../geometry/shape/node/LabelShape';
|
||||
import LabelShape from '../geometry/shape/node/LabelShape';
|
||||
import TextShape from '../geometry/shape/node/TextShape';
|
||||
import {
|
||||
ALIGN_CENTER,
|
||||
|
|
@ -121,7 +121,7 @@ class CellRenderer {
|
|||
* Defines the default shape for edges. Default is <mxConnector>.
|
||||
*/
|
||||
// @ts-expect-error The constructors for Shape and Connector are different.
|
||||
defaultEdgeShape: typeof Shape = Connector;
|
||||
defaultEdgeShape: typeof Shape = ConnectorShape;
|
||||
|
||||
/**
|
||||
* Variable: defaultVertexShape
|
||||
|
|
@ -1637,8 +1637,9 @@ class CellRenderer {
|
|||
return (
|
||||
shape.bounds == null ||
|
||||
shape.scale !== state.view.scale ||
|
||||
(state.absolutePoints == null && !shape.bounds.equals(state)) ||
|
||||
(state.absolutePoints != null && !equalPoints(shape.points, state.absolutePoints))
|
||||
(state.absolutePoints.length === 0 && !shape.bounds.equals(state)) ||
|
||||
(state.absolutePoints.length > 0 &&
|
||||
!equalPoints(shape.points, state.absolutePoints))
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -1685,19 +1686,19 @@ CellRenderer.registerShape(SHAPE_RHOMBUS, RhombusShape);
|
|||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_CYLINDER, CylinderShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_CONNECTOR, Connector);
|
||||
CellRenderer.registerShape(SHAPE_CONNECTOR, ConnectorShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_ACTOR, Actor);
|
||||
CellRenderer.registerShape(SHAPE_ACTOR, ActorShape);
|
||||
CellRenderer.registerShape(SHAPE_TRIANGLE, TriangleShape);
|
||||
CellRenderer.registerShape(SHAPE_HEXAGON, HexagonShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_CLOUD, CloudShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_LINE, Line);
|
||||
CellRenderer.registerShape(SHAPE_LINE, LineShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_ARROW, Arrow);
|
||||
CellRenderer.registerShape(SHAPE_ARROW, ArrowShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_ARROW_CONNECTOR, ArrowConnector);
|
||||
CellRenderer.registerShape(SHAPE_ARROW_CONNECTOR, ArrowConnectorShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_DOUBLE_ELLIPSE, DoubleEllipseShape);
|
||||
// @ts-ignore
|
||||
|
|
@ -1705,6 +1706,6 @@ CellRenderer.registerShape(SHAPE_SWIMLANE, SwimlaneShape);
|
|||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_IMAGE, ImageShape);
|
||||
// @ts-ignore
|
||||
CellRenderer.registerShape(SHAPE_LABEL, Label);
|
||||
CellRenderer.registerShape(SHAPE_LABEL, LabelShape);
|
||||
|
||||
export default CellRenderer;
|
||||
|
|
|
|||
|
|
@ -1997,7 +1997,6 @@ const GraphCellsMixin: PartialType = {
|
|||
* <mxEvent.CELLS_MOVED> while the transaction is in progress.
|
||||
*/
|
||||
cellsMoved(cells, dx, dy, disconnect = false, constrain = false, extend = false) {
|
||||
console.log('cellsMoved', cells, dx, dy, disconnect, constrain, extend);
|
||||
if (dx !== 0 || dy !== 0) {
|
||||
this.batchUpdate(() => {
|
||||
if (disconnect) {
|
||||
|
|
@ -2031,7 +2030,7 @@ const GraphCellsMixin: PartialType = {
|
|||
*/
|
||||
translateCell(cell, dx, dy) {
|
||||
let geometry = cell.getGeometry();
|
||||
console.log('begin', geometry);
|
||||
|
||||
if (geometry) {
|
||||
geometry = geometry.clone();
|
||||
geometry.translate(dx, dy);
|
||||
|
|
@ -2066,7 +2065,7 @@ const GraphCellsMixin: PartialType = {
|
|||
geometry.offset.y = geometry.offset.y + dy;
|
||||
}
|
||||
}
|
||||
console.log('end', geometry);
|
||||
|
||||
this.getModel().setGeometry(cell, geometry);
|
||||
}
|
||||
},
|
||||
|
|
@ -2773,7 +2772,8 @@ const GraphCellsMixin: PartialType = {
|
|||
isCellResizable(cell) {
|
||||
const style = this.getCurrentCellStyle(cell);
|
||||
|
||||
const r = this.isCellsResizable() && !this.isCellLocked(cell) && style.resizeable;
|
||||
const r =
|
||||
this.isCellsResizable() && !this.isCellLocked(cell) && (style.resizable ?? true);
|
||||
|
||||
return r;
|
||||
},
|
||||
|
|
@ -2806,7 +2806,7 @@ const GraphCellsMixin: PartialType = {
|
|||
isCellBendable(cell) {
|
||||
const style = this.getCurrentCellStyle(cell);
|
||||
|
||||
return this.isCellsBendable() && !this.isCellLocked(cell) && style.bendable;
|
||||
return this.isCellsBendable() && !this.isCellLocked(cell) && !!style.bendable;
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
@ -2838,7 +2838,7 @@ const GraphCellsMixin: PartialType = {
|
|||
isAutoSizeCell(cell) {
|
||||
const style = this.getCurrentCellStyle(cell);
|
||||
|
||||
return this.isAutoSizeCells() || style.autosize;
|
||||
return this.isAutoSizeCells() || !!style.autosize;
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -58,8 +58,6 @@ import SelectionCellsHandler from '../../selection/SelectionCellsHandler';
|
|||
* state - <mxCellState> of the cell to be resized.
|
||||
*/
|
||||
class VertexHandler {
|
||||
dependencies = ['selection', 'cells'];
|
||||
|
||||
constructor(state: CellState) {
|
||||
this.state = state;
|
||||
this.graph = this.state.view.graph;
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ import InternalMouseEvent from '../event/InternalMouseEvent';
|
|||
import ImageShape from '../geometry/shape/node/ImageShape';
|
||||
import CellMarker from '../cell/CellMarker';
|
||||
import ConstraintHandler from './ConstraintHandler';
|
||||
import Polyline from '../geometry/shape/edge/Polyline';
|
||||
import PolylineShape from '../geometry/shape/edge/PolylineShape';
|
||||
import EventSource from '../event/EventSource';
|
||||
import Rectangle from '../geometry/Rectangle';
|
||||
import mxLog from '../../util/gui/mxLog';
|
||||
|
|
@ -322,9 +322,9 @@ class ConnectionHandler extends EventSource implements GraphPlugin {
|
|||
/**
|
||||
* Variable: enabled
|
||||
*
|
||||
* Specifies if events are handled. Default is true.
|
||||
* Specifies if events are handled. Default is false.
|
||||
*/
|
||||
enabled = true;
|
||||
enabled = false;
|
||||
|
||||
/**
|
||||
* Variable: select
|
||||
|
|
@ -555,7 +555,7 @@ class ConnectionHandler extends EventSource implements GraphPlugin {
|
|||
const shape =
|
||||
this.livePreview && this.edgeState
|
||||
? this.graph.cellRenderer.createShape(this.edgeState)
|
||||
: new Polyline([], INVALID_COLOR);
|
||||
: new PolylineShape([], INVALID_COLOR);
|
||||
|
||||
if (shape && shape.node) {
|
||||
shape.dialect = DIALECT_SVG;
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@ import { NONE } from '../../../util/Constants';
|
|||
* }
|
||||
* ```
|
||||
*/
|
||||
class Actor extends Shape {
|
||||
class ActorShape extends Shape {
|
||||
constructor(
|
||||
bounds: Rectangle | null = null,
|
||||
fill: ColorValue = NONE,
|
||||
|
|
@ -71,4 +71,4 @@ class Actor extends Shape {
|
|||
}
|
||||
}
|
||||
|
||||
export default Actor;
|
||||
export default ActorShape;
|
||||
|
|
@ -738,7 +738,7 @@ class Shape {
|
|||
* Sets the state of the canvas for drawing the shape.
|
||||
*/
|
||||
configureCanvas(c: AbstractCanvas2D, x: number, y: number, w: number, h: number) {
|
||||
let dash = NONE;
|
||||
let dash: string | null = null;
|
||||
|
||||
if (this.style) {
|
||||
dash = this.style.dashPattern;
|
||||
|
|
@ -758,7 +758,9 @@ class Shape {
|
|||
c.setDashed(this.isDashed, this.style?.fixDash ?? false);
|
||||
}
|
||||
|
||||
if (dash) {
|
||||
c.setDashPattern(dash);
|
||||
}
|
||||
|
||||
if (this.fill !== NONE && this.gradient !== NONE) {
|
||||
const b = this.getGradientBounds(c, x, y, w, h);
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ import { ColorValue } from '../../../../types';
|
|||
*
|
||||
* This shape is registered under {@link mxConstants.SHAPE_ARROW_CONNECTOR} in {@link mxCellRenderer}.
|
||||
*/
|
||||
class ArrowConnector extends Shape {
|
||||
class ArrowConnectorShape extends Shape {
|
||||
constructor(
|
||||
points: Point[],
|
||||
fill: ColorValue,
|
||||
|
|
@ -483,4 +483,4 @@ class ArrowConnector extends Shape {
|
|||
}
|
||||
}
|
||||
|
||||
export default ArrowConnector;
|
||||
export default ArrowConnectorShape;
|
||||
|
|
@ -16,7 +16,7 @@ import { ColorValue } from '../../../../types';
|
|||
*
|
||||
* This shape is registered under {@link mxConstants.SHAPE_ARROW} in {@link mxCellRenderer}.
|
||||
*/
|
||||
class Arrow extends Shape {
|
||||
class ArrowShape extends Shape {
|
||||
constructor(
|
||||
points: Point[],
|
||||
fill: ColorValue,
|
||||
|
|
@ -100,4 +100,4 @@ class Arrow extends Shape {
|
|||
}
|
||||
}
|
||||
|
||||
export default Arrow;
|
||||
export default ArrowShape;
|
||||
|
|
@ -5,9 +5,8 @@
|
|||
* Type definitions from the typed-mxgraph project
|
||||
*/
|
||||
import { DEFAULT_MARKERSIZE, NONE } from '../../../../util/Constants';
|
||||
import Polyline from './Polyline';
|
||||
import { getNumber } from '../../../../util/Utils';
|
||||
import Marker from './Marker';
|
||||
import PolylineShape from './PolylineShape';
|
||||
import MarkerShape from './MarkerShape';
|
||||
import Point from '../../Point';
|
||||
import AbstractCanvas2D from '../../../../util/canvas/AbstractCanvas2D';
|
||||
import Rectangle from '../../Rectangle';
|
||||
|
|
@ -18,10 +17,10 @@ import { ColorValue } from '../../../../types';
|
|||
* The connector shape allows for arrow heads on either side.
|
||||
* This shape is registered under {@link mxConstants.SHAPE_CONNECTOR} in {@link mxCellRenderer}.
|
||||
*
|
||||
* @class Connector
|
||||
* @extends {Polyline}
|
||||
* @class ConnectorShape
|
||||
* @extends {PolylineShape}
|
||||
*/
|
||||
class Connector extends Polyline {
|
||||
class ConnectorShape extends PolylineShape {
|
||||
constructor(points: Point[], stroke: ColorValue, strokewidth: number) {
|
||||
super(points, stroke, strokewidth);
|
||||
}
|
||||
|
|
@ -101,9 +100,9 @@ class Connector extends Polyline {
|
|||
|
||||
// Allow for stroke width in the end point used and the
|
||||
// orthogonal vectors describing the direction of the marker
|
||||
const filled = source ? this.style.startFill : this.style.endFill;
|
||||
const filled = !(source ? this.style.startFill : this.style.endFill);
|
||||
|
||||
result = Marker.createMarker(
|
||||
result = MarkerShape.createMarker(
|
||||
c,
|
||||
this,
|
||||
type,
|
||||
|
|
@ -143,4 +142,4 @@ class Connector extends Polyline {
|
|||
}
|
||||
}
|
||||
|
||||
export default Connector;
|
||||
export default ConnectorShape;
|
||||
|
|
@ -15,7 +15,7 @@ import { ColorValue } from '../../../../types';
|
|||
* @class Line
|
||||
* @extends {Shape}
|
||||
*/
|
||||
class Line extends Shape {
|
||||
class LineShape extends Shape {
|
||||
constructor(bounds: Rectangle, stroke: ColorValue, strokeWidth = 1, vertical = false) {
|
||||
super();
|
||||
this.bounds = bounds;
|
||||
|
|
@ -56,4 +56,4 @@ class Line extends Shape {
|
|||
}
|
||||
}
|
||||
|
||||
export default Line;
|
||||
export default LineShape;
|
||||
|
|
@ -17,9 +17,9 @@ import Shape from '../Shape';
|
|||
/**
|
||||
* A static class that implements all markers for VML and SVG using a registry.
|
||||
* NOTE: The signatures in this class will change.
|
||||
* @class Marker
|
||||
* @class MarkerShape
|
||||
*/
|
||||
class Marker {
|
||||
class MarkerShape {
|
||||
/**
|
||||
* Maps from markers names to functions to paint the markers.
|
||||
*
|
||||
|
|
@ -32,7 +32,7 @@ class Marker {
|
|||
* function to paint the marker onto the given canvas.
|
||||
*/
|
||||
static addMarker(type: string, funct: Function) {
|
||||
Marker.markers[type] = funct;
|
||||
MarkerShape.markers[type] = funct;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -52,7 +52,7 @@ class Marker {
|
|||
sw: number,
|
||||
filled: boolean
|
||||
) {
|
||||
const funct = Marker.markers[type];
|
||||
const funct = MarkerShape.markers[type];
|
||||
return funct
|
||||
? funct(canvas, shape, type, pe, unitX, unitY, size, source, sw, filled)
|
||||
: null;
|
||||
|
|
@ -120,10 +120,10 @@ class Marker {
|
|||
};
|
||||
}
|
||||
|
||||
Marker.addMarker('classic', createArrow(2));
|
||||
Marker.addMarker('classicThin', createArrow(3));
|
||||
Marker.addMarker('block', createArrow(2));
|
||||
Marker.addMarker('blockThin', createArrow(3));
|
||||
MarkerShape.addMarker('classic', createArrow(2));
|
||||
MarkerShape.addMarker('classicThin', createArrow(3));
|
||||
MarkerShape.addMarker('block', createArrow(2));
|
||||
MarkerShape.addMarker('blockThin', createArrow(3));
|
||||
|
||||
function createOpenArrow(widthFactor = 2) {
|
||||
return (
|
||||
|
|
@ -170,10 +170,10 @@ class Marker {
|
|||
};
|
||||
}
|
||||
|
||||
Marker.addMarker('open', createOpenArrow(2));
|
||||
Marker.addMarker('openThin', createOpenArrow(3));
|
||||
MarkerShape.addMarker('open', createOpenArrow(2));
|
||||
MarkerShape.addMarker('openThin', createOpenArrow(3));
|
||||
|
||||
Marker.addMarker(
|
||||
MarkerShape.addMarker(
|
||||
'oval',
|
||||
(
|
||||
canvas: AbstractCanvas2D,
|
||||
|
|
@ -255,8 +255,8 @@ class Marker {
|
|||
};
|
||||
}
|
||||
|
||||
Marker.addMarker('diamond', diamond);
|
||||
Marker.addMarker('diamondThin', diamond);
|
||||
MarkerShape.addMarker('diamond', diamond);
|
||||
MarkerShape.addMarker('diamondThin', diamond);
|
||||
})();
|
||||
|
||||
export default Marker;
|
||||
export default MarkerShape;
|
||||
|
|
@ -30,7 +30,7 @@ import { ColorValue } from '../../../../types';
|
|||
* strokewidth - Optional integer that defines the stroke width. Default is
|
||||
* 1. This is stored in <strokewidth>.
|
||||
*/
|
||||
class Polyline extends Shape {
|
||||
class PolylineShape extends Shape {
|
||||
constructor(points: Point[], stroke: ColorValue, strokeWidth = 1) {
|
||||
super();
|
||||
this.points = points;
|
||||
|
|
@ -111,4 +111,4 @@ class Polyline extends Shape {
|
|||
}
|
||||
}
|
||||
|
||||
export default Polyline;
|
||||
export default PolylineShape;
|
||||
|
|
@ -4,16 +4,16 @@
|
|||
* Updated to ES9 syntax by David Morrissey 2021
|
||||
* Type definitions from the typed-mxgraph project
|
||||
*/
|
||||
import Actor from '../Actor';
|
||||
import ActorShape from '../ActorShape';
|
||||
import AbstractCanvas2D from '../../../../util/canvas/AbstractCanvas2D';
|
||||
import Rectangle from '../../Rectangle';
|
||||
|
||||
/**
|
||||
* Extends {@link Actor} to implement a cloud shape.
|
||||
* Extends {@link ActorShape} to implement a cloud shape.
|
||||
*
|
||||
* This shape is registered under {@link mxConstants.SHAPE_CLOUD} in {@link cellRenderer}.
|
||||
*/
|
||||
class CloudShape extends Actor {
|
||||
class CloudShape extends ActorShape {
|
||||
constructor(bounds: Rectangle, fill: string, stroke: string, strokeWidth = 1) {
|
||||
super();
|
||||
this.bounds = bounds;
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
* Updated to ES9 syntax by David Morrissey 2021
|
||||
* Type definitions from the typed-mxgraph project
|
||||
*/
|
||||
import Actor from '../Actor';
|
||||
import ActorShape from '../ActorShape';
|
||||
import Point from '../../Point';
|
||||
import { LINE_ARCSIZE } from '../../../../util/Constants';
|
||||
import AbstractCanvas2D from '../../../../util/canvas/AbstractCanvas2D';
|
||||
|
|
@ -12,9 +12,9 @@ import AbstractCanvas2D from '../../../../util/canvas/AbstractCanvas2D';
|
|||
/**
|
||||
* Implementation of the hexagon shape.
|
||||
* @class HexagonShape
|
||||
* @extends {Actor}
|
||||
* @extends {ActorShape}
|
||||
*/
|
||||
class HexagonShape extends Actor {
|
||||
class HexagonShape extends ActorShape {
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,16 +6,16 @@
|
|||
*/
|
||||
|
||||
import Point from '../../Point';
|
||||
import Actor from '../Actor';
|
||||
import ActorShape from '../ActorShape';
|
||||
import { LINE_ARCSIZE } from '../../../../util/Constants';
|
||||
import AbstractCanvas2D from '../../../../util/canvas/AbstractCanvas2D';
|
||||
|
||||
/**
|
||||
* Implementation of the triangle shape.
|
||||
* @class TriangleShape
|
||||
* @extends {Actor}
|
||||
* @extends {ActorShape}
|
||||
*/
|
||||
class TriangleShape extends Actor {
|
||||
class TriangleShape extends ActorShape {
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import Rectangle from '../geometry/Rectangle';
|
||||
import Point from '../geometry/Point';
|
||||
import Polyline from '../geometry/shape/edge/Polyline';
|
||||
import PolylineShape from '../geometry/shape/edge/PolylineShape';
|
||||
import { Graph } from '../Graph';
|
||||
import { mixInto } from '../../util/Utils';
|
||||
|
||||
|
|
@ -111,7 +111,7 @@ const GraphPageBreaksMixin: PartialType = {
|
|||
breaks[i].points = pts;
|
||||
breaks[i].redraw();
|
||||
} else {
|
||||
const pageBreak = new Polyline(pts, this.getPageBreakColor());
|
||||
const pageBreak = new PolylineShape(pts, this.getPageBreakColor());
|
||||
pageBreak.dialect = this.getDialect();
|
||||
pageBreak.pointerEvents = false;
|
||||
pageBreak.isDashed = this.isPageBreakDashed();
|
||||
|
|
|
|||
|
|
@ -164,9 +164,9 @@ class PanningHandler extends EventSource implements GraphPlugin {
|
|||
/**
|
||||
* Variable: panningEnabled
|
||||
*
|
||||
* Specifies if panning should be enabled. Default is true.
|
||||
* Specifies if panning should be enabled. Default is false.
|
||||
*/
|
||||
panningEnabled = true;
|
||||
panningEnabled = false;
|
||||
|
||||
/**
|
||||
* Variable: pinchEnabled
|
||||
|
|
|
|||
|
|
@ -253,6 +253,7 @@ const GraphSelectionMixin: PartialType = {
|
|||
tmp.push(cells[i]);
|
||||
}
|
||||
}
|
||||
|
||||
this.changeSelection(tmp, this.cells);
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -131,9 +131,9 @@ class TooltipHandler implements GraphPlugin {
|
|||
/**
|
||||
* Variable: enabled
|
||||
*
|
||||
* Specifies if events are handled. Default is true.
|
||||
* Specifies if events are handled. Default is false.
|
||||
*/
|
||||
enabled = true;
|
||||
enabled = false;
|
||||
|
||||
/**
|
||||
* Function: isEnabled
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ declare module '../Graph' {
|
|||
zoomIn: () => void;
|
||||
zoomOut: () => void;
|
||||
zoomActual: () => void;
|
||||
zoomTo: (scale: number, center: boolean) => void;
|
||||
zoomTo: (scale: number, center?: boolean) => void;
|
||||
zoom: (factor: number, center?: boolean) => void;
|
||||
zoomToRect: (rect: Rectangle) => void;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import {
|
|||
ConnectionHandler,
|
||||
ConnectionConstraint,
|
||||
Geometry,
|
||||
Polyline,
|
||||
PolylineShape,
|
||||
Point,
|
||||
CellState,
|
||||
} from '@maxgraph/core';
|
||||
|
|
@ -81,7 +81,7 @@ const Template = ({ label, ...args }) => {
|
|||
}
|
||||
|
||||
// Edges have no connection points
|
||||
Polyline.prototype.constraints = null;
|
||||
PolylineShape.prototype.constraints = null;
|
||||
|
||||
// Creates the graph inside the given container
|
||||
const graph = new MyCustomGraph(container);
|
||||
|
|
|
|||
|
|
@ -3,9 +3,9 @@ import {
|
|||
EdgeHandler,
|
||||
GraphHandler,
|
||||
CellRenderer,
|
||||
Marker,
|
||||
MarkerShape,
|
||||
CylinderShape,
|
||||
Arrow,
|
||||
ArrowShape,
|
||||
Point,
|
||||
} from '@maxgraph/core';
|
||||
|
||||
|
|
@ -32,7 +32,7 @@ const Template = ({ label, ...args }) => {
|
|||
EdgeHandler.prototype.snapToTerminals = true;
|
||||
|
||||
// Registers and defines the custom marker
|
||||
Marker.addMarker(
|
||||
MarkerShape.addMarker(
|
||||
'dash',
|
||||
function (canvas, shape, type, pe, unitX, unitY, size, source, sw, filled) {
|
||||
const nx = unitX * (size + sw + 1);
|
||||
|
|
@ -66,7 +66,7 @@ const Template = ({ label, ...args }) => {
|
|||
CellRenderer.registerShape('message', MessageShape);
|
||||
|
||||
// Defines custom edge shape
|
||||
class LinkShape extends Arrow {
|
||||
class LinkShape extends ArrowShape {
|
||||
paintEdgeShape(c, pts) {
|
||||
const width = 10;
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue