npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@giro3d/giro3d

v0.41.0

Published

A JS/WebGL framework for 3D geospatial data visualization

Downloads

2,428

Readme

| draw tool | Potree point cloud | GeoTIFF elevation | | ------------------------------------------------------ | ----------------------------------------------------------------- | ------------------------------------------------------------ | | alt text | alt text | alt text |

What is Giro3D ?

Giro3D is a Web library written in TypeScript to build 2D and 3D geospatial scenes. It is powered by three.js and WebGL. It aims to support major geospatial standards and provide a rich feature set to help visualize data in a 3D environment.

Features

  • 2D and 3D maps with unlimited color layers, real-time lighting and a broad range of data sources (tiled images, GeoTIFFs, static images, vector data, including Vector tiles).
  • High-resolution terrain rendering with elevation querying / elevation profile
  • Point clouds colored by classification, colormaps or color layer
  • Create shapes and annotations, including height measurements and angular sectors.
  • Easy to integrate with GUI frameworks such as Vue and React.
  • Limit visibility of datasets using cross-sections
  • Display 3D features with a rich style API

Supported data sources

Giro3D is powered by OpenLayers for maps, and three.js for 3D assets, and can be easily extended to support more.

Below is a non-exhaustive list of supported data sources.

Image data

Elevation data

Vector data

Point clouds

3D assets

  • 3D Tiles for optimized massive 3D datasets, including point clouds
  • glTF for individual models

Getting started

💡 To test Giro3D without installing anything, check the interactive examples.

Install from the NPM package

To install with npm (recommended method):

npm install --save @giro3d/giro3d

This package contains both original sources (under src/) and slightly processed sources (dead code elimination, inlining shader code...).

If you're using a module bundler (like wepback) or plan on targeting recent enough browser, you can directly import it as such:

import Instance from '@giro3d/giro3d/core/Instance.js';

You can also import the original, untranspiled sources, by adding src after @giro3d/giro3d/ :

import Instance from '@giro3d/giro3d/src/core/Instance.js';

This will probably limit browser compatibility though, without application specific process or loader. Also, non .js files (such as .glsl files) will need to be inlined at client application level.

From a release bundle

See our release page.

With npm link

This is handy if you need to develop on Giro3D alongside your project. You need to first prepare the package folder and link from there:

npm run make-package
cd build/giro3d
npm link
# then in your project folder
npm link @giro3d/giro3d

To ease development, files can be automatically transpiled on modification with the watch script :

npm run watch

Each time a source file is modified, this script will transpile it in the build folder.

Tests

To run the test suite:

npm test

API documentation and examples

Browse the API Documentation documentation or check the examples.

Contributors and sponsors

Giro3D has received contributions and sponsoring from people and organizations listed in CONTRIBUTORS.md. If you are interested in contributing to Giro3D, please read CONTRIBUTING.md.

Support

Giro3D is the successor of iTowns, an original work from IGN and MATIS research laboratory. It has been funded through various research programs involving the French National Research Agency, Cap Digital, The Sorbonne University, Mines ParisTech, CNRS, IFSTTAR.

Giro3D is currently maintained by Oslandia.

No code with Piero

In case you don't want to code your own application, you can also use Piero, our sister project - also available on GitLab.

FAQ

Where does the name Giro3D come from ?

The name is a reference to the italian mathematician and inventor Girolamo Cardano.