aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes')
-rw-r--r--src/client/views/nodes/DocumentView.tsx3
-rw-r--r--src/client/views/nodes/EquationBox.scss2
-rw-r--r--src/client/views/nodes/EquationBox.tsx2
-rw-r--r--src/client/views/nodes/FunctionPlotBox.tsx43
-rw-r--r--src/client/views/nodes/LinkBox.tsx2
5 files changed, 41 insertions, 11 deletions
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 30f9e6363..92e98db87 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -459,10 +459,9 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
}
if (annoData || this.Document !== linkdrag.linkSourceDoc.embedContainer) {
const dropDoc = annoData?.dropDocument ?? this._componentView?.getAnchor?.(true) ?? this.Document;
- const linkDoc = DocUtils.MakeLink(linkdrag.linkSourceDoc, dropDoc, {}, undefined, [de.x, de.y - 50]);
+ const linkDoc = DocUtils.MakeLink(linkdrag.linkSourceDoc, dropDoc, {layout_isSvg: true }, undefined, [de.x, de.y - 50]);
if (linkDoc) {
de.complete.linkDocument = linkDoc;
- linkDoc.layout_isSvg = true;
DocumentView.linkCommonAncestor(linkDoc)?.ComponentView?.addDocument?.(linkDoc);
}
}
diff --git a/src/client/views/nodes/EquationBox.scss b/src/client/views/nodes/EquationBox.scss
index cbd13d924..55e0f5184 100644
--- a/src/client/views/nodes/EquationBox.scss
+++ b/src/client/views/nodes/EquationBox.scss
@@ -2,9 +2,7 @@
.equationBox-cont {
transform-origin: center;
- background-color: #e7e7e7;
width: fit-content;
- min-width: 100%;
> span {
width: fit-content;
}
diff --git a/src/client/views/nodes/EquationBox.tsx b/src/client/views/nodes/EquationBox.tsx
index 472fa56a0..34b46381d 100644
--- a/src/client/views/nodes/EquationBox.tsx
+++ b/src/client/views/nodes/EquationBox.tsx
@@ -81,7 +81,7 @@ export class EquationBox extends ViewBoxBaseComponent<FieldViewProps>() {
_height: 300,
backgroundColor: 'white',
});
- const link = DocUtils.MakeLink(this.Document, graph, { link_relationship: 'function', link_description: 'input' });
+ const link = DocUtils.MakeLink(this.Document, graph, { layout_isSvg: true, link_relationship: 'function', link_description: 'input' });
this._props.addDocument?.(graph);
link && this._props.addDocument?.(link);
e.stopPropagation();
diff --git a/src/client/views/nodes/FunctionPlotBox.tsx b/src/client/views/nodes/FunctionPlotBox.tsx
index 6b439cd64..91c351895 100644
--- a/src/client/views/nodes/FunctionPlotBox.tsx
+++ b/src/client/views/nodes/FunctionPlotBox.tsx
@@ -1,5 +1,5 @@
import functionPlot, { Chart } from 'function-plot';
-import { computed, makeObservable, reaction } from 'mobx';
+import { action, computed, makeObservable, reaction } from 'mobx';
import { observer } from 'mobx-react';
import * as React from 'react';
import { Doc, DocListCast } from '../../../fields/Doc';
@@ -15,6 +15,8 @@ import { undoBatch } from '../../util/UndoManager';
import { ViewBoxAnnotatableComponent } from '../DocComponent';
import { PinDocView, PinProps } from '../PinFuncs';
import { FieldView, FieldViewProps } from './FieldView';
+import { returnFalse, setupMoveUpEvents } from '../../../ClientUtils';
+import { emptyFunction } from '../../../Utils';
@observer
export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
@@ -65,18 +67,24 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
);
return funcs;
}
+ computeYScale = (width: number, height: number, xScale: number[]) => {
+ const xDiff = xScale[1] - xScale[0];
+ const yDiff = (height * xDiff) / width;
+ return [-yDiff / 2, yDiff / 2];
+ };
createGraph = (ele?: HTMLDivElement) => {
this._plotEle = ele || this._plotEle;
const width = this._props.PanelWidth();
const height = this._props.PanelHeight();
+ const xrange = Cast(this.layoutDoc.xRange, listSpec('number'), [-10, 10]);
try {
this._plotEle?.children.length && this._plotEle.removeChild(this._plotEle.children[0]);
this._plot = functionPlot({
target: '#' + this._plotEle?.id,
width,
height,
- xAxis: { domain: Cast(this.layoutDoc.xRange, listSpec('number'), [-10, 10]) },
- yAxis: { domain: Cast(this.layoutDoc.yRange, listSpec('number'), [-1, 9]) },
+ xAxis: { domain: xrange },
+ yAxis: { domain: this.computeYScale(width, height, xrange) }, // Cast(this.layoutDoc.yRange, listSpec('number'), [-1, 9]) },
grid: true,
data: this.graphFuncs.map(fn => ({
fn,
@@ -94,7 +102,7 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
const added = de.complete.docDragData.droppedDocuments.reduce((res, doc) => {
// const ret = res && Doc.AddDocToList(this.dataDoc, this._props.fieldKey, doc);
if (res) {
- const link = DocUtils.MakeLink(doc, this.Document, { link_relationship: 'function', link_description: 'input' });
+ const link = DocUtils.MakeLink(doc, this.Document, { layout_isSvg: true, link_relationship: 'function', link_description: 'input' });
link && this._props.addDocument?.(link);
}
return res;
@@ -115,7 +123,32 @@ export class FunctionPlotBox extends ViewBoxAnnotatableComponent<FieldViewProps>
// if (this.layout_autoHeight) this.tryUpdateScrollHeight();
};
@computed get theGraph() {
- return <div id={`${this._plotId}`} ref={r => r && this.createGraph(r)} style={{ position: 'absolute', width: '100%', height: '100%' }} onPointerDown={e => e.stopPropagation()} />;
+ return (
+ <div
+ id={`${this._plotId}`}
+ ref={r => r && this.createGraph(r)}
+ style={{ position: 'absolute', width: '100%', height: '100%' }}
+ onPointerDown={e => {
+ e.stopPropagation();
+ setupMoveUpEvents(
+ this,
+ e,
+ returnFalse,
+ action(() => {
+ if (this._plot?.options.xAxis?.domain) {
+ this.Document.xRange = new List<number>(this._plot.options.xAxis.domain);
+ }
+ if (this._plot?.options.yAxis?.domain) {
+ this.Document.yRange = new List<number>(this._plot.options.yAxis.domain);
+ }
+ }),
+ emptyFunction,
+ false,
+ false
+ );
+ }}
+ />
+ );
}
render() {
TraceMobx();
diff --git a/src/client/views/nodes/LinkBox.tsx b/src/client/views/nodes/LinkBox.tsx
index 4d9d2460e..c62a8afb1 100644
--- a/src/client/views/nodes/LinkBox.tsx
+++ b/src/client/views/nodes/LinkBox.tsx
@@ -160,7 +160,7 @@ export class LinkBox extends ViewBoxBaseComponent<FieldViewProps>() {
// eslint-disable-next-line camelcase
const { stroke_markerScale: strokeMarkerScale, stroke_width: strokeRawWidth, stroke_startMarker: strokeStartMarker, stroke_endMarker: strokeEndMarker, stroke_dash: strokeDash } = this.Document;
- const strokeWidth = NumCast(strokeRawWidth, 4);
+ const strokeWidth = NumCast(strokeRawWidth, 1);
const linkDesc = StrCast(this.dataDoc.link_description) || ' ';
const labelText = linkDesc.substring(0, 50) + (linkDesc.length > 50 ? '...' : '');
return (