flow like the river

VISUALIZACION/node_modules/three-render-objects/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Vasco Asturiano
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

VISUALIZACION/node_modules/three-render-objects/README.md

@@ -0,0 +1,109 @@
+three-render-objects
+====================
+
+[![NPM package][npm-img]][npm-url]
+[![Build Size][build-size-img]][build-size-url]
+[![NPM Downloads][npm-downloads-img]][npm-downloads-url]
+
+This module offers a convenient way to render [ThreeJS](https://threejs.org/) objects onto a WebGL canvas, with built-in interaction capabilities:
+* hover/click events
+* tooltips
+* camera movement with animated transitions
+* trackball, orbit or fly controls
+
+All the renderer/scene/camera scaffolding is already included and any instance of [Object3D](https://threejs.org/docs/#api/core/Object3D) can be rendered with minimal setup. 
+
+## Quick start
+
+```js
+import ThreeRenderObjects from 'three-render-objects';
+```
+or using a *script* tag
+```html
+<script src="//unpkg.com/three-render-objects"></script>
+```
+then
+```js
+const myCanvas = ThreeRenderObjects();
+myCanvas(<myDOMElement>)
+  .objects(<myData>);
+```
+
+## API reference
+
+### Initialisation
+```js
+ThreeRenderObjects({ configOptions })(<domElement>)
+```
+
+| Config options | Description | Default |
+| --- | --- | :--: |
+| <b>controlType</b>: <i>str</i> | Which type of control to use to control the camera. Choice between [trackball](https://threejs.org/examples/misc_controls_trackball.html), [orbit](https://threejs.org/examples/#misc_controls_orbit) or [fly](https://threejs.org/examples/misc_controls_fly.html). | `trackball` |
+| <b>rendererConfig</b>: <i>object</i> | Configuration parameters to pass to the [ThreeJS WebGLRenderer](https://threejs.org/docs/#api/en/renderers/WebGLRenderer) constructor. | `{ antialias: true, alpha: true }` |
+| <b>extraRenderers</b>: <i>array</i> | If you wish to include objects that require a dedicated renderer besides `WebGL`, such as [CSS3DRenderer](https://threejs.org/docs/#examples/en/renderers/CSS3DRenderer), include in this array those extra renderer instances. | `[]` |
+| <b>waitForLoadComplete</b>: <i>boolean</i> | Whether to wait until all the asynchronous loading operations are finished (such as the background image) before rendering the objects in the scene for the first time. | `true` |
+
+### Data input
+
+| Method | Description | Default |
+| --- | --- | :--: |
+| <b>objects</b>([<i>array</i>]) | Getter/setter for the list of objects to render. Each object should be an instance of [Object3D](https://threejs.org/docs/#api/core/Object3D). | `[]` |
+| <b>lights</b>([<i>array</i>]) | Getter/setter for the list of lights to use in the scene. Each item should be an instance of [Light](https://threejs.org/docs/#api/en/lights/Light). | `[]` |
+
+### Container layout
+
+| Method | Description | Default |
+| --- | --- | :--: |
+| <b>width</b>([<i>px</i>]) | Getter/setter for the canvas width. | *&lt;window width&gt;* |
+| <b>height</b>([<i>px</i>]) | Getter/setter for the canvas height. | *&lt;window height&gt;* |
+| <b>skyRadius</b>([<i>number</i>]) | Radius of the sphere that bounds the scene, in GL units. | 50000 |
+| <b>backgroundColor</b>([<i>str</i>]) | Getter/setter for the canvas background color. | `#000011` |
+| <b>backgroundImageUrl</b>([<i>url</i>]) | Getter/setter for the URL of the image to be used as scene background. If no image is provided, the background color is shown instead. | `null` |
+| <b>onBackgroundImageLoaded</b>([<i>fn</i>]) | Callback function triggered when the background image has finished loading asynchronously and is rendered on the scene. ||
+| <b>showNavInfo</b>([<i>boolean</i>]) | Getter/setter for whether to show the navigation controls footer info. | `true` |
+
+### Render control
+
+| Method | Description | Default |
+| --- | --- | :--: |
+| <b>tick() | Re-render all the objects on the canvas. Essentially this method should be called at every frame, and can be used to control the animation ticks. ||
+| <b>cameraPosition</b>([<i>{x,y,z}</i>], [<i>lookAt</i>], [<i>ms</i>]) | Getter/setter for the camera position, in terms of `x`, `y`, `z` coordinates. Each of the coordinates is optional, allowing for motion in just some dimensions. The optional second argument can be used to define the direction that the camera should aim at, in terms of an `{x,y,z}` point in the 3D space at the distance of `1000` away from the camera. The 3rd optional argument defines the duration of the transition (in <i>ms</i>) to animate the camera motion. A value of `0` (default) moves the camera immediately to the final position. | By default the camera will face the center of the graph at a `z` distance of `1000`. |
+| <b>zoomToFit</b>([<i>ms</i>], [<i>px</i>], [<i>objFilterFn</i>]) | Automatically moves the camera so that all of the objects in the scene become visible within its field of view, while aiming at the scene center (0,0,0). If no objects are found no action is taken. It accepts three optional arguments: the first defines the duration of the transition (in ms) to animate the camera motion (default: 0ms). The second argument is the amount of padding (in px) between the edge of the canvas and the outermost object position (default: 10px). The third argument specifies a custom object filter: `obj => <boolean>`, which should return a truthy value if the object is to be included. This can be useful for focusing on a portion of the scene. | `(0, 10, obj => true)` |
+| <b>fitToBbox</b>(<i>bbox</i>, [<i>ms</i>], [<i>px</i>], [<i>objFilterFn</i>]) | Automatically moves the camera to fit the specified bounding box within its field of view, while aiming at the scene center (0,0,0). The bounding box should follow the syntax `{ x: [<num>, <num>], y: [<num>, <num>], z: [<num>, <num>] }`. If no bounding box is specified no action is taken. It accepts two optional arguments: the first defines the duration of the transition (in ms) to animate the camera motion (default: 0ms). The second argument is the amount of padding (in px) between the edge of the canvas and the outermost object position (default: 10px). | `(0, 10)` |
+| <b>postProcessingComposer</b>() | Access the [post-processing composer](https://threejs.org/docs/#examples/en/postprocessing/EffectComposer). Use this to add post-processing [rendering effects](https://github.com/mrdoob/three.js/tree/dev/examples/jsm/postprocessing) to the scene. By default the composer has a single pass ([RenderPass](https://github.com/mrdoob/three.js/blob/dev/examples/jsm/postprocessing/RenderPass.js)) that directly renders the scene without any effects. || 
+| <b>renderer</b>() | Access the [WebGL renderer](https://threejs.org/docs/#api/renderers/WebGLRenderer) object. || 
+| <b>camera</b>() | Access the [perspective camera](https://threejs.org/docs/#api/cameras/PerspectiveCamera) object. || 
+| <b>scene</b>() | Access the [Scene](https://threejs.org/docs/#api/scenes/Scene) object. ||
+| <b>controls</b>() | Access the camera controls object. ||
+
+### Interaction
+
+| Method | Description | Default |
+| --- | --- | :--: |
+| <b>onClick</b>(<i>fn</i>) | Callback function for object clicks with left mouse button. The object (or `null` if there's no object under the mouse line of sight), the event object and the coordinates of the intersecting point in the object's surface are included as arguments `onClick(object, event, { x, y, z })`. | - |
+| <b>onRightClick</b>(<i>fn</i>) | Callback function for object right-clicks. The object (or `null` if there's no object under the mouse line of sight), the event object and the coordinates of the intersecting point in the object's surface are included as arguments `onRightClick(object, event, { x, y, z })`. | - |
+| <b>onHover</b>(<i>fn</i>) | Callback function for object mouse over events. The object (or `null` if there's no object under the mouse line of sight) is included as the first argument, and the previous hovered object (or `null`) as second argument: `onHover(obj, prevObj)`. | - |
+| <b>hoverOrderComparator</b>([<i>fn</i>]) | Getter/setter for the comparator function to use when hovering over multiple objects under the same line of sight. This function can be used to prioritize hovering some objects over others. | By default, hovering priority is based solely on camera proximity (closest object wins). |
+| <b>hoverFilter</b>([<i>fn</i>]) | Getter/setter for the filter function that defines whether an object is eligible for hovering and other interactions. This function receives an object as sole argument and should return a `boolean` value | `() => true` |
+| <b>lineHoverPrecision</b>([<i>int</i>]) | Getter/setter for the precision to use when detecting hover events over [Line](https://threejs.org/docs/#api/objects/Line) objects. | 1 |
+| <b>tooltipContent</b>([<i>str</i> or <i>fn</i>]) | Object accessor function or attribute for label (shown in tooltip). Supports plain text or HTML content. ||
+| <b>enablePointerInteraction([<i>boolean</i>]) | Getter/setter for whether to enable the mouse tracking events. This activates an internal tracker of the canvas mouse position and enables the functionality of object hover/click and tooltip labels, at the cost of performance. If you're looking for maximum gain in your render performance it's recommended to switch off this property. | `true` |
+| <b>hoverDuringDrag([<i>boolean</i>]) | Getter/setter for whether to trigger hover events while using the controls via pointer dragging.| `false` |
+| <b>clickAfterDrag([<i>boolean</i>]) | Getter/setter for whether to trigger a click event after dragging using the controls.| `false` |
+| <b>getPointerPos() | Getter for the current position of the pointer relative to the viewport, in `{ x, y }` px coordinates. ||
+
+###  Utility
+
+| Method | Description |
+| --- | --- |
+| <b>getBbox</b>([<i>objFilterFn</i>]) | Returns the current bounding box of the objects in the scene, formatted as `{ x: [<num>, <num>], y: [<num>, <num>], z: [<num>, <num>] }`. If no objects are found, returns `null`. Accepts an optional argument to define a custom object filter: `object => <boolean>`, which should return a truthy value if the object is to be included. This can be useful to calculate the bounding box of a portion of the scene.  |
+| <b>getScreenCoords</b>(<i>x</i>, <i>y</i>, <i>z</i>) | Utility method to translate 3D coordinates to the viewport domain. Given a set of `x`,`y`,`z` coordinates, returns the current equivalent `{x, y}` in viewport coordinates. |
+| <b>getSceneCoords</b>(<i>x</i>, <i>y</i>, <i>distance</i>) | Utility method to translate viewport distance coordinates to the scene 3D domain. Given a set of `x`,`y` viewport coordinates and distance from the camera, returns the current equivalent `{x, y, z}` in 3D scene coordinates. If no distance is provided, defaults to `0`. |
+| <b>intersectingObjects</b>(<i>x</i>, <i>y</i>) | Utility method to retrieve the list of objects under the line of sight of the given viewport coordinates. Returns an array of [intersectObject](https://threejs.org/docs/#api/en/core/Raycaster.intersectObject), sorted by distance (from closest to farthest). |
+
+[npm-img]: https://img.shields.io/npm/v/three-render-objects
+[npm-url]: https://npmjs.org/package/three-render-objects
+[build-size-img]: https://img.shields.io/bundlephobia/minzip/three-render-objects
+[build-size-url]: https://bundlephobia.com/result?p=three-render-objects
+[npm-downloads-img]: https://img.shields.io/npm/dt/three-render-objects
+[npm-downloads-url]: https://www.npmtrends.com/three-render-objects

VISUALIZACION/node_modules/three-render-objects/dist/three-render-objects.d.ts

@@ -0,0 +1,89 @@
+import { WebGLRendererParameters, Renderer, Object3D, Light, WebGLRenderer, Scene, Camera, Intersection } from 'three';
+import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls.js';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
+import { FlyControls } from 'three/examples/jsm/controls/FlyControls.js';
+import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
+
+interface ConfigOptions {
+  controlType?: 'trackball' | 'orbit' | 'fly';
+  rendererConfig?: WebGLRendererParameters;
+  extraRenderers?: Renderer[];
+  waitForLoadComplete?: boolean;
+}
+
+type Accessor<In, Out> = Out | string | ((obj: In) => Out);
+type Obj3DAccessor<T> = Accessor<Object3D, T>;
+
+type Coords = { x: number; y: number; z: number; };
+
+type Obj3DCompFn = (a: Object3D, b: Object3D) => number;
+
+interface ThreeRenderObjectsGenericInstance<ChainableInstance> {
+  (element: HTMLElement): ChainableInstance;
+  resetProps(): ChainableInstance;
+
+  // Data input
+  objects(): Object3D[];
+  objects(objs: Object3D[]): ChainableInstance;
+  lights(): Light[];
+  lights(lights: Light[]): ChainableInstance;
+
+  // Container layout
+  width(): number;
+  width(width: number): ChainableInstance;
+  height(): number;
+  height(height: number): ChainableInstance;
+  skyRadius(): number;
+  skyRadius(glUnits: number): ChainableInstance;
+  backgroundColor(): string;
+  backgroundColor(color: string): ChainableInstance;
+  backgroundImageUrl(): string | null;
+  backgroundImageUrl(url: string | null): ChainableInstance;
+  onBackgroundImageLoaded(callback: () => void): ChainableInstance;
+  showNavInfo(): boolean;
+  showNavInfo(enabled: boolean): ChainableInstance;
+
+  // Render control
+  tick(): ChainableInstance;
+  cameraPosition(): Coords;
+  cameraPosition(position: Partial<Coords>, lookAt?: Coords, transitionMs?: number): ChainableInstance;
+  zoomToFit(durationMs?: number, padding?: number, objFilter?: (obj: Object3D) => boolean): ChainableInstance;
+  fitToBbox(bbox: { x: [number, number], y: [number, number], z: [number, number] }, durationMs?: number, padding?: number): ChainableInstance;
+  postProcessingComposer(): EffectComposer;
+  renderer(): WebGLRenderer;
+  scene(): Scene;
+  camera(): Camera;
+  controls(): TrackballControls | OrbitControls | FlyControls;
+
+  // Interaction
+  onClick(callback: (obj: object | null, event: MouseEvent, intersectionPoint: { x: number, y: number, z: number }) => void): ChainableInstance;
+  onRightClick(callback: (obj: object | null, event: MouseEvent, intersectionPoint: { x: number, y: number, z: number }) => void): ChainableInstance;
+  onHover(callback: (obj: object | null, previousObj: object | null) => void): ChainableInstance;
+  hoverOrderComparator(): Obj3DCompFn;
+  hoverOrderComparator(compFn: Obj3DCompFn): ChainableInstance;
+  hoverFilter(): (obj: Object3D) => boolean;
+  hoverFilter(filterFn: (obj: Object3D) => boolean): ChainableInstance;
+  lineHoverPrecision(): number;
+  lineHoverPrecision(precision: number): ChainableInstance;
+  tooltipContent(): Obj3DAccessor<string>;
+  tooltipContent(contentAccessor: Obj3DAccessor<string>): ChainableInstance;
+  enablePointerInteraction(): boolean;
+  enablePointerInteraction(enable: boolean): ChainableInstance;
+  hoverDuringDrag(): boolean;
+  hoverDuringDrag(enabled: boolean): ChainableInstance;
+  clickAfterDrag(): boolean;
+  clickAfterDrag(enabled: boolean): ChainableInstance;
+  getPointerPos(): { x: number, y: number };
+
+  // Utility
+  getBbox(objFilter?: (obj: Object3D) => boolean): { x: [number, number], y: [number, number], z: [number, number] };
+  getScreenCoords(x: number, y: number, z: number): { x: number, y: number; };
+  getSceneCoords(x: number, y: number, distance: number): { x: number, y: number, z: number };
+  intersectingObjects(x: number, y: number): Intersection[];
+}
+
+type ThreeRenderObjectsInstance = ThreeRenderObjectsGenericInstance<ThreeRenderObjectsInstance>;
+
+declare function ThreeRenderObjects(configOptions?: ConfigOptions): ThreeRenderObjectsInstance;
+
+export { type ConfigOptions, type ThreeRenderObjectsGenericInstance, type ThreeRenderObjectsInstance, ThreeRenderObjects as default };

VISUALIZACION/node_modules/three-render-objects/dist/three-render-objects.mjs

@@ -0,0 +1,654 @@
+import { WebGLRenderer, Scene, PerspectiveCamera, Raycaster, SRGBColorSpace, TextureLoader, Vector2, Vector3, Box3, Color, Mesh, SphereGeometry, MeshBasicMaterial, BackSide, EventDispatcher, MOUSE, Quaternion, Spherical, Clock } from 'three';
+import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls.js';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
+import { FlyControls } from 'three/examples/jsm/controls/FlyControls.js';
+import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
+import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js';
+import { parseToRgb, opacify } from 'polished';
+import * as TWEEN from '@tweenjs/tween.js';
+import accessorFn from 'accessor-fn';
+import Kapsule from 'kapsule';
+
+function styleInject(css, ref) {
+  ref = {};
+  ref.insertAt;
+  if (typeof document === 'undefined') {
+    return;
+  }
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+  {
+    head.appendChild(style);
+  }
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z = ".scene-nav-info {\n  bottom: 5px;\n  width: 100%;\n  text-align: center;\n  color: slategrey;\n  opacity: 0.7;\n  font-size: 10px;\n}\n\n.scene-tooltip {\n  top: 0;\n  color: lavender;\n  font-size: 15px;\n}\n\n.scene-nav-info, .scene-tooltip {\n  position: absolute;\n  font-family: sans-serif;\n  pointer-events: none;\n  user-select: none;\n}\n\n.scene-container canvas:focus {\n  outline: none;\n}";
+styleInject(css_248z);
+
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) ; else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r );
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (String )(t);
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+var three = window.THREE ? window.THREE // Prefer consumption from global THREE, if exists
+: {
+  WebGLRenderer: WebGLRenderer,
+  Scene: Scene,
+  PerspectiveCamera: PerspectiveCamera,
+  Raycaster: Raycaster,
+  SRGBColorSpace: SRGBColorSpace,
+  TextureLoader: TextureLoader,
+  Vector2: Vector2,
+  Vector3: Vector3,
+  Box3: Box3,
+  Color: Color,
+  Mesh: Mesh,
+  SphereGeometry: SphereGeometry,
+  MeshBasicMaterial: MeshBasicMaterial,
+  BackSide: BackSide,
+  EventDispatcher: EventDispatcher,
+  MOUSE: MOUSE,
+  Quaternion: Quaternion,
+  Spherical: Spherical,
+  Clock: Clock
+};
+var threeRenderObjects = Kapsule({
+  props: {
+    width: {
+      "default": window.innerWidth,
+      onChange: function onChange(width, state, prevWidth) {
+        isNaN(width) && (state.width = prevWidth);
+      }
+    },
+    height: {
+      "default": window.innerHeight,
+      onChange: function onChange(height, state, prevHeight) {
+        isNaN(height) && (state.height = prevHeight);
+      }
+    },
+    backgroundColor: {
+      "default": '#000011'
+    },
+    backgroundImageUrl: {},
+    onBackgroundImageLoaded: {},
+    showNavInfo: {
+      "default": true
+    },
+    skyRadius: {
+      "default": 50000
+    },
+    objects: {
+      "default": []
+    },
+    lights: {
+      "default": []
+    },
+    enablePointerInteraction: {
+      "default": true,
+      onChange: function onChange(_, state) {
+        // Reset hover state
+        state.hoverObj = null;
+        if (state.toolTipElem) state.toolTipElem.innerHTML = '';
+      },
+      triggerUpdate: false
+    },
+    lineHoverPrecision: {
+      "default": 1,
+      triggerUpdate: false
+    },
+    hoverOrderComparator: {
+      "default": function _default() {
+        return -1;
+      },
+      triggerUpdate: false
+    },
+    // keep existing order by default
+    hoverFilter: {
+      "default": function _default() {
+        return true;
+      },
+      triggerUpdate: false
+    },
+    // exclude objects from interaction
+    tooltipContent: {
+      triggerUpdate: false
+    },
+    hoverDuringDrag: {
+      "default": false,
+      triggerUpdate: false
+    },
+    clickAfterDrag: {
+      "default": false,
+      triggerUpdate: false
+    },
+    onHover: {
+      "default": function _default() {},
+      triggerUpdate: false
+    },
+    onClick: {
+      "default": function _default() {},
+      triggerUpdate: false
+    },
+    onRightClick: {
+      triggerUpdate: false
+    }
+  },
+  methods: {
+    tick: function tick(state) {
+      if (state.initialised) {
+        state.controls.update && state.controls.update(Math.min(1, state.clock.getDelta())); // timedelta is required for fly controls
+
+        state.postProcessingComposer ? state.postProcessingComposer.render() // if using postprocessing, switch the output to it
+        : state.renderer.render(state.scene, state.camera);
+        state.extraRenderers.forEach(function (r) {
+          return r.render(state.scene, state.camera);
+        });
+        if (state.enablePointerInteraction) {
+          // Update tooltip and trigger onHover events
+          var topObject = null;
+          if (state.hoverDuringDrag || !state.isPointerDragging) {
+            var intersects = this.intersectingObjects(state.pointerPos.x, state.pointerPos.y).filter(function (d) {
+              return state.hoverFilter(d.object);
+            }).sort(function (a, b) {
+              return state.hoverOrderComparator(a.object, b.object);
+            });
+            var topIntersect = intersects.length ? intersects[0] : null;
+            topObject = topIntersect ? topIntersect.object : null;
+            state.intersectionPoint = topIntersect ? topIntersect.point : null;
+          }
+          if (topObject !== state.hoverObj) {
+            state.onHover(topObject, state.hoverObj);
+            state.toolTipElem.innerHTML = topObject ? accessorFn(state.tooltipContent)(topObject) || '' : '';
+            state.hoverObj = topObject;
+          }
+        }
+        TWEEN.update(); // update camera animation tweens
+      }
+      return this;
+    },
+    getPointerPos: function getPointerPos(state) {
+      var _state$pointerPos = state.pointerPos,
+        x = _state$pointerPos.x,
+        y = _state$pointerPos.y;
+      return {
+        x: x,
+        y: y
+      };
+    },
+    cameraPosition: function cameraPosition(state, position, lookAt, transitionDuration) {
+      var camera = state.camera;
+
+      // Setter
+      if (position && state.initialised) {
+        var finalPos = position;
+        var finalLookAt = lookAt || {
+          x: 0,
+          y: 0,
+          z: 0
+        };
+        if (!transitionDuration) {
+          // no animation
+          setCameraPos(finalPos);
+          setLookAt(finalLookAt);
+        } else {
+          var camPos = Object.assign({}, camera.position);
+          var camLookAt = getLookAt();
+          new TWEEN.Tween(camPos).to(finalPos, transitionDuration).easing(TWEEN.Easing.Quadratic.Out).onUpdate(setCameraPos).start();
+
+          // Face direction in 1/3rd of time
+          new TWEEN.Tween(camLookAt).to(finalLookAt, transitionDuration / 3).easing(TWEEN.Easing.Quadratic.Out).onUpdate(setLookAt).start();
+        }
+        return this;
+      }
+
+      // Getter
+      return Object.assign({}, camera.position, {
+        lookAt: getLookAt()
+      });
+
+      //
+
+      function setCameraPos(pos) {
+        var x = pos.x,
+          y = pos.y,
+          z = pos.z;
+        if (x !== undefined) camera.position.x = x;
+        if (y !== undefined) camera.position.y = y;
+        if (z !== undefined) camera.position.z = z;
+      }
+      function setLookAt(lookAt) {
+        var lookAtVect = new three.Vector3(lookAt.x, lookAt.y, lookAt.z);
+        if (state.controls.target) {
+          state.controls.target = lookAtVect;
+        } else {
+          // Fly controls doesn't have target attribute
+          camera.lookAt(lookAtVect); // note: lookAt may be overridden by other controls in some cases
+        }
+      }
+      function getLookAt() {
+        return Object.assign(new three.Vector3(0, 0, -1000).applyQuaternion(camera.quaternion).add(camera.position));
+      }
+    },
+    zoomToFit: function zoomToFit(state) {
+      var transitionDuration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+      var padding = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 10;
+      for (var _len = arguments.length, bboxArgs = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+        bboxArgs[_key - 3] = arguments[_key];
+      }
+      return this.fitToBbox(this.getBbox.apply(this, bboxArgs), transitionDuration, padding);
+    },
+    fitToBbox: function fitToBbox(state, bbox) {
+      var transitionDuration = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+      var padding = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 10;
+      // based on https://discourse.threejs.org/t/camera-zoom-to-fit-object/936/24
+      var camera = state.camera;
+      if (bbox) {
+        var center = new three.Vector3(0, 0, 0); // reset camera aim to center
+        var maxBoxSide = Math.max.apply(Math, _toConsumableArray(Object.entries(bbox).map(function (_ref) {
+          var _ref2 = _slicedToArray(_ref, 2),
+            coordType = _ref2[0],
+            coords = _ref2[1];
+          return Math.max.apply(Math, _toConsumableArray(coords.map(function (c) {
+            return Math.abs(center[coordType] - c);
+          })));
+        }))) * 2;
+
+        // find distance that fits whole bbox within padded fov
+        var paddedFov = (1 - padding * 2 / state.height) * camera.fov;
+        var fitHeightDistance = maxBoxSide / Math.atan(paddedFov * Math.PI / 180);
+        var fitWidthDistance = fitHeightDistance / camera.aspect;
+        var distance = Math.max(fitHeightDistance, fitWidthDistance);
+        if (distance > 0) {
+          var newCameraPosition = center.clone().sub(camera.position).normalize().multiplyScalar(-distance);
+          this.cameraPosition(newCameraPosition, center, transitionDuration);
+        }
+      }
+      return this;
+    },
+    getBbox: function getBbox(state) {
+      var objFilter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {
+        return true;
+      };
+      var box = new three.Box3(new three.Vector3(0, 0, 0), new three.Vector3(0, 0, 0));
+      var objs = state.objects.filter(objFilter);
+      if (!objs.length) return null;
+      objs.forEach(function (obj) {
+        return box.expandByObject(obj);
+      });
+
+      // extract global x,y,z min/max
+      return Object.assign.apply(Object, _toConsumableArray(['x', 'y', 'z'].map(function (c) {
+        return _defineProperty({}, c, [box.min[c], box.max[c]]);
+      })));
+    },
+    getScreenCoords: function getScreenCoords(state, x, y, z) {
+      var vec = new three.Vector3(x, y, z);
+      vec.project(this.camera()); // project to the camera plane
+      return {
+        // align relative pos to canvas dimensions
+        x: (vec.x + 1) * state.width / 2,
+        y: -(vec.y - 1) * state.height / 2
+      };
+    },
+    getSceneCoords: function getSceneCoords(state, screenX, screenY) {
+      var distance = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 0;
+      var relCoords = new three.Vector2(screenX / state.width * 2 - 1, -(screenY / state.height) * 2 + 1);
+      var raycaster = new three.Raycaster();
+      raycaster.setFromCamera(relCoords, state.camera);
+      return Object.assign({}, raycaster.ray.at(distance, new three.Vector3()));
+    },
+    intersectingObjects: function intersectingObjects(state, x, y) {
+      var relCoords = new three.Vector2(x / state.width * 2 - 1, -(y / state.height) * 2 + 1);
+      var raycaster = new three.Raycaster();
+      raycaster.params.Line.threshold = state.lineHoverPrecision; // set linePrecision
+      raycaster.setFromCamera(relCoords, state.camera);
+      return raycaster.intersectObjects(state.objects, true);
+    },
+    renderer: function renderer(state) {
+      return state.renderer;
+    },
+    scene: function scene(state) {
+      return state.scene;
+    },
+    camera: function camera(state) {
+      return state.camera;
+    },
+    postProcessingComposer: function postProcessingComposer(state) {
+      return state.postProcessingComposer;
+    },
+    controls: function controls(state) {
+      return state.controls;
+    },
+    tbControls: function tbControls(state) {
+      return state.controls;
+    } // to be deprecated
+  },
+  stateInit: function stateInit() {
+    return {
+      scene: new three.Scene(),
+      camera: new three.PerspectiveCamera(),
+      clock: new three.Clock()
+    };
+  },
+  init: function init(domNode, state) {
+    var _ref4 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+      _ref4$controlType = _ref4.controlType,
+      controlType = _ref4$controlType === void 0 ? 'trackball' : _ref4$controlType,
+      _ref4$rendererConfig = _ref4.rendererConfig,
+      rendererConfig = _ref4$rendererConfig === void 0 ? {} : _ref4$rendererConfig,
+      _ref4$extraRenderers = _ref4.extraRenderers,
+      extraRenderers = _ref4$extraRenderers === void 0 ? [] : _ref4$extraRenderers,
+      _ref4$waitForLoadComp = _ref4.waitForLoadComplete,
+      waitForLoadComplete = _ref4$waitForLoadComp === void 0 ? true : _ref4$waitForLoadComp;
+    // Wipe DOM
+    domNode.innerHTML = '';
+
+    // Add relative container
+    domNode.appendChild(state.container = document.createElement('div'));
+    state.container.className = 'scene-container';
+    state.container.style.position = 'relative';
+
+    // Add nav info section
+    state.container.appendChild(state.navInfo = document.createElement('div'));
+    state.navInfo.className = 'scene-nav-info';
+    state.navInfo.textContent = {
+      orbit: 'Left-click: rotate, Mouse-wheel/middle-click: zoom, Right-click: pan',
+      trackball: 'Left-click: rotate, Mouse-wheel/middle-click: zoom, Right-click: pan',
+      fly: 'WASD: move, R|F: up | down, Q|E: roll, up|down: pitch, left|right: yaw'
+    }[controlType] || '';
+    state.navInfo.style.display = state.showNavInfo ? null : 'none';
+
+    // Setup tooltip
+    state.toolTipElem = document.createElement('div');
+    state.toolTipElem.classList.add('scene-tooltip');
+    state.container.appendChild(state.toolTipElem);
+
+    // Capture pointer coords on move or touchstart
+    state.pointerPos = new three.Vector2();
+    state.pointerPos.x = -2; // Initialize off canvas
+    state.pointerPos.y = -2;
+    ['pointermove', 'pointerdown'].forEach(function (evType) {
+      return state.container.addEventListener(evType, function (ev) {
+        // track click state
+        evType === 'pointerdown' && (state.isPointerPressed = true);
+
+        // detect point drag
+        !state.isPointerDragging && ev.type === 'pointermove' && (ev.pressure > 0 || state.isPointerPressed) // ev.pressure always 0 on Safari, so we used the isPointerPressed tracker
+        && (ev.pointerType !== 'touch' || ev.movementX === undefined || [ev.movementX, ev.movementY].some(function (m) {
+          return Math.abs(m) > 1;
+        })) // relax drag trigger sensitivity on touch events
+        && (state.isPointerDragging = true);
+        if (state.enablePointerInteraction) {
+          // update the pointer pos
+          var offset = getOffset(state.container);
+          state.pointerPos.x = ev.pageX - offset.left;
+          state.pointerPos.y = ev.pageY - offset.top;
+
+          // Move tooltip
+          state.toolTipElem.style.top = "".concat(state.pointerPos.y, "px");
+          state.toolTipElem.style.left = "".concat(state.pointerPos.x, "px");
+          // adjust horizontal position to not exceed canvas boundaries
+          state.toolTipElem.style.transform = "translate(-".concat(state.pointerPos.x / state.width * 100, "%, ").concat(
+          // flip to above if near bottom
+          state.height - state.pointerPos.y < 100 ? 'calc(-100% - 8px)' : '21px', ")");
+        }
+        function getOffset(el) {
+          var rect = el.getBoundingClientRect(),
+            scrollLeft = window.pageXOffset || document.documentElement.scrollLeft,
+            scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+          return {
+            top: rect.top + scrollTop,
+            left: rect.left + scrollLeft
+          };
+        }
+      }, {
+        passive: true
+      });
+    });
+
+    // Handle click events on objs
+    state.container.addEventListener('pointerup', function (ev) {
+      state.isPointerPressed = false;
+      if (state.isPointerDragging) {
+        state.isPointerDragging = false;
+        if (!state.clickAfterDrag) return; // don't trigger onClick after pointer drag (camera motion via controls)
+      }
+      requestAnimationFrame(function () {
+        // trigger click events asynchronously, to allow hoverObj to be set (on frame)
+        if (ev.button === 0) {
+          // left-click
+          state.onClick(state.hoverObj || null, ev, state.intersectionPoint); // trigger background clicks with null
+        }
+        if (ev.button === 2 && state.onRightClick) {
+          // right-click
+          state.onRightClick(state.hoverObj || null, ev, state.intersectionPoint);
+        }
+      });
+    }, {
+      passive: true,
+      capture: true
+    }); // use capture phase to prevent propagation blocking from controls (specifically for fly)
+
+    state.container.addEventListener('contextmenu', function (ev) {
+      if (state.onRightClick) ev.preventDefault(); // prevent default contextmenu behavior and allow pointerup to fire instead
+    });
+
+    // Setup renderer, camera and controls
+    state.renderer = new three.WebGLRenderer(Object.assign({
+      antialias: true,
+      alpha: true
+    }, rendererConfig));
+    state.renderer.setPixelRatio(Math.min(2, window.devicePixelRatio)); // clamp device pixel ratio
+    state.container.appendChild(state.renderer.domElement);
+
+    // Setup extra renderers
+    state.extraRenderers = extraRenderers;
+    state.extraRenderers.forEach(function (r) {
+      // overlay them on top of main renderer
+      r.domElement.style.position = 'absolute';
+      r.domElement.style.top = '0px';
+      r.domElement.style.pointerEvents = 'none';
+      state.container.appendChild(r.domElement);
+    });
+
+    // configure post-processing composer
+    state.postProcessingComposer = new EffectComposer(state.renderer);
+    state.postProcessingComposer.addPass(new RenderPass(state.scene, state.camera)); // render scene as first pass
+
+    // configure controls
+    state.controls = new {
+      trackball: TrackballControls,
+      orbit: OrbitControls,
+      fly: FlyControls
+    }[controlType](state.camera, state.renderer.domElement);
+    if (controlType === 'fly') {
+      state.controls.movementSpeed = 300;
+      state.controls.rollSpeed = Math.PI / 6;
+      state.controls.dragToLook = true;
+    }
+    if (controlType === 'trackball' || controlType === 'orbit') {
+      state.controls.minDistance = 0.1;
+      state.controls.maxDistance = state.skyRadius;
+      state.controls.addEventListener('start', function () {
+        state.controlsEngaged = true;
+      });
+      state.controls.addEventListener('change', function () {
+        if (state.controlsEngaged) {
+          state.controlsDragging = true;
+        }
+      });
+      state.controls.addEventListener('end', function () {
+        state.controlsEngaged = false;
+        state.controlsDragging = false;
+      });
+    }
+    [state.renderer, state.postProcessingComposer].concat(_toConsumableArray(state.extraRenderers)).forEach(function (r) {
+      return r.setSize(state.width, state.height);
+    });
+    state.camera.aspect = state.width / state.height;
+    state.camera.updateProjectionMatrix();
+    state.camera.position.z = 1000;
+
+    // add sky
+    state.scene.add(state.skysphere = new three.Mesh());
+    state.skysphere.visible = false;
+    state.loadComplete = state.scene.visible = !waitForLoadComplete;
+    window.scene = state.scene;
+  },
+  update: function update(state, changedProps) {
+    // resize canvas
+    if (state.width && state.height && (changedProps.hasOwnProperty('width') || changedProps.hasOwnProperty('height'))) {
+      state.container.style.width = "".concat(state.width, "px");
+      state.container.style.height = "".concat(state.height, "px");
+      [state.renderer, state.postProcessingComposer].concat(_toConsumableArray(state.extraRenderers)).forEach(function (r) {
+        return r.setSize(state.width, state.height);
+      });
+      state.camera.aspect = state.width / state.height;
+      state.camera.updateProjectionMatrix();
+    }
+    if (changedProps.hasOwnProperty('skyRadius') && state.skyRadius) {
+      state.controls.hasOwnProperty('maxDistance') && changedProps.skyRadius && (state.controls.maxDistance = Math.min(state.controls.maxDistance, state.skyRadius));
+      state.camera.far = state.skyRadius * 2.5;
+      state.camera.updateProjectionMatrix();
+      state.skysphere.geometry = new three.SphereGeometry(state.skyRadius);
+    }
+    if (changedProps.hasOwnProperty('backgroundColor')) {
+      var alpha = parseToRgb(state.backgroundColor).alpha;
+      if (alpha === undefined) alpha = 1;
+      state.renderer.setClearColor(new three.Color(opacify(1, state.backgroundColor)), alpha);
+    }
+    if (changedProps.hasOwnProperty('backgroundImageUrl')) {
+      if (!state.backgroundImageUrl) {
+        state.skysphere.visible = false;
+        state.skysphere.material.map = null;
+        !state.loadComplete && finishLoad();
+      } else {
+        new three.TextureLoader().load(state.backgroundImageUrl, function (texture) {
+          texture.colorSpace = three.SRGBColorSpace;
+          state.skysphere.material = new three.MeshBasicMaterial({
+            map: texture,
+            side: three.BackSide
+          });
+          state.skysphere.visible = true;
+
+          // triggered when background image finishes loading (asynchronously to allow 1 frame to load texture)
+          state.onBackgroundImageLoaded && setTimeout(state.onBackgroundImageLoaded);
+          !state.loadComplete && finishLoad();
+        });
+      }
+    }
+    changedProps.hasOwnProperty('showNavInfo') && (state.navInfo.style.display = state.showNavInfo ? null : 'none');
+    if (changedProps.hasOwnProperty('lights')) {
+      (changedProps.lights || []).forEach(function (light) {
+        return state.scene.remove(light);
+      }); // Clear the place
+      state.lights.forEach(function (light) {
+        return state.scene.add(light);
+      }); // Add to scene
+    }
+    if (changedProps.hasOwnProperty('objects')) {
+      (changedProps.objects || []).forEach(function (obj) {
+        return state.scene.remove(obj);
+      }); // Clear the place
+      state.objects.forEach(function (obj) {
+        return state.scene.add(obj);
+      }); // Add to scene
+    }
+
+    //
+
+    function finishLoad() {
+      state.loadComplete = state.scene.visible = true;
+    }
+  }
+});
+
+export { threeRenderObjects as default };

VISUALIZACION/node_modules/three-render-objects/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "three-render-objects",
+  "version": "1.29.4",
+  "description": "Easy way to render ThreeJS objects with built-in interaction defaults",
+  "license": "MIT",
+  "type": "module",
+  "unpkg": "dist/three-render-objects.min.js",
+  "main": "dist/three-render-objects.mjs",
+  "module": "dist/three-render-objects.mjs",
+  "types": "dist/three-render-objects.d.ts",
+  "exports": {
+    "types": "./dist/three-render-objects.d.ts",
+    "umd": "./dist/three-render-objects.min.js",
+    "default": "./dist/three-render-objects.mjs"
+  },
+  "sideEffects": [
+    "./src/*.css"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vasturiano/three-render-objects.git"
+  },
+  "homepage": "https://github.com/vasturiano/three-render-objects",
+  "keywords": [
+    "3d",
+    "three",
+    "objects",
+    "scene",
+    "tick",
+    "webgl"
+  ],
+  "author": {
+    "name": "Vasco Asturiano",
+    "url": "https://github.com/vasturiano"
+  },
+  "bugs": {
+    "url": "https://github.com/vasturiano/three-render-objects/issues"
+  },
+  "files": [
+    "dist/**/*"
+  ],
+  "scripts": {
+    "build": "rimraf dist && rollup -c",
+    "dev": "rollup -w -c rollup.config.dev.js",
+    "prepare": "npm run build"
+  },
+  "dependencies": {
+    "@tweenjs/tween.js": "18 - 23",
+    "accessor-fn": "1",
+    "kapsule": "1",
+    "polished": "4"
+  },
+  "peerDependencies": {
+    "three": "*"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.24.4",
+    "@babel/preset-env": "^7.24.4",
+    "@rollup/plugin-babel": "^6.0.4",
+    "@rollup/plugin-commonjs": "^25.0.7",
+    "@rollup/plugin-node-resolve": "^15.2.3",
+    "@rollup/plugin-terser": "^0.4.4",
+    "postcss": "^8.4.38",
+    "rimraf": "^5.0.5",
+    "rollup": "^4.16.1",
+    "rollup-plugin-dts": "^6.1.0",
+    "rollup-plugin-postcss": "^4.0.2",
+    "three": "^0.163.0",
+    "typescript": "^5.4.5"
+  },
+  "engines": {
+    "node": ">=12"
+  }
+}