Google maps integration

[peterennis]

Note: for support questions, please use stackoverflow. This repository's issues are reserved for feature requests and bug reports.

• I'm submitting a ...

  • [x] bug report
  • [ ] feature request
  • [ ] support request => Please do not submit support request here, see note at the top of this template.

• Do you want to request a feature or report a bug?

• What is the current behavior?

error message

• If the current behavior is a bug, please provide the steps to reproduce, ideally also a screenshot or gif if it's a style issue

• What is the expected behavior?

• What is the motivation / use case for changing the behavior?

• Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)

[asvae]

Thanks! We'll take a look.

[damirJa]

Hi @asvae! I guess this is the problem

[sarathak]

i think this is not a bug just because of don't have paid google map api key

[Derranion]

Update:

Currently it does not open completely and throws these errors:

[saschnet]

Currently, the load functionality fails completely:

[saschnet]

I fixed the current bug which resides in /src/pages/admin/maps/google-maps/GoogleMap.vue by installing the official google maps loader https://www.npmjs.com/package/@googlemaps/js-api-loader with

npm i @googlemaps/js-api-loader

and modified the <script>[...]</script> content to:

import { Loader } from '@googlemaps/js-api-loader';

export default {
  name: 'google-map',

  mounted () {
    if (!process.env.VUE_APP_GOOGLE_MAPS_API_KEY) {
      throw new Error('Please provide google maps api key from env (VUE_APP_GOOGLE_MAPS_API_KEY)')
    }

    const loader = new Loader({
      apiKey: process.env.VUE_APP_GOOGLE_MAPS_API_KEY,
      version: "weekly",
      libraries: ["places"]
    });

    const mapOptions = {
      center: {
        lat: 0,
        lng: 0
      },
      zoom: 6,
    };

    loader
      .load()
      .then((google) => {
        new google.maps.Map(this.$el, mapOptions);
      })
      .catch(e => {
        console.log(e)
        // do something
      });
  },
}

[asvae]

We removed google map from new version.