abstract-3d 2.1.0 → 2.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/lib/renderers/react/react-camera.d.ts +6 -4
- package/lib/renderers/react/react-camera.d.ts.map +1 -1
- package/lib/renderers/react/react-camera.js +37 -12
- package/lib/renderers/react/react-camera.js.map +1 -1
- package/package.json +3 -3
- package/src/renderers/react/react-camera.tsx +57 -21
- package/src/.DS_Store +0 -0
- package/src/renderers/.DS_Store +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](http://keepachangelog.com/) and this project adheres to [Semantic Versioning](http://semver.org/).
|
|
4
4
|
|
|
5
|
+
## v2.2.0
|
|
6
|
+
|
|
7
|
+
- Added flag to react 3d renderer allowing user to force reset pan and zoom on cube/viewport click
|
|
8
|
+
|
|
5
9
|
## v2.1.0
|
|
6
10
|
|
|
7
11
|
- Made dxf exporter use LINE and POLYLINE instead of 3DFACE for the lines and polylines
|
|
@@ -35,9 +35,9 @@ export declare function ReactCamera({ useAnimations, camera, view, scene, contro
|
|
|
35
35
|
readonly orbitContolsProps?: OrbitControlsProps;
|
|
36
36
|
}): React.JSX.Element;
|
|
37
37
|
type GizmoViewportProps = React.JSX.IntrinsicElements["group"] & {
|
|
38
|
-
readonly axisColors?:
|
|
39
|
-
readonly axisScale?:
|
|
40
|
-
readonly labels?:
|
|
38
|
+
readonly axisColors?: [string, string, string];
|
|
39
|
+
readonly axisScale?: [number, number, number];
|
|
40
|
+
readonly labels?: [string, string, string];
|
|
41
41
|
readonly axisHeadScale?: number;
|
|
42
42
|
readonly labelColor?: string;
|
|
43
43
|
readonly hideNegativeAxes?: boolean;
|
|
@@ -45,6 +45,7 @@ type GizmoViewportProps = React.JSX.IntrinsicElements["group"] & {
|
|
|
45
45
|
readonly disabled?: boolean;
|
|
46
46
|
readonly font?: string;
|
|
47
47
|
readonly onClick?: (e: ThreeEvent<MouseEvent>) => null;
|
|
48
|
+
readonly resetZoomAndPanOnClick?: boolean;
|
|
48
49
|
};
|
|
49
50
|
type GenericProps = {
|
|
50
51
|
readonly font?: string;
|
|
@@ -54,7 +55,8 @@ type GenericProps = {
|
|
|
54
55
|
readonly textColor?: string;
|
|
55
56
|
readonly strokeColor?: string;
|
|
56
57
|
readonly onClick?: (e: ThreeEvent<MouseEvent>) => null;
|
|
57
|
-
readonly faces?:
|
|
58
|
+
readonly faces?: Array<string>;
|
|
59
|
+
readonly resetZoomAndPanOnClick?: boolean;
|
|
58
60
|
};
|
|
59
61
|
export declare const cameraDist: (size: Vec3, fov: number) => number;
|
|
60
62
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-camera.d.ts","sourceRoot":"","sources":["../../../src/renderers/react/react-camera.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA4C,MAAM,OAAO,CAAC;AACjE,OAAO,EACL,KAAK,gBAAgB,EAGrB,KAAK,kBAAkB,EAKxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,KAAK,UAAU,EAAY,MAAM,oBAAoB,CAAC;AAG/D,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAQ,MAAM,sBAAsB,CAAC;AAE/D,MAAM,MAAM,MAAM,GAAG,oBAAoB,GAAG,qBAAqB,CAAC;AAClE,MAAM,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;AAExC,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,CAAC,IAAI,EAAE,aAAa,CAAC;IAC7B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AACF,MAAM,MAAM,qBAAqB,GAAG;IAAE,QAAQ,CAAC,IAAI,EAAE,cAAc,CAAC;IAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAErH,MAAM,MAAM,cAAc,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,GAAG;IAAE,QAAQ,CAAC,KAAK,EAAE,IAAI,CAAC,gBAAgB,EAAE,WAAW,GAAG,QAAQ,CAAC,CAAA;CAAE,CAAC;AACxH,KAAK,QAAQ,GAAG;IAAE,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,aAAa,EAAE,YAAY,CAAA;CAAE,CAAC;AACpF,KAAK,QAAQ,GAAG;IAAE,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAC;IAAC,QAAQ,CAAC,aAAa,EAAE,kBAAkB,CAAA;CAAE,CAAC;AAE1F,wBAAgB,WAAW,CAAC,EAC1B,aAAa,EACb,MAAM,EACN,IAAI,EACJ,KAAK,EACL,cAAc,EACd,iBAAiB,GAClB,EAAE;IACD,QAAQ,CAAC,aAAa,EAAE,OAAO,CAAC;IAChC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,IAAI,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC;IACtB,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,kBAAkB,CAAC;CACjD,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"react-camera.d.ts","sourceRoot":"","sources":["../../../src/renderers/react/react-camera.tsx"],"names":[],"mappings":"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"}
|
|
@@ -5,12 +5,28 @@ import { useLayoutEffect, useRef, useState } from "react";
|
|
|
5
5
|
import { PerspectiveCamera, OrthographicCamera, OrbitControls, GizmoHelper, GizmoViewcube, GizmoViewport, } from "@react-three/drei";
|
|
6
6
|
import { useThree } from "@react-three/fiber";
|
|
7
7
|
import { exhaustiveCheck } from "ts-exhaustive-check";
|
|
8
|
+
import { Vector3 } from "three";
|
|
8
9
|
import { vec3 } from "../../abstract-3d.js";
|
|
9
10
|
export function ReactCamera({ useAnimations, camera, view, scene, controlsHelper, orbitContolsProps, }) {
|
|
10
11
|
const [controls, setControls] = useState(null);
|
|
11
12
|
const perspectiveRef = useRef(undefined);
|
|
12
13
|
const orthographicRef = useRef(undefined);
|
|
14
|
+
const initialDistRef = useRef(null);
|
|
15
|
+
const initialTargetRef = useRef(new Vector3());
|
|
13
16
|
const viewPortAspect = useThree(({ viewport: { aspect } }) => aspect);
|
|
17
|
+
const { invalidate } = useThree();
|
|
18
|
+
const resetZoomOnGizmoClick = () => {
|
|
19
|
+
if (!controls || initialDistRef.current == null || !perspectiveRef.current)
|
|
20
|
+
return;
|
|
21
|
+
const camera = perspectiveRef.current;
|
|
22
|
+
const target = initialTargetRef.current.clone();
|
|
23
|
+
controls.target.copy(target);
|
|
24
|
+
const dist = initialDistRef.current;
|
|
25
|
+
const dir = camera.position.clone().sub(target).normalize();
|
|
26
|
+
camera.position.copy(target.clone().add(dir.multiplyScalar(dist)));
|
|
27
|
+
controls.update();
|
|
28
|
+
invalidate();
|
|
29
|
+
};
|
|
14
30
|
useLayoutEffect(() => {
|
|
15
31
|
const [posX, posY, posZ, size, sceneAspect] = (() => {
|
|
16
32
|
switch (view) {
|
|
@@ -55,13 +71,12 @@ export function ReactCamera({ useAnimations, camera, view, scene, controlsHelper
|
|
|
55
71
|
}
|
|
56
72
|
})();
|
|
57
73
|
const dist = cameraDist(size, camera.type === "Perspective" ? camera.fov ?? 45 : 45);
|
|
74
|
+
initialDistRef.current = dist;
|
|
58
75
|
if (camera.type === "Orthographic" && orthographicRef.current) {
|
|
59
76
|
const [left, right, top, bottom] = sceneAspect > viewPortAspect
|
|
60
77
|
? [-size.x / 2, size.x / 2, size.x / 2 / viewPortAspect, -size.x / 2 / viewPortAspect]
|
|
61
78
|
: [(-viewPortAspect * size.y) / 2, (viewPortAspect * size.y) / 2, size.y / 2, -size.y / 2];
|
|
62
|
-
orthographicRef.current.position.
|
|
63
|
-
orthographicRef.current.position.setY(posY * dist);
|
|
64
|
-
orthographicRef.current.position.setZ(posZ * dist);
|
|
79
|
+
orthographicRef.current.position.set(posX * dist, posY * dist, posZ * dist);
|
|
65
80
|
orthographicRef.current.left = left;
|
|
66
81
|
orthographicRef.current.right = right;
|
|
67
82
|
orthographicRef.current.bottom = bottom;
|
|
@@ -69,9 +84,7 @@ export function ReactCamera({ useAnimations, camera, view, scene, controlsHelper
|
|
|
69
84
|
orthographicRef.current.updateProjectionMatrix();
|
|
70
85
|
}
|
|
71
86
|
else if (camera.type === "Perspective" && perspectiveRef.current) {
|
|
72
|
-
perspectiveRef.current.position.
|
|
73
|
-
perspectiveRef.current.position.setY(posY * dist);
|
|
74
|
-
perspectiveRef.current.position.setZ(posZ * dist);
|
|
87
|
+
perspectiveRef.current.position.set(posX * dist, posY * dist, posZ * dist);
|
|
75
88
|
perspectiveRef.current.updateProjectionMatrix();
|
|
76
89
|
}
|
|
77
90
|
}, [camera, viewPortAspect]);
|
|
@@ -90,26 +103,38 @@ export function ReactCamera({ useAnimations, camera, view, scene, controlsHelper
|
|
|
90
103
|
// ref.current.enabled = true;
|
|
91
104
|
// }
|
|
92
105
|
// });
|
|
93
|
-
return (_jsxs(_Fragment, { children: [_jsx(PerspectiveCamera, { ref: perspectiveRef, near: camera.near, far: camera.far, fov: camera.type === "Perspective" ? camera.fov : 75, aspect: viewPortAspect, manual: true, makeDefault: camera.type === "Perspective" }), _jsx(OrthographicCamera, { ref: orthographicRef, up: [0, 1, 0], near: camera.near, far: camera.far, manual: true, makeDefault: camera.type === "Orthographic" }), _jsx(ControlsWrapper, { ...orbitContolsProps, setControls: (c) =>
|
|
106
|
+
return (_jsxs(_Fragment, { children: [_jsx(PerspectiveCamera, { ref: perspectiveRef, near: camera.near, far: camera.far, fov: camera.type === "Perspective" ? camera.fov : 75, aspect: viewPortAspect, manual: true, makeDefault: camera.type === "Perspective" }), _jsx(OrthographicCamera, { ref: orthographicRef, up: [0, 1, 0], near: camera.near, far: camera.far, manual: true, makeDefault: camera.type === "Orthographic" }), _jsx(ControlsWrapper, { ...orbitContolsProps, setControls: (c) => {
|
|
107
|
+
setControls(c);
|
|
108
|
+
} }), (() => {
|
|
94
109
|
switch (controlsHelper?.type) {
|
|
95
110
|
case "Viewcube":
|
|
96
|
-
return (_jsx(GizmoHelper, { ...controlsHelper.props, onTarget: () =>
|
|
111
|
+
return (_jsx(GizmoHelper, { ...controlsHelper.props, onTarget: () => {
|
|
112
|
+
if (controlsHelper.viewcubeProps.resetZoomAndPanOnClick) {
|
|
113
|
+
resetZoomOnGizmoClick();
|
|
114
|
+
}
|
|
115
|
+
return controls?.target;
|
|
116
|
+
}, onUpdate: () => controls?.update?.(), children: _jsx(GizmoViewcube, { ...controlsHelper.viewcubeProps }) }));
|
|
97
117
|
case "Viewport":
|
|
98
|
-
return (_jsx(GizmoHelper, { ...controlsHelper.props, onTarget: () =>
|
|
118
|
+
return (_jsx(GizmoHelper, { ...controlsHelper.props, onTarget: () => {
|
|
119
|
+
if (controlsHelper.viewportProps.resetZoomAndPanOnClick) {
|
|
120
|
+
resetZoomOnGizmoClick();
|
|
121
|
+
}
|
|
122
|
+
return controls?.target;
|
|
123
|
+
}, onUpdate: () => controls?.update?.(), children: _jsx(GizmoViewport, { ...controlsHelper.viewportProps }) }));
|
|
99
124
|
case undefined:
|
|
100
125
|
default:
|
|
101
|
-
return
|
|
126
|
+
return null;
|
|
102
127
|
}
|
|
103
128
|
})()] }));
|
|
104
129
|
}
|
|
105
130
|
const ControlsWrapper = (props) => {
|
|
106
|
-
const ref = useRef(
|
|
131
|
+
const ref = useRef(null);
|
|
107
132
|
useLayoutEffect(() => {
|
|
108
133
|
if (!ref.current) {
|
|
109
134
|
return;
|
|
110
135
|
}
|
|
111
136
|
props.setControls(ref.current);
|
|
112
|
-
}
|
|
137
|
+
});
|
|
113
138
|
return _jsx(OrbitControls, { ...props, makeDefault: true, ref: ref });
|
|
114
139
|
};
|
|
115
140
|
export const cameraDist = (size, fov) => size.z * 0.5 + (size.x > size.y ? size.x : size.y) / (1 / 2 / Math.tan((Math.PI * fov) / 180 / 2));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-camera.js","sourceRoot":"","sources":["../../../src/renderers/react/react-camera.tsx"],"names":[],"mappings":";AAAA,uDAAuD;AACvD,sDAAsD;AACtD,OAAc,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjE,OAAO,EAEL,iBAAiB,EACjB,kBAAkB,EAElB,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,GACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAmB,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"react-camera.js","sourceRoot":"","sources":["../../../src/renderers/react/react-camera.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "abstract-3d",
|
|
3
|
-
"version": "2.1
|
|
3
|
+
"version": "2.2.1",
|
|
4
4
|
"description": "Abstract 3D",
|
|
5
5
|
"author": "Divid AB <info@divid.se>",
|
|
6
6
|
"repository": "https://github.com/dividab/abstract-visuals/tree/master/packages/abstract-3d",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"@react-three/drei": "^10.7.7",
|
|
52
52
|
"@react-three/fiber": "^9.6.1",
|
|
53
53
|
"@react-three/postprocessing": "^3.0.4",
|
|
54
|
-
"abstract-image": "^13.0.
|
|
54
|
+
"abstract-image": "^13.0.41",
|
|
55
55
|
"suspend-react": "^0.1.3",
|
|
56
56
|
"three": "^0.184.0",
|
|
57
57
|
"ts-exhaustive-check": "^1.0.0"
|
|
@@ -65,5 +65,5 @@
|
|
|
65
65
|
"@types/three": "^0.180.0",
|
|
66
66
|
"react": "^19.2.6"
|
|
67
67
|
},
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "2e65bbc8098e527332bb56c4607b1ec161ca721a"
|
|
69
69
|
}
|
|
@@ -13,7 +13,7 @@ import {
|
|
|
13
13
|
} from "@react-three/drei";
|
|
14
14
|
import { type ThreeEvent, useThree } from "@react-three/fiber";
|
|
15
15
|
import { exhaustiveCheck } from "ts-exhaustive-check";
|
|
16
|
-
import
|
|
16
|
+
import { Vector3 } from "three";
|
|
17
17
|
import { View, Scene, Vec3, vec3 } from "../../abstract-3d.js";
|
|
18
18
|
|
|
19
19
|
export type Camera = A3dPerspectiveCamera | A3dOrthographicCamera;
|
|
@@ -49,7 +49,26 @@ export function ReactCamera({
|
|
|
49
49
|
const [controls, setControls] = useState<any | null>(null);
|
|
50
50
|
const perspectiveRef = useRef<any | undefined>(undefined);
|
|
51
51
|
const orthographicRef = useRef<any | undefined>(undefined);
|
|
52
|
+
|
|
53
|
+
const initialDistRef = useRef<number | null>(null);
|
|
54
|
+
const initialTargetRef = useRef(new Vector3());
|
|
55
|
+
|
|
52
56
|
const viewPortAspect = useThree(({ viewport: { aspect } }) => aspect);
|
|
57
|
+
const { invalidate } = useThree();
|
|
58
|
+
|
|
59
|
+
const resetZoomOnGizmoClick = (): void => {
|
|
60
|
+
if (!controls || initialDistRef.current == null || !perspectiveRef.current) return;
|
|
61
|
+
|
|
62
|
+
const camera = perspectiveRef.current;
|
|
63
|
+
const target = initialTargetRef.current.clone();
|
|
64
|
+
controls.target.copy(target);
|
|
65
|
+
const dist = initialDistRef.current;
|
|
66
|
+
const dir = camera.position.clone().sub(target).normalize();
|
|
67
|
+
camera.position.copy(target.clone().add(dir.multiplyScalar(dist)));
|
|
68
|
+
|
|
69
|
+
controls.update();
|
|
70
|
+
invalidate();
|
|
71
|
+
};
|
|
53
72
|
|
|
54
73
|
useLayoutEffect(() => {
|
|
55
74
|
const [posX, posY, posZ, size, sceneAspect] = (() => {
|
|
@@ -96,24 +115,21 @@ export function ReactCamera({
|
|
|
96
115
|
})();
|
|
97
116
|
|
|
98
117
|
const dist = cameraDist(size, camera.type === "Perspective" ? camera.fov ?? 45 : 45);
|
|
118
|
+
initialDistRef.current = dist;
|
|
99
119
|
|
|
100
120
|
if (camera.type === "Orthographic" && orthographicRef.current) {
|
|
101
121
|
const [left, right, top, bottom] =
|
|
102
122
|
sceneAspect > viewPortAspect
|
|
103
123
|
? [-size.x / 2, size.x / 2, size.x / 2 / viewPortAspect, -size.x / 2 / viewPortAspect]
|
|
104
124
|
: [(-viewPortAspect * size.y) / 2, (viewPortAspect * size.y) / 2, size.y / 2, -size.y / 2];
|
|
105
|
-
orthographicRef.current.position.
|
|
106
|
-
orthographicRef.current.position.setY(posY * dist);
|
|
107
|
-
orthographicRef.current.position.setZ(posZ * dist);
|
|
125
|
+
orthographicRef.current.position.set(posX * dist, posY * dist, posZ * dist);
|
|
108
126
|
orthographicRef.current.left = left;
|
|
109
127
|
orthographicRef.current.right = right;
|
|
110
128
|
orthographicRef.current.bottom = bottom;
|
|
111
129
|
orthographicRef.current.top = top;
|
|
112
130
|
orthographicRef.current.updateProjectionMatrix();
|
|
113
131
|
} else if (camera.type === "Perspective" && perspectiveRef.current) {
|
|
114
|
-
perspectiveRef.current.position.
|
|
115
|
-
perspectiveRef.current.position.setY(posY * dist);
|
|
116
|
-
perspectiveRef.current.position.setZ(posZ * dist);
|
|
132
|
+
perspectiveRef.current.position.set(posX * dist, posY * dist, posZ * dist);
|
|
117
133
|
perspectiveRef.current.updateProjectionMatrix();
|
|
118
134
|
}
|
|
119
135
|
}, [camera, viewPortAspect]);
|
|
@@ -152,32 +168,49 @@ export function ReactCamera({
|
|
|
152
168
|
manual={true}
|
|
153
169
|
makeDefault={camera.type === "Orthographic"}
|
|
154
170
|
/>
|
|
155
|
-
|
|
171
|
+
|
|
172
|
+
<ControlsWrapper
|
|
173
|
+
{...orbitContolsProps}
|
|
174
|
+
setControls={(c) => {
|
|
175
|
+
setControls(c);
|
|
176
|
+
}}
|
|
177
|
+
/>
|
|
178
|
+
|
|
156
179
|
{(() => {
|
|
157
180
|
switch (controlsHelper?.type) {
|
|
158
181
|
case "Viewcube":
|
|
159
182
|
return (
|
|
160
183
|
<GizmoHelper
|
|
161
184
|
{...controlsHelper.props}
|
|
162
|
-
onTarget={() =>
|
|
185
|
+
onTarget={() => {
|
|
186
|
+
if (controlsHelper.viewcubeProps.resetZoomAndPanOnClick) {
|
|
187
|
+
resetZoomOnGizmoClick();
|
|
188
|
+
}
|
|
189
|
+
return controls?.target as Vector3;
|
|
190
|
+
}}
|
|
163
191
|
onUpdate={() => controls?.update?.()}
|
|
164
192
|
>
|
|
165
|
-
<GizmoViewcube {...
|
|
193
|
+
<GizmoViewcube {...controlsHelper.viewcubeProps} />
|
|
166
194
|
</GizmoHelper>
|
|
167
195
|
);
|
|
168
196
|
case "Viewport":
|
|
169
197
|
return (
|
|
170
198
|
<GizmoHelper
|
|
171
199
|
{...controlsHelper.props}
|
|
172
|
-
onTarget={() =>
|
|
200
|
+
onTarget={() => {
|
|
201
|
+
if (controlsHelper.viewportProps.resetZoomAndPanOnClick) {
|
|
202
|
+
resetZoomOnGizmoClick();
|
|
203
|
+
}
|
|
204
|
+
return controls?.target as Vector3;
|
|
205
|
+
}}
|
|
173
206
|
onUpdate={() => controls?.update?.()}
|
|
174
207
|
>
|
|
175
|
-
<GizmoViewport {...
|
|
208
|
+
<GizmoViewport {...controlsHelper.viewportProps} />
|
|
176
209
|
</GizmoHelper>
|
|
177
210
|
);
|
|
178
211
|
case undefined:
|
|
179
212
|
default:
|
|
180
|
-
return
|
|
213
|
+
return null;
|
|
181
214
|
}
|
|
182
215
|
})()}
|
|
183
216
|
</>
|
|
@@ -185,23 +218,24 @@ export function ReactCamera({
|
|
|
185
218
|
}
|
|
186
219
|
|
|
187
220
|
const ControlsWrapper = (
|
|
188
|
-
props: OrbitControlsProps & {
|
|
221
|
+
props: OrbitControlsProps & {
|
|
222
|
+
setControls: (controls: any) => void;
|
|
223
|
+
}
|
|
189
224
|
): React.JSX.Element => {
|
|
190
|
-
const ref = useRef<any>(
|
|
225
|
+
const ref = useRef<any>(null);
|
|
191
226
|
|
|
192
227
|
useLayoutEffect(() => {
|
|
193
228
|
if (!ref.current) {
|
|
194
229
|
return;
|
|
195
230
|
}
|
|
196
231
|
props.setControls(ref.current);
|
|
197
|
-
}
|
|
232
|
+
});
|
|
198
233
|
return <OrbitControls {...props} makeDefault ref={ref} />;
|
|
199
234
|
};
|
|
200
|
-
|
|
201
235
|
type GizmoViewportProps = React.JSX.IntrinsicElements["group"] & {
|
|
202
|
-
readonly axisColors?:
|
|
203
|
-
readonly axisScale?:
|
|
204
|
-
readonly labels?:
|
|
236
|
+
readonly axisColors?: [string, string, string];
|
|
237
|
+
readonly axisScale?: [number, number, number];
|
|
238
|
+
readonly labels?: [string, string, string];
|
|
205
239
|
readonly axisHeadScale?: number;
|
|
206
240
|
readonly labelColor?: string;
|
|
207
241
|
readonly hideNegativeAxes?: boolean;
|
|
@@ -209,6 +243,7 @@ type GizmoViewportProps = React.JSX.IntrinsicElements["group"] & {
|
|
|
209
243
|
readonly disabled?: boolean;
|
|
210
244
|
readonly font?: string;
|
|
211
245
|
readonly onClick?: (e: ThreeEvent<MouseEvent>) => null;
|
|
246
|
+
readonly resetZoomAndPanOnClick?: boolean;
|
|
212
247
|
};
|
|
213
248
|
|
|
214
249
|
type GenericProps = {
|
|
@@ -219,7 +254,8 @@ type GenericProps = {
|
|
|
219
254
|
readonly textColor?: string;
|
|
220
255
|
readonly strokeColor?: string;
|
|
221
256
|
readonly onClick?: (e: ThreeEvent<MouseEvent>) => null;
|
|
222
|
-
readonly faces?:
|
|
257
|
+
readonly faces?: Array<string>;
|
|
258
|
+
readonly resetZoomAndPanOnClick?: boolean;
|
|
223
259
|
};
|
|
224
260
|
|
|
225
261
|
export const cameraDist = (size: Vec3, fov: number): number =>
|
package/src/.DS_Store
DELETED
|
Binary file
|
package/src/renderers/.DS_Store
DELETED
|
Binary file
|