diegoazh/gmap-vue

Feature: Hide default features/landmarks/places

Closed this issue · 2 comments

Please complete all sections that you can but please don't remove any section, otherwise the bot will close your issue because it doesn't meet our issue template (you can remove this comment)

Is your feature request related to a problem? Please describe.

I need a clean map because it's too crowded with default landmarks and places.

Describe the solution you'd like

AFAIK gmaps accepts an style prop that allows this to be controlled.
https://developers.google.com/maps/documentation/javascript/examples/hiding-features

Describe alternatives you've considered

If it's no possible to add this prop, maybe just a true/false prop to disable all without being able to pass an styling prop.

Additional context

Add any other context or screenshots about the feature request here.

Hi @dhcmega I'm not sure if this feature is needed you can manage that in the following way

<template>
  <GmapMap ref="mapRef" ...>
  </GmapMap>
</template>
<script>
  export default {
    mounted () {
      // At this point, the child GmapMap has been mounted, but
      // its map has not been initialized.
      // Therefore we need to write mapRef.$mapPromise.then(() => ...)

      this.$refs.mapRef.$mapPromise.then((map) => {
        map.setOptions({ 
          styles: [
            {
              featureType: "poi.business",
              stylers: [{ visibility: "off" }],
            },
            {
              featureType: "transit",
              elementType: "labels.icon",
              stylers: [{ visibility: "off" }],
            },
          ]
        });
      })
    }
  }
</script>

Please let me know if this solves your issue.

Hi @diegoazh
I have just tested it and it worked!
I have used it like this:

          {
            featureType: 'poi',
            stylers: [{ visibility: 'off' }],
          },

To remove all of them.

Thank you so much for taking the time to respond.
Regards