Add custom 3D Maps on your own website

For embedding the 3D map on your own website, you will get a ready-made code snippet with an instruction and some examples. The 3D map can easily be embedded via iFrame.

 

All settings that have been made in the preview are saved in the code and the 3D map will appear exactly in the same way on your website. The user is able to drag, zoom and rotate the 3D map.

 

You should be a little skilled in basics of website programming or ask a programmer to embed the map correctly.

 

How to embed 3D map in WordPress

3D Map Setting Options

  • Map height
  • Map name
  • Rotation speed
  • Mesh resolution
  • Map edge and edge color
  • Background

Embedded 3D Map Examples

Map Location: 98241, Darrington, Washington

 

Coord. (lat, lng): 48.115189, -121.115944

Zoom level: 13z

 

Attribution

Map texture: MapTiler

 

Image size (high-res): 2560 x 2560 px

 

Background: Vanilla Sky

Rotation: -0.1

Map Location: South Lake Tahoe, California, 96150

 

Coord. (lat, lng): 38.927200, -119.981171
Zoom level: 13z

 

Attribution
Map data: © OpenStreetMap
Map style: © OpenTopoMap

 

Image size (high-res): 3584 x 2560 px

 

Background: Custom Color

Rotation: 0

Map Location: 86052, North Rim, Arizon

 

Coord. (lat, lng): 36.218544, -112.439873

Zoom level: 14z

 

Attribution

Map texture: MapTiler

 

Image size (high-res): 3584 x 2560 px

 

Background: Blue Sky

Rotation: 0

Map Location: 日本, Mount Fuji

 

Coord. (lat, lng): 35.363594, 138.731400

Zoom level: 12z

 

Attribution
Map data: © OpenStreetMap
Map style: © OpenTopoMap

 

Image size (high-res): 3584 x 2560 px

 

Background: Cloudy Sky

Rotation: 0.2

Map Location: Himalayas

Coord. (lat, lng): 27.274750, 92.241302

Zoom level: 13z

 

Attribution
Map data: © OpenStreetMap
Map style: © OpenTopoMap

 

Image size (high-res): 4096 x 2560 px

 

Background: Milky Way

Rotation: 0.2