The WebGL Globe is a library for visualizing data on a 3d globe in the browser
The WebGL Globe is an open platform for geographic data visualization created by the Google Data Arts Team.
Questions tagged [webgl-globe]
39 questions
1
vote
3 answers
Rotate Globe.gl globe (with react-three-fiber or otherwise) in React
I'm following this example from Globe.gl to achieve the following output. I want to rotate this globe using react-three-fiber, namely using the approach from this example.
Here is my Globe.js:
import React from "react";
import * as d3 from…
mmz
- 1,011
- 1
- 8
- 21
1
vote
2 answers
Get longitude and latitude from the Globe in WebGL
I'm using WebGL globe from http://workshop.chromeexperiments.com/globe/. If any point of the globe is clicked, I need to get the longitude and latitude of that point. These parameters are to be passed to the Google Maps for 2D map.
How can I get the…
sandy
- 113
- 2
- 6
0
votes
0 answers
Remove the background for react-globe.gl
I am having issue with removing the background of the globe.
Having tried to set the backgroundImageUrl to null and set the backgroundColor to rgba(0,0,0,0),
neither of them worked as they would only make the background transparent, and did not…
haharimoto
- 84
- 1
- 1
- 6
0
votes
1 answer
How to fix the ignorance of globe controls in Globe.gl in Next.JS?
I'm using react-globe.gl to create a globe object for my next.js website.
Everything works well apart from the manually set controls.
Here's my code for the component:
import dynamic from "next/dynamic";
const Globe =…
nitlix
- 15
- 5
0
votes
1 answer
ThreeJS Globe z-index issue
I'm trying to display a Globe with points on it that open a card when clicked.
I kinda try different approaches and came up to this result : http://lefutoir.fr/timac/v1.html#
I'll need to put an HD texture of course but my main issue is that I have…
Kayon
- 11
- 3
0
votes
0 answers
How to make html widgets display properly on 3d globe
using threejs here is a screenshot
as you see here the news widget is not displaying properly within the label, what can I do to get it to display properly?
here is my code
#info{
position: absolute;
bottom: 1vh;
color: teal;
width: 100%;
…
shange
- 77
- 7
0
votes
0 answers
How to set GUI options for three.js globe texture? Weakmap error
I've added gui options for my globe to change textures but I get the error "TypeError: Attempted to set a non-object key in a WeakMap" I think the error is related to the textures I'm using. what can I do to fix the gui error?
here is my code:
…
shange
- 77
- 7
0
votes
1 answer
how to stop and start AMcharts globe animation with intersectionObserver?
I have this spinning globe animation from AMcharts on the front page of my site. but it eats a LOT of system resources, even when its scrolled off screen, any more animated buttons added to the site will make chrome slow to a crawl. I have done some…
David Morton
- 47
- 5
0
votes
1 answer
Updating data in globe.gl
I'm using Points Layer provided in the globe gl library. But I cannot seem to update the data after setting Globe().pointsData.
In the following example, I created a Globe instance and after that, wrote a test script that invokes after 2 seconds.…
Shubhashis
- 10,411
- 11
- 33
- 48
0
votes
1 answer
THREE.ImageUtils.getDataURL
THREE.ImageUtils.getDataURL: Image converted to jpg for performance reasons
I'm getting an error like this and its appearing every seconds in my console. I'm using globe.gl with vuejs and its my background image. It was png but I changed to the jpg…
Emre Özer
- 23
- 1
- 2
0
votes
0 answers
Uncaught SyntaxError: Unexpected token '<' api.js:1 in webGL
I'm trying to intwegrate WebGL Link: https://sites.google.com/site/webglearth/
but when i run the same in browser i'm getting this error:
Uncaught SyntaxError: Unexpected token '<'
api.js:1
Uncaught ReferenceError: WE is not defined
at…
user3653474
- 3,393
- 6
- 49
- 135
0
votes
1 answer
Adding data with API to globe.gl which i use for leaflet map
I'm new and want to learn JavaScript. I made a covid world map with a leaflet with API data. I would like to apply the same data to globe.gl.
Could you please advise me how I can apply the same statesData which I use for the leaflet map to 3d…
suisui
- 5
- 1
0
votes
1 answer
WebGL globe: how to get data from db and show popup over globe when click globe spot
I need to make a WebGL Globe like this:
https://trends.google.com/trends/zeitgeist/2013/globe#frame=314
I've started using this example:
http://foreverbell.github.io/steps/
Let me explain the details of the project I'm trying to do:
I need a…
hugone
- 11
- 3
0
votes
2 answers
Auto rotate WebGL Globe
I'm working with this amazing experiment, WebGL Globe, and it's really awesome.
I've changed some functions to play and adapt them to what I want. One is function render.
ORIGINAL:
function render() {
zoom(curZoomSpeed);
rotation.x +=…
Roberto Meijide
- 99
- 19
0
votes
2 answers
How to get lat long values of point at center of screen in WebGL Globe?
Google's WebGL Globe allow placing markes at a specific lat long. But how can we get the lat long value of point currently at front or at center of screen. May be using camera position or rotation value.
We can use below code to find position on…
XIMRX
- 2,130
- 3
- 29
- 60