nativescript-google-maps-sdk
nativescript-google-maps-sdk copied to clipboard
dapriett
ns7/ios6.5.3 plugin v3.0.0 Can't find variable: NativeClass
v2.9.1 doesn't work at all. #433 patch works for android but not ios.
v2.9.1 with #433 gives this:
Error: This value is not a native object: let handler = MapViewDelegateImpl.new();
Tried v3.0.0 of plugin and it seems to work for android, but not IOS:
JavaScript error: file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:50:15: JS ERROR ReferenceError: Can't find variable: NativeClass (CoreFoundation) *** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: ReferenceError: Can't find variable: NativeClass at ../node_modules/nativescript-google-maps-sdk/map-view.js(file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:50:15)
I fixed the 2.9.1 error by applying this change https://github.com/NativeScript/ios-runtime/issues/818
Hi,
Which version of CLI and NS core-module ?
Did you try ns clean ? this will clean platforms, hooks, node_modules, package-lock.json
Hi, Which version of CLI and NS core-module ? Did you try
ns clean? this will clean platforms, hooks, node_modules, package-lock.json
Yes
@nativescript/core 7.0.13 NS version: 7.0.11
Having the same error:
NativeScript encountered a fatal error: Uncaught ReferenceError: NativeClass is not defined
at
../node_modules/nativescript-google-maps-sdk/map-view.js(file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:49:0)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at fn(file: src/webpack/bootstrap:120:0)
at ./app/app.module.ts(file: src/app/app.module.ts:42:2)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at fn(file: src/webpack/bootstrap:120:0)
at (file:///app/bundle.js:1820:73)
at ./main.ts(file:///app/bundle.js:1873:30)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at checkDeferredModules(file: src/webpack/bootstrap:43:0)
at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
at (file:///app/bundle.js:2:57)
at require(:1:137)
*** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: Uncaught ReferenceError: NativeClass is not defined
at
../node_modules/nativescript-google-maps-sdk/map-view.js(file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:49:0)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at fn(file: src/webpack/bootstrap:120:0)
at ./app/app.module.ts(file: src/app/app.module.ts:42:2)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at fn(file: src/webpack/bootstrap:120:0)
at (file:///app/bundle.js:1820:73)
at ./main.ts(file:///app/bundle.js:1873:30)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at checkDeferredModules(file: src/webpack/bootstrap:43:0)
at webpackJsonpCallback(file: src/webpack/bootstrap:30:0)
at (file:///app/bundle.js:2:57)
at require(:1:137)
', reason: '(null)'
and also this warning while compiling:
"export 'Style' (reexported as 'StyleBase') was not found in './map-view'
@ ../node_modules/nativescript-google-maps-sdk/map-view.js
@ ./app/app.module.ts
@ ./main.ts
NS doctor output:
✔ Getting environment information
No issues were detected.
✔ Your ANDROID_HOME environment variable is set and points to correct directory.
✔ Your adb from the Android SDK is correctly installed.
✔ The Android SDK is installed.
✔ A compatible Android SDK for compilation is found.
✔ Javac is installed and is configured properly.
✔ The Java Development Kit (JDK) is installed and is configured properly.
✔ Xcode is installed and is configured properly.
✔ xcodeproj is installed and is configured properly.
✔ CocoaPods are installed.
✔ CocoaPods update is not required.
✔ CocoaPods are configured properly.
✔ Your current CocoaPods version is newer than 1.0.0.
✔ Python installed and configured correctly.
✔ The Python 'six' package is found.
✔ Xcode version 12.2.0 satisfies minimum required version 10.
✔ Getting NativeScript components versions information...
✔ Component nativescript has 7.0.11 version and is up to date.
✔ Component @nativescript/core has 7.0.13 version and is up to date.
⚠ Update available for component @nativescript/ios. Your current version is 7.0.4 and the latest available version is 7.0.5.
✔ Component @nativescript/android has 7.0.1 version and is up to date.```
Hi,
I think there is a little problem with source code .. please copy/past this into your node_modules/nativescript-google-maps-sdk/map-view.ios.js this will work, in additions this code contains a correction of the bug with MyLocation button on ios.
Can you confirm if it is work, and please testing is the MyLocation button center the map on the user location (dont forged to enable and set location if you're using simulator).
You can use this until the plugin get updated.
import { MapViewBase, BoundsBase, CircleBase, MarkerBase, PolygonBase, PolylineBase, ProjectionBase, PositionBase, latitudeProperty, VisibleRegionBase, longitudeProperty, bearingProperty, zoomProperty, tiltProperty, getColorHue } from "./map-view-common";
import { GC, layout } from "@nativescript/core/utils";
import { Image, ImageSource } from "@nativescript/core";
export * from "./map-view-common";
var IndoorDisplayDelegateImpl = /** @class */ (function (_super) {
__extends(IndoorDisplayDelegateImpl, _super);
function IndoorDisplayDelegateImpl() {
return _super !== null && _super.apply(this, arguments) || this;
}
IndoorDisplayDelegateImpl.initWithOwner = function (owner) {
var handler = IndoorDisplayDelegateImpl.new();
handler._owner = owner;
return handler;
};
IndoorDisplayDelegateImpl.prototype.didChangeActiveBuilding = function (indoorBuilding) {
var owner = this._owner.get();
if (owner) {
var data = null;
if (indoorBuilding) {
var levels = [];
var count = 0;
while (count < indoorBuilding.levels.count) {
levels.push({
name: indoorBuilding.levels[count].name,
shortName: indoorBuilding.levels[count].shortName,
});
count += 1;
}
data = {
defaultLevelIndex: indoorBuilding.defaultLevelIndex,
levels: levels,
isUnderground: indoorBuilding.underground,
};
}
owner.notifyBuildingFocusedEvent(data);
}
};
IndoorDisplayDelegateImpl.prototype.didChangeActiveLevel = function (activateLevel) {
var owner = this._owner.get();
if (owner) {
var data = null;
if (activateLevel) {
data = {
name: activateLevel.name,
shortName: activateLevel.shortName,
};
}
owner.notifyIndoorLevelActivatedEvent(data);
}
};
IndoorDisplayDelegateImpl.ObjCProtocols = [GMSIndoorDisplayDelegate];
return IndoorDisplayDelegateImpl;
}(NSObject));
var MapViewDelegateImpl = /** @class */ (function (_super) {
__extends(MapViewDelegateImpl, _super);
function MapViewDelegateImpl() {
return _super !== null && _super.apply(this, arguments) || this;
}
MapViewDelegateImpl.initWithOwner = function (owner) {
var handler = MapViewDelegateImpl.new();
handler._owner = owner;
return handler;
};
MapViewDelegateImpl.prototype.mapViewIdleAtCameraPosition = function (mapView, cameraPosition) {
var owner = this._owner.get();
if (owner) {
owner._processingCameraEvent = true;
var cameraChanged = false;
if (owner.latitude != cameraPosition.target.latitude) {
cameraChanged = true;
latitudeProperty.nativeValueChange(owner, cameraPosition.target.latitude);
}
if (owner.longitude != cameraPosition.target.longitude) {
cameraChanged = true;
longitudeProperty.nativeValueChange(owner, cameraPosition.target.longitude);
}
if (owner.bearing != cameraPosition.bearing) {
cameraChanged = true;
bearingProperty.nativeValueChange(owner, cameraPosition.bearing);
}
if (owner.zoom != cameraPosition.zoom) {
cameraChanged = true;
zoomProperty.nativeValueChange(owner, cameraPosition.zoom);
}
if (owner.tilt != cameraPosition.viewingAngle) {
cameraChanged = true;
tiltProperty.nativeValueChange(owner, cameraPosition.viewingAngle);
}
if (cameraChanged) {
owner.notifyCameraEvent(MapViewBase.cameraChangedEvent, {
latitude: cameraPosition.target.latitude,
longitude: cameraPosition.target.longitude,
zoom: cameraPosition.zoom,
bearing: cameraPosition.bearing,
tilt: cameraPosition.viewingAngle
});
}
owner._processingCameraEvent = false;
}
};
MapViewDelegateImpl.prototype.mapViewDidChangeCameraPosition = function (mapView, cameraPosition) {
var owner = this._owner.get();
owner.notifyCameraEvent(MapViewBase.cameraMoveEvent, {
latitude: cameraPosition.target.latitude,
longitude: cameraPosition.target.longitude,
zoom: cameraPosition.zoom,
bearing: cameraPosition.bearing,
tilt: cameraPosition.viewingAngle
});
};
MapViewDelegateImpl.prototype.mapViewDidTapAtCoordinate = function (mapView, coordinate) {
var owner = this._owner.get();
if (owner) {
var position = Position.positionFromLatLng(coordinate.latitude, coordinate.longitude);
owner.notifyPositionEvent(MapViewBase.coordinateTappedEvent, position);
}
};
MapViewDelegateImpl.prototype.mapViewDidLongPressAtCoordinate = function (mapView, coordinate) {
var owner = this._owner.get();
if (owner) {
var position = Position.positionFromLatLng(coordinate.latitude, coordinate.longitude);
owner.notifyPositionEvent(MapViewBase.coordinateLongPressEvent, position);
}
};
MapViewDelegateImpl.prototype.mapViewDidTapMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
if (marker) {
owner.notifyMarkerTapped(marker);
}
}
return false;
};
MapViewDelegateImpl.prototype.mapViewDidTapOverlay = function (mapView, gmsOverlay) {
var owner = this._owner.get();
if (owner) {
var shape = owner.findShape(function (shape) { return shape.ios == gmsOverlay; });
if (shape) {
owner.notifyShapeTapped(shape);
}
}
};
MapViewDelegateImpl.prototype.mapViewDidBeginDraggingMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
owner.notifyMarkerBeginDragging(marker);
}
};
MapViewDelegateImpl.prototype.mapViewDidEndDraggingMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
owner.notifyMarkerEndDragging(marker);
}
};
MapViewDelegateImpl.prototype.mapViewDidDragMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
owner.notifyMarkerDrag(marker);
}
};
MapViewDelegateImpl.prototype.mapViewDidTapInfoWindowOfMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
owner.notifyMarkerInfoWindowTapped(marker);
}
};
MapViewDelegateImpl.prototype.mapViewDidCloseInfoWindowOfMarker = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (owner) {
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
owner.notifyMarkerInfoWindowClosed(marker);
}
};
MapViewDelegateImpl.prototype.didTapMyLocationButtonForMapView = function (mapView) {
var owner = this._owner.get();
if (owner) {
owner.notifyMyLocationTapped();
// Should return false in order to center the map on user position
return false;
}
return true;
};
MapViewDelegateImpl.prototype.mapViewMarkerInfoWindow = function (mapView, gmsMarker) {
return null;
};
MapViewDelegateImpl.prototype.mapViewMarkerInfoContents = function (mapView, gmsMarker) {
var owner = this._owner.get();
if (!owner)
return null;
var marker = owner.findMarker(function (marker) { return marker.ios == gmsMarker; });
var content = owner._getMarkerInfoWindowContent(marker);
if (content) {
var width = Number(content.width);
if (Number.isNaN(width))
width = null;
var height = Number(content.height);
if (Number.isNaN(height))
height = null;
if (!height || !width) {
var bounds = UIScreen.mainScreen.bounds;
width = width || (bounds.size.width * .7);
height = height || (bounds.size.height * .4);
}
this._layoutRootView(content, CGRectMake(0, 0, width, height));
return content.ios;
}
return null;
};
/*
Replacement for _layoutRootView method removed in NativeScript 6
*/
MapViewDelegateImpl.prototype._layoutRootView = function (rootView, parentBounds) {
if (!rootView || !parentBounds) {
return;
}
var size = parentBounds.size;
var width = layout.toDevicePixels(size.width);
var height = layout.toDevicePixels(size.height);
var widthSpec = layout.makeMeasureSpec(width, layout.EXACTLY);
var heightSpec = layout.makeMeasureSpec(height, layout.EXACTLY);
rootView.measure(widthSpec, heightSpec);
var origin = parentBounds.origin;
var left = origin.x;
var top = origin.y;
rootView.layout(left, top, width, height);
};
MapViewDelegateImpl.ObjCProtocols = [GMSMapViewDelegate];
return MapViewDelegateImpl;
}(NSObject));
export class MapView extends MapViewBase {
constructor() {
super();
this._markers = new Array();
this.nativeView = GMSMapView.mapWithFrameCamera(CGRectZero, this._createCameraPosition());
this._delegate = MapViewDelegateImpl.initWithOwner(new WeakRef(this));
this._indoorDelegate = IndoorDisplayDelegateImpl.initWithOwner(new WeakRef(this));
this.updatePadding();
}
onLoaded() {
super.onLoaded();
this.nativeView.delegate = this._delegate;
this.nativeView.indoorDisplay.delegate = this._indoorDelegate;
this.notifyMapReady();
}
onUnloaded() {
this.nativeView.delegate = null;
this.nativeView.indoorDisplay.delegate = null;
super.onUnloaded();
}
disposeNativeView() {
this._markers = null;
this._delegate = null;
this._indoorDelegate = null;
super.disposeNativeView();
GC();
}
;
_createCameraPosition() {
return GMSCameraPosition.cameraWithLatitudeLongitudeZoomBearingViewingAngle(this.latitude, this.longitude, this.zoom, this.bearing, this.tilt);
}
updateCamera() {
if (this.mapAnimationsEnabled) {
this.nativeView.animateToCameraPosition(this._createCameraPosition());
}
else {
this.nativeView.camera = this._createCameraPosition();
}
}
setViewport(bounds, padding) {
var p = UIEdgeInsetsMake(padding, padding, padding, padding) || this.gMap.padding;
let cameraPosition = this.nativeView.cameraForBoundsInsets(bounds.ios, p);
if (this.mapAnimationsEnabled) {
this.nativeView.animateToCameraPosition(cameraPosition);
}
else {
this.nativeView.camera = cameraPosition;
}
}
updatePadding() {
if (this.padding) {
this.gMap.padding = UIEdgeInsetsMake(this.padding[0] || 0, this.padding[2] || 0, this.padding[1] || 0, this.padding[3] || 0);
}
}
get ios() {
throw new Error('Now use instance.nativeView instead of instance.ios');
}
get gMap() {
return this.nativeView;
}
get projection() {
return new Projection(this.nativeView.projection);
}
get settings() {
return (this.nativeView) ? new UISettings(this.nativeView.settings) : null;
}
get myLocationEnabled() {
return (this.nativeView) ? this.nativeView.myLocationEnabled : false;
}
set myLocationEnabled(value) {
if (this.nativeView)
this.nativeView.myLocationEnabled = value;
}
setMinZoomMaxZoom() {
this.gMap.setMinZoomMaxZoom(this.minZoom, this.maxZoom);
}
addMarker(...markers) {
if (!markers || !this._markers || !this.gMap)
return null;
markers.forEach(marker => {
marker.ios.map = this.gMap;
this._markers.push(marker);
});
}
removeMarker(...markers) {
if (!markers || !this._markers || !this.gMap)
return null;
markers.forEach(marker => {
this._unloadInfoWindowContent(marker);
marker.ios.map = null;
this._markers.splice(this._markers.indexOf(marker), 1);
});
}
removeAllMarkers() {
if (!this._markers)
return null;
this._markers.forEach(marker => {
this._unloadInfoWindowContent(marker);
marker.ios.map = null;
});
this._markers = [];
}
findMarker(callback) {
if (!this._markers)
return null;
return this._markers.find(callback);
}
addPolyline(shape) {
if (!this._shapes)
return null;
shape.loadPoints();
shape.ios.map = this.gMap;
this._shapes.push(shape);
}
addPolygon(shape) {
if (!this._shapes)
return null;
shape.ios.map = this.gMap;
this._shapes.push(shape);
}
addCircle(shape) {
if (!this._shapes)
return null;
shape.ios.map = this.gMap;
this._shapes.push(shape);
}
removeShape(shape) {
if (!this._shapes)
return null;
shape.ios.map = null;
this._shapes.splice(this._shapes.indexOf(shape), 1);
}
removeAllShapes() {
if (!this._shapes)
return null;
this._shapes.forEach(shape => {
shape.ios.map = null;
});
this._shapes = [];
}
findShape(callback) {
if (!this._shapes)
return null;
return this._shapes.find(callback);
}
clear() {
this._markers = [];
this.nativeView.clear();
}
setStyle(style) {
try {
this.nativeView.mapStyle = GMSMapStyle.styleWithJSONStringError(JSON.stringify(style));
return true;
}
catch (err) {
return false;
}
}
}
export class UISettings {
constructor(ios) {
this._ios = ios;
}
get ios() {
return this._ios;
}
get compassEnabled() {
return this._ios.compassButton;
}
set compassEnabled(value) {
this._ios.compassButton = value;
}
get indoorLevelPickerEnabled() {
return this._ios.indoorPicker;
}
set indoorLevelPickerEnabled(value) {
this._ios.indoorPicker = value;
}
get mapToolbarEnabled() {
return false;
}
set mapToolbarEnabled(value) {
if (value)
console.warn("Map toolbar not available on iOS");
}
get myLocationButtonEnabled() {
return this._ios.myLocationButton;
}
set myLocationButtonEnabled(value) {
this._ios.myLocationButton = value;
}
get rotateGesturesEnabled() {
return this._ios.rotateGestures;
}
set rotateGesturesEnabled(value) {
this._ios.rotateGestures = value;
}
get scrollGesturesEnabled() {
return this._ios.scrollGestures;
}
set scrollGesturesEnabled(value) {
this._ios.scrollGestures = value;
}
get tiltGesturesEnabled() {
return this._ios.tiltGestures;
}
set tiltGesturesEnabled(value) {
this._ios.tiltGestures = value;
}
get zoomControlsEnabled() {
return false;
}
set zoomControlsEnabled(value) {
if (value)
console.warn("Zoom controls not available on iOS");
}
get zoomGesturesEnabled() {
return this._ios.zoomGestures;
}
set zoomGesturesEnabled(value) {
this._ios.zoomGestures = value;
}
}
export class Projection extends ProjectionBase {
constructor(ios) {
super();
this._ios = ios;
}
get ios() {
return this._ios;
}
get visibleRegion() {
return new VisibleRegion(this.ios.visibleRegion());
}
fromScreenLocation(point) {
var location = this.ios.coordinateForPoint(CGPointMake(point.x, point.y));
return new Position(location);
}
toScreenLocation(position) {
var cgPoint = this.ios.pointForCoordinate(position.ios);
return {
x: cgPoint.x,
y: cgPoint.y
};
}
}
export class VisibleRegion extends VisibleRegionBase {
constructor(ios) {
super();
this._ios = ios;
}
get ios() {
return this._ios;
}
get nearLeft() {
return new Position(this.ios.nearLeft);
}
get nearRight() {
return new Position(this.ios.nearRight);
}
get farLeft() {
return new Position(this.ios.farLeft);
}
get farRight() {
return new Position(this.ios.farRight);
}
get bounds() {
return new Bounds(GMSCoordinateBounds.alloc().initWithRegion(this.ios));
}
}
export class Bounds extends BoundsBase {
constructor(ios) {
super();
this._ios = ios;
}
get ios() {
return this._ios;
}
get southwest() {
return new Position(this.ios.southWest);
}
get northeast() {
return new Position(this._ios.northEast);
}
static fromCoordinates(southwest, northeast) {
return new Bounds(GMSCoordinateBounds.alloc().initWithCoordinateCoordinate(southwest.ios, northeast.ios));
}
}
export class Position extends PositionBase {
constructor(ios) {
super();
this._ios = ios || CLLocationCoordinate2DMake(0, 0);
}
get ios() {
return this._ios;
}
get latitude() {
return this._ios.latitude;
}
set latitude(latitude) {
this._ios = CLLocationCoordinate2DMake(latitude, this.longitude);
}
get longitude() {
return this._ios.longitude;
}
set longitude(longitude) {
this._ios = CLLocationCoordinate2DMake(this.latitude, longitude);
}
static positionFromLatLng(latitude, longitude) {
let position = new Position();
position.latitude = latitude;
position.longitude = longitude;
return position;
}
}
export class Marker extends MarkerBase {
constructor() {
super();
this._alpha = 1;
this._visible = true;
this._ios = GMSMarker.new();
}
static getIconForColor(hue) {
const hueKey = hue.toFixed(8);
if (!Marker.cachedColorIcons[hueKey]) {
const icon = GMSMarker.markerImageWithColor(UIColor.colorWithHueSaturationBrightnessAlpha(hue, 1, 1, 1));
Marker.cachedColorIcons[hueKey] = icon;
}
return Marker.cachedColorIcons[hueKey];
}
get position() {
return new Position(this._ios.position);
}
set position(position) {
this._ios.position = position.ios;
}
get rotation() {
return this._ios.rotation;
}
set rotation(value) {
this._ios.rotation = value;
}
get zIndex() {
return this._ios.zIndex;
}
set zIndex(value) {
this._ios.zIndex = value;
}
get title() {
return this._ios.title;
}
set title(title) {
this._ios.title = title;
}
get snippet() {
return this._ios.snippet;
}
set snippet(snippet) {
this._ios.snippet = snippet;
}
showInfoWindow() {
this._ios.map.selectedMarker = this._ios;
}
isInfoWindowShown() {
return this._ios.map.selectedMarker == this._ios;
}
hideInfoWindow() {
this._ios.map.selectedMarker = null;
}
get color() {
return this._color;
}
set color(value) {
value = getColorHue(value);
this._color = value;
if (this._color) {
this._ios.icon = Marker.getIconForColor(this._color / 360);
}
else {
this._ios.icon = null;
}
}
get icon() {
return this._icon;
}
set icon(value) {
if (typeof value === 'string') {
var tempIcon = new Image();
tempIcon.imageSource = ImageSource.fromResourceSync(String(value));
value = tempIcon;
}
this._icon = value;
this._ios.icon = (value) ? this._icon.imageSource.ios : null;
}
get alpha() {
return this._alpha;
}
set alpha(value) {
this._alpha = value;
if (this._visible)
this._ios.opacity = value;
}
get visible() {
return this._visible;
}
set visible(value) {
this._visible = value;
this._ios.opacity = (this._visible) ? this._alpha : 0;
}
get flat() {
return this._ios.flat;
}
set flat(value) {
this._ios.flat = value;
}
get anchor() {
return [this._ios.groundAnchor.x, this._ios.groundAnchor.y];
}
set anchor(value) {
this._ios.groundAnchor = CGPointMake(value[0], value[1]);
}
get draggable() {
return this._ios.draggable;
}
set draggable(value) {
this._ios.draggable = value;
}
get ios() {
return this._ios;
}
}
Marker.cachedColorIcons = {};
export class Polyline extends PolylineBase {
constructor() {
super();
this._ios = GMSPolyline.new();
this._points = [];
}
get clickable() {
return this._ios.tappable;
}
set clickable(value) {
this._ios.tappable = value;
}
get zIndex() {
return this._ios.zIndex;
}
set zIndex(value) {
this._ios.zIndex = value;
}
loadPoints() {
var points = GMSMutablePath.new();
this._points.forEach(function (point) {
points.addCoordinate(point.ios);
}.bind(this));
this._ios.path = points;
}
reloadPoints() {
this.loadPoints();
}
get width() {
return this._ios.strokeWidth;
}
set width(value) {
this._ios.strokeWidth = value;
}
get color() {
return this._color;
}
set color(value) {
this._color = value;
this._ios.strokeColor = value.ios;
}
get geodesic() {
return this._ios.geodesic;
}
set geodesic(value) {
this._ios.geodesic = value;
}
get ios() {
return this._ios;
}
}
export class Polygon extends PolygonBase {
constructor() {
super();
this._ios = GMSPolygon.new();
this._points = [];
this._holes = [];
}
get clickable() {
return this._ios.tappable;
}
set clickable(value) {
this._ios.tappable = value;
}
get zIndex() {
return this._ios.zIndex;
}
set zIndex(value) {
this._ios.zIndex = value;
}
loadPoints() {
var points = GMSMutablePath.new();
this._points.forEach((point) => {
points.addCoordinate(point.ios);
});
this._ios.path = points;
}
loadHoles() {
var holes = [];
this._holes.forEach((hole) => {
var points = GMSMutablePath.new();
hole.forEach((point) => {
points.addCoordinate(point.ios);
});
holes.push(points);
});
this._ios.holes = holes;
}
reloadPoints() {
this.loadPoints();
}
reloadHoles() {
this.loadHoles();
}
get strokeWidth() {
return this._ios.strokeWidth;
}
set strokeWidth(value) {
this._ios.strokeWidth = value;
}
get strokeColor() {
return this._strokeColor;
}
set strokeColor(value) {
this._strokeColor = value;
this._ios.strokeColor = value.ios;
}
get fillColor() {
return this._fillColor;
}
set fillColor(value) {
this._fillColor = value;
this._ios.fillColor = value.ios;
}
get ios() {
return this._ios;
}
}
export class Circle extends CircleBase {
constructor() {
super();
this._ios = GMSCircle.new();
}
get clickable() {
return this._ios.tappable;
}
set clickable(value) {
this._ios.tappable = value;
}
get zIndex() {
return this._ios.zIndex;
}
set zIndex(value) {
this._ios.zIndex = value;
}
get center() {
return this._center;
}
set center(value) {
this._center = value;
this._ios.position = value.ios;
}
get radius() {
return this._ios.radius;
}
set radius(value) {
this._ios.radius = value;
}
get strokeWidth() {
return this._ios.strokeWidth;
}
set strokeWidth(value) {
this._ios.strokeWidth = value;
}
get strokeColor() {
return this._strokeColor;
}
set strokeColor(value) {
this._strokeColor = value;
this._ios.strokeColor = value.ios;
}
get fillColor() {
return this._fillColor;
}
set fillColor(value) {
this._fillColor = value;
this._ios.fillColor = value.ios;
}
get ios() {
return this._ios;
}
}
Same error here:
(CoreFoundation) *** Terminating app due to uncaught exception 'NativeScript encountered a fatal error: Uncaught ReferenceError: NativeClass is not defined at ../node_modules/nativescript-google-maps-sdk/map-view.js(file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:49:0)
Any news yet?
package.json: ... "@nativescript/angular": "10.1.0" "nativescript-google-maps-sdk": "3.0.1" "@nativescript/ios": "7.0.5"
Hi @pvcoelho,
When you run ns clean that will remove node_modules, and if you run jut after ns run ios you will get the code from npm package.
Now, run :
ns clean && npm i
then copy/past the code in node_modules/nativescript-google-maps-sdk/map-view.ios.js
Hi @kefahB ,
I've tried your workaround and it works like a charm! At least we've got a solution until new version of plugin is released. Thanks a lot!
Hi @kefahB ,
I can confirm too, the fix you posted works. Thank you so much. Is PR #446 the one we have to follow to get notified when this fix will be available on the master branch?
Hi @MrSnoozles Thanks to your confirm. This PR contain a fix for the MyLocation button, but I think the problem of NativeClass comme from the plugin build process (from ts-patch) exactly... Waiting from the owner to push a new version.
Did you try the MyLocation button on ios ? Is work for you ?
MyLocation button is not working for me with [email protected] on ios.
I don't know how to integrate your changes from #446 as I don't have a map-view.ios.ts. I just have a map-view.ios.js in my project. If I swap the return true; and return false; statements like you did in that PR, the MyLocation button correctly brings me to my current location 👍
@Burgov I didn't understand why the npm version does not work !
Did you mean that the issue about NativeClass still same ?
Could be the src/package-loc.json that was not updated on the PR request !!?
Can confirm issue still exists on v3.0.2
✔ Component nativescript has 7.0.12 version and is up to date.
✔ Component @nativescript/core has 7.0.13 version and is up to date.
✔ Component @nativescript/ios has 7.0.6 version and is up to date.
IOS 14.3
***** Fatal JavaScript exception - application has been terminated. *****
NativeScript encountered a fatal error: Uncaught ReferenceError: NativeClass is not defined
at
../node_modules/nativescript-google-maps-sdk/map-view.js(file: node_modules/nativescript-google-maps-sdk/map-view.ios.js:49:0)
at __webpack_require__(file: src/webpack/bootstrap:816:0)
at fn(file: src/webpack/bootstrap:120:0)
I'm guessing the @nativescript/webpack/transformers/ns-transform-native-classes isn't applied during the build process for whatever reason.
you can try to add local lib.
- Download this nativescript-googlemaps-3.0.3.tgz.zip
-
mkdir <PROJECT_DIR>/libs && mv nativescript-googlemaps-3.0.3.tgz.zip mkdir <PROJECT_DIR>/libs/nativescript-googlemaps-3.0.3.tgz - Then alter your package.json:
...
"dependencies": {
...
"nativescript-google-maps-sdk": "file:libs/nativescript-googlemaps-3.0.3.tgz",
...
Bug in your code above,
mkdir <PROJECT_DIR>/libs && mv nativescript-googlemaps-3.0.3.tgz.zip mkdir <PROJECT_DIR>/libs/nativescript-googlemaps-3.0.3.tgz
Remove mkdir command
Change to mkdir <PROJECT_DIR>/libs && mv nativescript-googlemaps-3.0.3.tgz.zip <PROJECT_DIR>/libs/nativescript-googlemaps-3.0.3.tgz
Still not working with downloaded zip file, any page with a mapView fails to load with no error.
<maps:mapView mapReady="onMapReady" latitude="{{ latitude }}" longitude="{{ longitude }}" zoom="17" row="5" col="0" colSpan="3" height="65%" verticalAlignment="top"/>
Remove the mapView above and the page loads.
ns plugin list includes nativescript-google-maps-sdk │ file:libs/nativescript-googlemaps-3.0.3.tgz
✔ Component nativescript has 7.1.2 version and is up to date. ✔ Component @nativescript/core has 7.1.4 version and is up to date. ✔ Component @nativescript/ios has 7.1.1 version and is up to date.
What if im getting "export 'Style' (reexported as 'StyleBase') was not found in './map-view' but when on android? This is full error:
WARNING in ../node_modules/nativescript-google-maps-sdk/map-view-common.js 81:0-30 "export 'Style' (reexported as 'StyleBase') was not found in './map-view' @ ../node_modules/nativescript-google-maps-sdk/map-view.js @ ./app.js
what i should change in 'map-view-common.js' ?
Based on @kefahB suggested I have created custom local package so each time we didn't need to change in node_modules/nativescript-google-maps-sdk/map-view.ios.js.
you can download package here: https://github.com/jitendraP-ashutec/nativescript-googlemap-sdk-package/blob/main/nativescript-google-maps-sdk-4.0.0.tgz
and place this file into root folder in your project and run below command to install this package into locally:
npm install nativescript-google-maps-sdk-4.0.0.tgz
I have tested it on Nativescript 7.0.10 and Angular 10.1.5.
What if im getting "export 'Style' (reexported as 'StyleBase') was not found in './map-view' but when on android? This is full error:
WARNING in ../node_modules/nativescript-google-maps-sdk/map-view-common.js 81:0-30 "export 'Style' (reexported as 'StyleBase') was not found in './map-view' @ ../node_modules/nativescript-google-maps-sdk/map-view.js @ ./app.js
what i should change in 'map-view-common.js' ?
same here, any news for android?
@jitendraP-ashutec works if you don't want to keep updating node_modules. Best solution so far. Really wish they fixed this though.
@jitendraP-ashutec I have downloaded nativescript-google-maps-sdk-4.0.0.tgz, added it to the root of my project, done a ns clean followed by an npm install and npm install nativescript-google-maps-sdk-4.0.0.tgz ... But I'm still getting the following error: export 'Style' (reexported as 'StyleBase') was not found in './map-view.
I've triple checked node_modules/nativescript-google-maps-sdk and can see your version is in use:
I'm assuming this error would be the reason for the map not displaying correctly for me?
Any thoughts?
Thanks!
Hello there
I've also been having issues with an app that works on Android, but upon trying to set it up on iOS the plugin does not work. I've tried both solutions listed above (the direct change to the plugin file and the customized 4.0.0.tgz) but I'm still stuck on an error reading "Error: Now use instance.nativeView instead of instance.ios". I get the same with both and as soon as the page containing the plugin is opened, the app crashes. This error appears in the customized code:
get ios() {
throw new Error('Now use instance.nativeView instead of instance.ios');
}
however, I do not know how this ios() function is called and how to 'use instance.nativeView'.
Any hints?
