webpack/@googlemaps/js-api-loader:

strarsis commented 4 years ago

When using map-label-rotated with @googlemaps/js-api-loader and building with webpack, I get an error during runtime when trying to create a rotated label:

Uncaught ReferenceError: google is not defined
    at Object.<anonymous> (make-control.js:23)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (some-js-file.js:1)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (main.js:1)
    at Object.<anonymous> (main.js:34)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at Object.<anonymous> (index.js:240)
    at __webpack_require__ (bootstrap 9ec78d170b869e843be0:19)
    at bootstrap 9ec78d170b869e843be0:62

import { RotatedLabel }  from 'map-label-rotated';
[...]
const label = new RotatedLabel( bounds.getCenter(), 'Test', 45, map );

javidalpe commented 4 years ago

Hey @strarsis, I have updated the class so it extends from window.google instead of google. Could you check now?

strarsis commented 4 years ago

@javidalpe: Awesome! Thanks for the modification. When I got some more time I will test it and give feedback.

strarsis commented 3 years ago

@javidalpe: So after about a year I finally got back to that project. 😮 ⏲️

The issue is that the google maps loader will set google.maps asynchronously. I import this map-label-rotated library and it will immediately try to use the global variable for google maps, as it extends it directly in its defintion: export class RotatedLabel extends window.google.maps.OverlayView {

I don't know if this can be easily changed. I guess I have to asynchronously import this library.

javidalpe / map-label-rotated

webpack/@googlemaps/js-api-loader: #1