Skip to content

[@nativescript/google-maps] Adding a ground overlay #300

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
tommag21 opened this issue Jul 12, 2022 · 4 comments
Closed

[@nativescript/google-maps] Adding a ground overlay #300

tommag21 opened this issue Jul 12, 2022 · 4 comments

Comments

@tommag21
Copy link
Contributor

tommag21 commented Jul 12, 2022 •
edited
Loading

Hi, I'm struggling to add a ground overlay and I can't find examples in the documentation or other threads. I'm testing on Android.

This is what I have tested so far:

map.addGroundOverlay({
  visible: true,
  image: await ImageSource.fromUrl("https://maps.lib.utexas.edu/maps/historical/newark_nj_1922.jpg"),
  bearing: 0,
  zIndex: 10,
  // transparency: 0,
  bounds: {
    northeast: { lat: 40.773941, lng: -74.12544 },
    southwest: { lat: 40.712216, lng: -74.22655 }
  }
});

If I specify bounds I get this exception: "java.lang.IllegalArgumentException: Options doesn't specify a position".

map.addGroundOverlay({
  visible: true,
  image: await ImageSource.fromUrl("https://maps.lib.utexas.edu/maps/historical/newark_nj_1922.jpg"),
  bearing: 0,
  zIndex: 10,
  // transparency: 0,
  position: { lat: 40.773941, lng: -74.12544 },
  anchorU: 0,
  anchorV: 1,
  height: 1000,
  width: 1000
});

If instead I specify position, anchorU, anchorV, height and width, I get: "Error: java.lang.IllegalArgumentException: Location must be specified".

What is the correct way to initialise a ground overlay?
@tommag21
Copy link
Contributor Author

I tried editing the method intoNativeGroundOverlayOptions (link) and now I am able to add a ground overlay through bounds or position.

@nativescript/google-maps/utils/index.android.js:203:1

export function intoNativeGroundOverlayOptions(options) {
    var _a, _b;
    const opts = new com.google.android.gms.maps.model.GroundOverlayOptions();
    if (options === null || options === void 0 ? void 0 : options.position) {
        const coords = options.position;
        opts.position(new com.google.android.gms.maps.model.LatLng(coords.lat, coords.lng), options.width);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.width) === 'number') {
        opts.position(opts.getLocation(), options.width);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.height) === 'number') {
        opts.position(opts.getLocation(), opts.getWidth(), options.height);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.bounds) === 'object') {
        opts.positionFromBounds(new com.google.android.gms.maps.model.LatLngBounds(
            new com.google.android.gms.maps.model.LatLng(options.bounds.southwest.lat, options.bounds.southwest.lng),
            new com.google.android.gms.maps.model.LatLng(options.bounds.northeast.lat, options.bounds.northeast.lng)
        ))
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.transparency)) {
        opts.transparency(options.transparency);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.anchorU) === 'number' || typeof (options === null || options === void 0 ? void 0 : options.anchorV) === 'number') {
        opts.anchor((_a = options === null || options === void 0 ? void 0 : options.anchorU) !== null && _a !== void 0 ? _a : opts.getAnchorU(), (_b = options === null || options === void 0 ? void 0 : options.anchorV) !== null && _b !== void 0 ? _b : opts.getAnchorV());
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.tappable) === 'boolean') {
        opts.clickable(options.tappable);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.tappable) === 'boolean') {
        opts.clickable(options.tappable);
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.bearing) === 'number') {
        opts.bearing(options.bearing);
    }
    if ((options === null || options === void 0 ? void 0 : options.image) instanceof android.graphics.Bitmap) {
        opts.image(com.google.android.gms.maps.model.BitmapDescriptorFactory.fromBitmap(options === null || options === void 0 ? void 0 : options.image));
    }
    else if ((options === null || options === void 0 ? void 0 : options.image) instanceof ImageSource) {
        opts.image(com.google.android.gms.maps.model.BitmapDescriptorFactory.fromBitmap(options === null || options === void 0 ? void 0 : options.image.android));
    }
    if (typeof (options === null || options === void 0 ? void 0 : options.zIndex) === 'number') {
        opts.zIndex(options.zIndex);
    }
    return opts;
}

Now I will try on iOS.

@tommag21
Copy link
Contributor Author

tommag21 commented Jul 13, 2022 •
edited
Loading

Consulting iOS documentation it seems that a ground overlay can only be added with bounds, so I added these lines to the intoNativeGroundOverlayOptions iOS function (link).

@nativescript/google-maps/utils/index.ios.js:202:5

if (typeof (options === null || options === void 0 ? void 0 : options.bounds) === 'object') {
    let southWest = CLLocationCoordinate2DMake(options.bounds.southwest.lat, options.bounds.southwest.lng);
    let northEast = CLLocationCoordinate2DMake(options.bounds.northeast.lat, options.bounds.northeast.lng);
    opts.bounds = new GMSCoordinateBounds(southWest, northEast);
}

Works on iOS 15.5 simulator.

@tommag21
Copy link
Contributor Author

@triniwiz you might want to check this out. Should I create a pull request?

@tommag21 tommag21 changed the title [Question] @nativescript/google-maps: Adding a ground overlay [@nativescript/google-maps] Adding a ground overlay Jul 13, 2022
@triniwiz
Copy link
Member

@tommag21 LGTM 😄

@tommag21 tommag21 mentioned this issue Jul 15, 2022
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@triniwiz @tommag21