ionic-team / ionic-native-google-maps

Google maps plugin for Ionic Native
Other
221 stars 125 forks source link

Marker Cluster Icons are not loading on IOS (ios only) #142

Closed stevebrowndotco closed 5 years ago

stevebrowndotco commented 5 years ago

I'm submitting a ...

If you choose 'problem or bug report', please select OS: (check one with "x")

cordova information: (run $> cordova plugin list)

cordova-plugin-appminimize 1.0 "AppMinimize"
cordova-plugin-datepicker 0.9.3 "DatePicker"
cordova-plugin-facebook4 2.5.0 "Facebook Connect"
cordova-plugin-file 6.0.1 "File"
cordova-plugin-file-transfer 1.7.1 "File Transfer"
cordova-plugin-firebase 2.0.5 "Google Firebase Plugin"
cordova-plugin-googlemaps 2.5.0-beta-20181030-1133 "cordova-plugin-googlemaps"
cordova-plugin-ionic 5.2.7 "cordova-plugin-ionic"
cordova-plugin-ionic-webview 2.2.5 "cordova-plugin-ionic-webview"
cordova-plugin-screen-orientation 3.0.1 "Screen Orientation"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.4-dev "Whitelist"
es6-promise-plugin 4.2.2 "Promise"

If you use @ionic-native/google-maps, please tell the package.json (only @ionic-native/core and @ionic-native/google-maps are fine mostly)

"@ionic-native/core": "^4.7.0", "cordova-plugin-googlemaps": "^2.4.6", "@ionic-native/google-maps": "^4.8.2", "@ionic-native/core": "^4.7.0", Current behavior:

When creating a marker cluster and set the url of a custom image, it does not load on IOS. The error I get in runtime with xcode is:

2018-12-09 17:15:04.883697+0000 Chalk[51721:3936880] [fail] url = http://localhost:8080//./assets/images/map-cluster.png 2018-12-09 17:15:04.888974+0000 Chalk[51721:3936880] *** Terminating app due to uncaught exception 'GMSThreadException', reason: 'The API method must be called from the main thread'

Note, I am also trying with /assets/... , 'assets/...' , ../assets/... in additon to ./assets

The behaviour on iOS simulator is that it crashes to the desktop.

The behaviour on a real iOS device causes the app to freeze

It works perfectly on android!

Expected behavior:

I expect the map marker to appear :)

Related code, data or error log (please format your code or data):

      this.map.addMarkerCluster({
        maxZoomLevel: 9,
        markers: [{
          map: this.map,
          position: {
            lat: marker.lat,
            lng: marker.lng
          },
          title: marker.name,
          data: marker
        }],
        icons: [
          {
            min: 0,
            max: 999999,
            url: "./assets/images/map-cluster.png",
            label: {color: "white"}
          }
        ]
      })
wf9a5m75 commented 5 years ago

Please share your project files on GitHub repository

stevebrowndotco commented 5 years ago

I can't show you my project files for various reasons, so I will have to get a boilerplate repo and demonstrate by uploading that.

stevebrowndotco commented 5 years ago

Hi @wf9a5m75 the problem is further described here https://forum.ionicframework.com/t/ionic-native-google-maps-custom-icon/63660

wf9a5m75 commented 5 years ago

You just share the link. The comments on the forum were posted on various period. Code is always changing. So, it's not valuable information at all.

As I said, please share your project files on Github repository. You can create a demo project at least. If you decline any contribution, I can't help you at all.

stevebrowndotco commented 5 years ago

Hi @wf9a5m75 , I'm just sharing the link so you can see something in the meantime.

I can also confirm that the link provides a useful workaround for me (prefixing with /www), which means if it's a bug it is still apparent in version I posted above (because I need to only do this on IOS).

Hope this helps for now 👍

wf9a5m75 commented 5 years ago

Unfortunately there is no valuable information. If you can't create a demo, I will close this thread.

wf9a5m75 commented 5 years ago

Since there is no additional information, I close this thread.

ndrake commented 5 years ago

I'm able to reproduce this issue using the https://github.com/mapsplugin/ionic-googlemaps-quickdemo-v4 repository:

2019-02-12 14:23:07.462677-0500 MyApp[42142:556801] [fail] url = http://localhost:8080/assets/markercluster/small.png
2019-02-12 14:23:07.462899-0500 MyApp[42142:556233] *** Terminating app due to uncaught exception 'GMSThreadException', reason: 'The API method must be called from the main thread'
*** First throw call stack:
(
    0   CoreFoundation                      0x000000011101c1bb __exceptionPreprocess + 331
    1   libobjc.A.dylib                     0x000000010f9b8735 objc_exception_throw + 48
    2   CoreFoundation                      0x000000011101c015 +[NSException raise:format:] + 197
    3   MyApp                               0x000000010ba12972 -[GMSOverlay setMap:] + 89
    4   MyApp                               0x000000010b95e52f -[PluginMarker _removeMarker:] + 1135
    5   MyApp                               0x000000010b9a5015 __80-[PluginMarkerCluster setIconToClusterMarker:marker:iconProperty:callbackBlock:]_block_invoke + 901
    6   MyApp                               0x000000010b96bc53 __52-[PluginMarker setIcon_:iconProperty:callbackBlock:]_block_invoke_2.535 + 1027
    7   MyApp                               0x000000010b970888 __53-[PluginMarker downloadImageWithURL:completionBlock:]_block_invoke_2 + 344
    8   CFNetwork                           0x0000000110771940 __75-[__NSURLSessionLocal taskForClass:request:uploadFile:bodyData:completion:]_block_invoke + 19
    9   CFNetwork                           0x0000000110787b0c __49-[__NSCFLocalSessionTask _task_onqueue_didFinish]_block_invoke + 172

Per stevebrowndotco's comment, changing the "./" to "www/" fixes the issue.