Discussion on HTML5 Globe - Interactive 3D Earth

Discussion on HTML5 Globe - Interactive 3D Earth

Cart 335 sales

fjordside supports this item


70 comments found.

Hi i just like to know can I upload images to use as hotspot Icons? i wan to have img of logos ins tad of icon, diffrent logo for difrent spot

is it posible to have biger zoom to see for exaple all companys placed in one city?

any support?

Am I able to disable the Y axis so they globe only rotates from left to right?

Can we upload locations via csv?


1. Can we use any image other than the world image? Example: tree, car etc.

2. When we upload a 2D image, does the system turn it into 3D?

3. Can we ensure that the image is not displayed more than a certain angle with the codes?


1: yes 2: no – it wraps it around a sphere 3: I do not understand your question

:-) Jan

Dear Jan,

Thanks for your information.

3.Question: For example, can I see from only the right and left directions? Or from only the right, left and top directions? Can we set it the way we want?

Nah, not really – it is meant to be able to rotate when the user drags it :-)

Ok I need help figuring out how to “upload the Generator” I’ve only ever modified my site with plugins or Elementor

Got the Generator working, but the HTML code doesn’t seem to work when I add it through the HTML element in Elementor

Got the globe to show up on my webpage, so do I have to copy new HTML code every time I update the globe?

I want to set my globe up for lightbox information. How do I upload images to use as hotspot Icons?

Hello, is it possible to update onclicking a button, the icon for specific spot? Currently I can update the icon for all spots using the exposed function. I can also update the icon for specific spot on page reload.

hello can i used this in my google sites website? also can i put my country location in the map? thanks

Hi I have an OSM map where I add makers to the dashboard.

Does it work well with osm?

Can I put 2 options on the front to view normal or 3d?

do you have documentation on how to do this integration?

grateful for the attention.

Hi jan,

I’m trying to get this to work on a wordpress website. I have followed the steps as described in the “help.html”, but that doenst seem to work.

I uploaded “generator folder” as a zip via cpanel > files manager > into the wp-content folder, and extracted it here.

Am I doing something wrong?

Kind regards, Kay

Awsome, Thanks!

Generator works perfectly fine now :D!

I only need help getting it work on the website :P.

I uploaded the html5GlobeFiles in the same folder as the genrator, and copy and pasted the code generated for wordpress into a textfield on this link:

I also put this code in to functions.php: remove_filter( ‘the_content’, ‘wpautop’ ); remove_filter( ‘the_excerpt’, ‘wpautop’ );

Already got it working, Thanks again, works super now!

Hi, been a while :) so i just downloaded the earth to my macbook and the opened the folder generator.html when it opens up in a new google chrome screen the earth appears just black. I know its a dumb mistake or something i’m forgetting to do if you can remind me how that would be great

Hi – you would need to run it from a webserver, because chromes security will not allow some of the components to load from the local filesystem :-)

Can i put my page or site link to the lighbox ?

Yes it is possible to open a link in the lightbox (if that is what you mean), it is beyond the scope of the support offered with the HTML5Globe though – but check out:

ok thankyou i will purchase ASAP

please check your email, i send a message. thanks

hi . i have generate the globe. but when i add that in my html it float to right, with css if i change it to left the coordinates marker position get disturbed. can you please help me in this matter.

Jan Fjordside <> 11.26 (for 31 minutter siden) til Envato

Hi there,

Thank you for buying :-)

Please try and change this line: <canvas width=”1170” height=”1170” style=”height: 100%;width: 100%;top: 0px;bottom: 0px;position: absolute;”></canvas>

To this line: <canvas width=”1170” height=”1170” style=”height: 100%;width: 100%;top: 0px;left: 0px;bottom: 0px;position: absolute;”></canvas>

Hope this helps

Kind regards Jan

hi there,

i use left:0px; in my canvas code. it help me to move the globle on left but there are two problems now.

1 . the coordinates marker alignments has been disturbed 2. and we have space on top and bottom of global.

this is our live example please have a look.

can we also change glob colors?

Yes – it is as easy as producing a jpg image :-)

I don’t found generator.html. There is where the file to generate ?

Hi there – it was missing in my previous upload – allready submitted correct zip – pending approval. Please get in touch over mail, and i can send you a link. Sorry for any inconvenience.

Hi, I send you email. thanks

Approved and ready to download again :-)

Hi Jan, I hope your doing well and safe with this Covid pandemic. So I noticed an update yesterday with the globe which I haven’t logged in well over a year now and was still doing edits on my project but is that update something I need and how do I do that? Does that mean I just swap out the main threejs file, like the core for the earth?

I would try it out ;-)

Hello :)

I’m currently shopping around for a 3D earth for a website project and I’ve only seen yours and another called miniature earth which I believe your earth looks way cooler and I would Like to buy.. The things I didn’t see though on your advertisement is if it’s mobile responsive like reference to maybe if you view from a small mobile phone or large phone, tablet, etc if it will grow and or shrink depending on the device you use?? Or if I need to hire someone to rewrite custom code to make it do that? Also if not I wish you to revamp and update as your earth looks way cooler please!!! Also we’re you planning Or Do you have any Big updates on the way??

Thank you many good wishes!

Hello – thank you for your interest in the HTML5 globe and your kind words :-). If you look at this example: you can see the globes container grows and shrinks, within its responsive css boundaries – so if you set the globes size, from its built in parameters, to a balanced middleground i guess it could do the trick.

Thanks Jan

Can I create Globe texture like this via using image. Image url (

Yes, you can easily to that if you have the image as a flat 2d texture ( a regular jpg)

can i install this pluguns and genrate shortcode

Hi there – it does not quite work that way – check out this videopresentation, that demonstrates the included generator tool:

Hi – I’m a non coder and needed to hire someone but have 2 presale questions: #1 Is this Globe Responsive as in will it automatically scale in size depending what device it’s viewed from “Larger & Smaller” or is there a custom code that needs to be written for that? #2 Can you set it to a fixed position so it is in the same place on all mobile devices?

Hello – #1please have a look at the demos and try and scale the browser window, that way you can see how it reacts. #2 the globe will stay on its lat/lng location on all devices. Thanks for your interest

How do I change the map pointers?

They are easy to change, they are .png files – so just replace the png file or do it via options.


Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey