Constructs a giro3d Instance
Where to instanciate the Three.js scene in the DOM
Optional options: { Optional properties.
The coordinate reference system of the scene. Must be a cartesian system.
The options for the renderer.
The Three.js Scene instance to use, otherwise a default one will be constructed
const opts = {
camera: camera,
crs = exent.crs()
};
const instance = new Instance(viewerDiv, opts);
const map = new Map('myMap', null, extent, { maxSubdivisionLevel: 10 });
instance.add(map);
Gets the current camera.
Gets the canvas that this instance renders into.
Gets whether at least one entity is currently loading data.
Gets the progress (between 0 and 1) of the processing of the entire instance.
This is the average of the progress values of all entities.
Note: This value is only meaningful is loading is true.
Note: if no entity is present in the instance, this will always return 1.
Gets the underlying WebGL renderer.
Gets the rendering options.
Note: you must call notifyChange() to take the changes into account.
Gets the DOM element that contains the giro3d viewport.
Add THREE object or Entity to the instance.
The entity id must be unique.
the object to add
a promise resolved with the new layer object when it is fully initialized or rejected if any error occurred.
// Add Map to instance
instance.add(new Map('myMap', myMapExtent));
// Add Map to instance then wait for the map to be ready.
instance.add(new Map('myMap', myMapExtent)).then(...);
Adds a listener to an event type.
The type of event to listen to.
The function that gets called when the event is fired.
Add a frame requester to this instance.
FrameRequesters can activate the MainLoop update by calling instance.notifyChange.
decide when the frameRequester should be called during the update cycle. Can be any of module:core/Instance.INSTANCE_EVENTS INSTANCE_EVENTS.
this function will be called at each MainLoop update with the time delta between last update, or 0 if the MainLoop has just been relaunched.
Convert canvas coordinates to normalized device coordinates (NDC).
(in pixels, 0-0 = top-left of the instance)
The target to set with the result.
NDC coordinates (x and y are [-1, 1])
Dispose of this instance object. Free all memory used.
Note: this will not dispose the following reusable objects:
controls.dispose()inspector.detach()Extract canvas coordinates from a mouse-event / touch-event
event can be a MouseEvent or a TouchEvent
The target to set with the result.
finger index when using a TouchEvent (default: 0)
canvas coordinates (in pixels, 0-0 = top-left of the instance)
Extract normalized coordinates (NDC) from a mouse-event / touch-event
event can be a MouseEvent or a TouchEvent
The target to set with the result.
finger index when using a TouchEvent (default: 0)
NDC coordinates (x and y are [-1, 1])
Execute a frameRequester.
attach point of this (these) requester(s). Can be any of module:core/Instance.INSTANCE_EVENTS INSTANCE_EVENTS.
delta between this update and the previous one
true if giro3d' update loop just restarted
Rest ...args: any[]optional arguments
Get all objects, with an optional filter applied. The filter method allows to get only a subset of objects
Optional filter: ((arg0) => boolean)the optional query filter
an array containing the queried objects
// get all objects
instance.getObjects();
// get one layer with id
instance.getObjects(obj => obj.id === 'itt');
Checks if listener is added to an event type.
The type of event to listen to.
The function that gets called when the event is fired.
Notifies the scene it needs to be updated due to changes exterior to the scene itself (e.g. camera movement). non-interactive events (e.g: texture loaded)
the source of the change
indicates if notified change requires a full scene redraw.
Return objects from some layers/objects3d under the mouse in this instance.
mouse position in window coordinates, i.e
[0, 0] = top-left, or MouseEvent or TouchEvent
Optional options: { Optional properties.
Filter on resulting objects
maximum number of objects to return
picking will happen in a circle centered on mouseOrEvt. Radius is the radius of this circle, in pixels
where to look for objects. Can be either: empty (= look in all layers with type === 'geometry'), layer ids or layers or a mix of all the above.
an array of objects. Each element contains at least an object property which is the Object3D under the cursor. Then depending on the queried layer/source, there may be additionnal properties (coming from THREE.Raycaster for instance).
instance.pickObjectsAt({ x, y })
instance.pickObjectsAt({ x, y }, { radius: 1, where: ['wfsBuilding'] })
instance.pickObjectsAt({ x, y }, { radius: 3, where: ['wfsBuilding', myLayer] })
Removes the entity or THREE object from the scene.
the object to remove.
Removes a listener from an event type.
The type of the listener that gets removed.
The listener function that gets removed.
Remove a frameRequester. The effective removal will happen either later; at worst it'll be at the beginning of the next frame.
attach point of this requester. Can be any of module:core/Instance.INSTANCE_EVENTS INSTANCE_EVENTS.
the frameRequester to remove
This function allows to use three.js controls (files in examples/{js,jsm}/controls folder
of THREE.js) into giro3d 3D scene.
Giro3d supports the controls that check the following assumptions:
update methodAn instance of a THREE controls
Static registerCRSRegisters a new coordinate reference system. This should be done before creating the instance. This method can be called several times to add multiple CRS.
the short name, or EPSG code to identify this CRS.
the proj string describing this CRS.
// register the CRS first...
Instance.registerCRS(
'EPSG:102115',
'+proj=utm +zone=5 +ellps=clrk66 +units=m +no_defs +type=crs');
// ...then create the instance
const instance = new Instance(div, { crs: 'EPSG:102115' });
Generated using TypeDoc
The instance is the core component of Giro3D. It encapsulates the 3D scene, the current camera and one or more entities, such as a Map.