diff --git a/package.json b/package.json index db3ddb2..ff80e3a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@kateter-platform/graphica", - "version": "1.0.87", + "version": "1.0.88", "source": "./src/index.ts", "description": "A tool for advanced graphing and visualization", "repository": { diff --git a/src/Components/Derived/Node.ts b/src/Components/Derived/Node.ts index d1ea427..a7b54d0 100644 --- a/src/Components/Derived/Node.ts +++ b/src/Components/Derived/Node.ts @@ -6,11 +6,13 @@ import Text from "../Text"; export type NodeOptions = CircleOptions & { label?: string; + color?: number; }; const defaultNodeOptions: NodeOptions = { ...defaultShapeOptions, label: "", + color: 0xfaa307, }; type Edge = { @@ -19,6 +21,18 @@ type Edge = { weight?: number; }; +type ConnectOptions = { + directed: boolean; + value: number | undefined; + color: number; +}; + +const defaultConnectOptions: ConnectOptions = { + directed: false, + value: undefined, + color: 0x080007, +}; + class Node extends Circle { adjacencyList: Edge[]; label?: Text; @@ -75,7 +89,9 @@ class Node extends Circle { * @param directed - Booleean for whether the edge is directed (directed edges will also have curve) * @param value - Number for eeight/value of the edge */ - connectTo(other: Node, directed = false, value?: number): void { + connectTo(other: Node, options?: ConnectOptions): void { + const { directed, value, color } = { ...defaultConnectOptions, ...options }; + if (!this.isAdjacentTo(other) && !(!directed && other.isAdjacentTo(this))) { const dx = other.position.x - this.position.x; const dy = other.position.y - this.position.y; @@ -95,7 +111,8 @@ class Node extends Circle { { arrowhead: directed, curve: directed ? 2 : 0, - label: value !== undefined ? value.toString() : "", + label: value?.toString() ?? "", + color: color, } ); this.adjacencyList.push({ node: other, line: line, weight: value }); @@ -154,7 +171,11 @@ class Node extends Circle { } if (!directed) { - other.connectTo(this, false); + other.connectTo(this, { + directed: false, + value: undefined, + color: 0x080007, + }); } } } diff --git a/src/Components/LegendText.ts b/src/Components/LegendText.ts index e1860c6..fdcbe52 100644 --- a/src/Components/LegendText.ts +++ b/src/Components/LegendText.ts @@ -5,7 +5,6 @@ type LegendTextOptions = { }; const defaultLegendTextOptions = { - shape: "circle", color: "#faa307", useStates: false, diff --git a/src/Core.ts b/src/Core.ts index 7628f79..162b40d 100644 --- a/src/Core.ts +++ b/src/Core.ts @@ -28,6 +28,8 @@ const ORBIT_CONTROL_OPTIONS = { type GraphicaOptions = { root: HTMLElement; disableControls: boolean; + disableZoom: boolean; + disablePan: boolean; defaultZoom: number; defaultPosition: InputPosition; minZoom: number; @@ -38,6 +40,8 @@ type GraphicaOptions = { const defaultGraphicaOptions: GraphicaOptions = { root: document.body, disableControls: false, + disableZoom: false, + disablePan: false, defaultZoom: 50, defaultPosition: [0, 0], minZoom: 1, @@ -68,6 +72,8 @@ class Core { const { root, disableControls, + disableZoom, + disablePan, defaultZoom, minZoom, maxZoom, @@ -111,7 +117,8 @@ class Core { const controls = new OrbitControls(this.camera, this.renderer.domElement); controls.enableRotate = false; - controls.enablePan = true; + controls.enablePan = !disablePan; + controls.enableZoom = !disableZoom; controls.mouseButtons = ORBIT_CONTROL_OPTIONS; controls.minZoom = minZoom; controls.maxZoom = maxZoom;