2

Is there any way to make Google Maps like this?

enter image description here

This is promising, but not for Google Maps. This doesn't look promising :)

  • 1
    What do you mean, automatically? using a software - which one? Or are you planning to customize google maps itself for user interaction? I'm affraid your question is a bit too vague, please clarify. – Luciano Jan 22 at 0:39
2

Google Maps offers a very extensive API for style customisation. You can customise almost any element. This is done through a Javascript API: the styles are saved in a JSON structure and then applied when the map is loaded in your website. You can find the full documentation here.

But Google also offers a Wizard which lets you control almost all of the customisations through an interactive UI. You can find said wizard here. Be aware that this wizard does not offer all customisation options. For example, you can set a custom font for labels, yet there is no such option in the wizard.

Things like the boat, dragons, a compass and other 'old-timey' map features can be done through custom overlays. However, this is pretty advanced, so I'd suggest to try getting a feel for the API's simpler functions first.

How I would go about this:

  1. Start customising through the wizard and try to get as close as I can.
  2. Load the map in a webpage (you can use a free online service like Codepen too)
  3. Customise styling further through the JSON options until I'm as close as possible
  4. Add custom SVG elements
| improve this answer | |
  • Can my illustration example be done though? I know they offer customization, but THIS much customization? It doesn't seem so. – Lance Pollard Jan 22 at 11:16
  • I don't know. For that I'd have to start experimenting, but then I'd be doing your job. I'm pretty sure the 3D skew effect is impossible, unless you start using CSS transforms on the whole map after you've styled it. – PieBie Jan 24 at 7:49
  • No need for 3D skew effect, just b+w sketch effect. – Lance Pollard Jan 28 at 4:38
  • I'm talking like this but for Google Maps. – Lance Pollard Jan 28 at 4:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.