TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

How We Built the GitHub Globe

376 pointsby scalableUniconover 4 years ago

24 comments

gk1over 4 years ago
Looks a lot like the globe on Stripe&#x27;s homepage: <a href="https:&#x2F;&#x2F;stripe.com" rel="nofollow">https:&#x2F;&#x2F;stripe.com</a><p>They even had a post about it, too: <a href="https:&#x2F;&#x2F;stripe.com&#x2F;blog&#x2F;globe" rel="nofollow">https:&#x2F;&#x2F;stripe.com&#x2F;blog&#x2F;globe</a>
评论 #25585583 未加载
评论 #25589932 未加载
评论 #25586260 未加载
评论 #25589578 未加载
评论 #25587394 未加载
评论 #25585275 未加载
评论 #25586367 未加载
评论 #25591028 未加载
评论 #25586950 未加载
willcodeforfooover 4 years ago
Pretty clever using the timezone offset to approximate the user&#x27;s location without using GeoIP. I hadn&#x27;t noticed that but sure enough, my (approximate) location is in view first.
评论 #25588211 未加载
评论 #25588966 未加载
bluenose69over 4 years ago
Wow, very interesting. Although I&#x27;m on GH every day, I seldom look at the base GH page and so I would not have noticed this for a long time. Many thanks for posting this. The article is very interesting.
评论 #25585007 未加载
dmixover 4 years ago
I&#x27;m not convinced of the performance, I heard my fans spin up when I first opened the new Github.com redesign a few weeks back and remember commenting on it to our developers (&quot;how we destroyed your browsers performance&quot; as a joke).<p>It&#x27;s still a heavy thing to add to any page IMO. Which shouldn&#x27;t be downplayed.<p>But it is very neat and I still like it.
评论 #25586391 未加载
EGregover 4 years ago
If you want something like this on your site, here are the resources. As a company that built a rotating globe years ago to visualize our growing user base around the world using our apps, I wanted to share a link to the demo here. Being that we did this years before WebGL became available in all major browsers, we used canvas rendering and shapes of countries from open databases. It is supposed to work across all devices so try it whatever browser you are on now:<p><a href="https:&#x2F;&#x2F;qbix.com" rel="nofollow">https:&#x2F;&#x2F;qbix.com</a><p>Please scroll down to where the globe image appears and click&#x2F;tap it. Feel free to switch countries and click around. I would love to hear your feedback.<p>PS: We have open sourced all this stuff, so if anyone here wants to put a globe on their website, just load our Q.js from <a href="https:&#x2F;&#x2F;github.com&#x2F;Qbix&#x2F;Platform" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;Qbix&#x2F;Platform</a> and then render the Q&#x2F;globe tool and Places&#x2F;countries selector tool with your own options. Unlike the GitHub globe, you can also have users click on countries in the globe to select them, and if you need you can pull in the flags, languages and all the other stuff per country.
评论 #25588490 未加载
awinter-pyover 4 years ago
why is the octocat wearing a space helmet if there are plants growing below it? what happened on this planet to make the air unbreathable?<p>Some kind of chernobyl event, possibly caused by the ICBMs in the globe image?<p>What is the octocat standing on top of? Abandoned silo? Or live silo about to go hot?
评论 #25586400 未加载
评论 #25587872 未加载
jeffbeeover 4 years ago
Alt title: how we made yet another population density map, but this time using all of your CPU.
评论 #25590598 未加载
just_steve_hover 4 years ago
It&#x27;s funny that the marketing &amp; design folks keep doing this (IBM in the 80s, Akamai in the 90s through today, and so on). It looks super cool and informs the viewer of very little.<p>(Full disclosure: I ported a prototype version of my company&#x27;s globe data viz in 2013 using Three.js - it&#x27;s terrific! Those folks are the real heroes in this story.)
gabereiserover 4 years ago
I watched the animation from Nat the CEO and what struck me as odd was the volume of which Brazil does “activity” at night.<p>Clearly the USA is more active during the day, as is India and Europe. Brazil on the other hand is backwards. Anyone know why that would be? I’ve worked with Brazilians before during the day so that struck me as really peculiar.
评论 #25587337 未加载
Plaastixover 4 years ago
This is amazing! Is it just me or is the performance of Github&#x27;s globe really bad on Firefox? The FPS is super low for me on Firefox but fine in Chrome.
评论 #25585705 未加载
评论 #25586243 未加载
评论 #25586396 未加载
评论 #25589692 未加载
评论 #25589272 未加载
Andrew_nenakhovover 4 years ago
Looks very similar to <a href="https:&#x2F;&#x2F;globekit.co&#x2F;" rel="nofollow">https:&#x2F;&#x2F;globekit.co&#x2F;</a><p>I recall Stripe&#x27;s globe was built using that.
jessikatover 4 years ago
A link to a repo of the actual code would be nice too for inspiration
ramenmealover 4 years ago
Wow, hardware acceleration makes a big difference here. I&#x27;m on a recent top of the line macbook pro and it couldn&#x27;t handle it without hardware acceleration turned on. I wonder if they can&#x2F;should disable the feature if it&#x27;s off?
评论 #25585925 未加载
kowloover 4 years ago
A link to something similar (but not the same) <a href="https:&#x2F;&#x2F;experiments.withgoogle.com&#x2F;chrome&#x2F;globe" rel="nofollow">https:&#x2F;&#x2F;experiments.withgoogle.com&#x2F;chrome&#x2F;globe</a>
xixixaoover 4 years ago
Based on the Satellite video it looks like the US is the only place on the planet coding more during the night than during the day.
umaarover 4 years ago
Related: WebGL globe showing live Wikipedia edits <a href="https:&#x2F;&#x2F;umaar.com&#x2F;globe&#x2F;" rel="nofollow">https:&#x2F;&#x2F;umaar.com&#x2F;globe&#x2F;</a><p>I&#x27;ve also tried to visualise worldwide COVID data on that globe, however performance degrades making it completely unusable.
kowloover 4 years ago
Great way to visualise the data. I wonder if it will work its way into any plotting libraries...
ChrisArchitectover 4 years ago
See also ENCOM Globe, tribute to Tron:Legacy <a href="https:&#x2F;&#x2F;www.robscanlon.com&#x2F;encom-globe&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.robscanlon.com&#x2F;encom-globe&#x2F;</a>
sprsimplestuffover 4 years ago
Shopify did something similar, I&#x27;m pretty sure, for Black Friday<p>looks so cool
collectedviewover 4 years ago
When someone puts a video game in-front of me and asks me to turn it into an app, I will be searching for this article for hours.
UnnoTedover 4 years ago
Not useful, all it does is lag the page and increase the cpu usage to 40% when you have hardware acceleration turned off.
评论 #25585965 未加载
评论 #25585941 未加载
评论 #25588478 未加载
dpaintover 4 years ago
I love an animated webgl globe as much as the next person but did no-one check scrolling on mobile? Maybe it&#x27;s just me but it captures vertical scrolling preventing moving down the page.<p>It&#x27;s a common gotcha when embedding Google maps on mobile.<p>Here&#x27;s a mobile capture for reference <a href="https:&#x2F;&#x2F;files.catbox.moe&#x2F;e965m9.mp4" rel="nofollow">https:&#x2F;&#x2F;files.catbox.moe&#x2F;e965m9.mp4</a>
评论 #25587688 未加载
mariustover 4 years ago
ohhhh well thank you it takes me a few seconds to login :d
gotemover 4 years ago
Crazy impressive. A little bit misleading though.
评论 #25585186 未加载