Closed luiguild closed 2 years ago
I did something similar. Here is what worked for me - It may be helpful...
Line style is implemented differently in the IOS and Android SDKs. For android you can do something like
//assumes Circle object theCircle and Screen from @nativescript/core
let list = new java.util.ArrayList();
let scale = Screen.mainScreen.scale*4; //adjust scale for your preference
list.add(new com.google.android.gms.maps.model.Dash(scale));
list.add(new com.google.android.gms.maps.model.Gap(scale));
theCircle.android.strokePattern(list);
For IOS I don't see support for GMSStyleSpan on Circles but I suppose you could render a Polyline instead and use .spans
//assumes Polyline object thePolyline, MapView object mapView and Screen from @nativescript/core
let zoom = mapView.gMap.camera.zoom;
let diameterOfEarth=12742000;
let scale = (2 * Screen.mainScreen.scale * diameterOfEarth)/ (256 * Math.pow(2, zoom));
let lengths = [scale, scale];
let pattern = [
GMSStrokeStyle.solidColor(thePolyline.ios.strokeColor),
GMSStrokeStyle.solidColor(UIColor.clearColor)
];
thePolyline.ios.spans = GMSStyleSpans(thePolyline.ios.path, pattern, lengths, kGMSLengthRhumb);
mapView.on("cameraChanged", (event) => {
if (zoom != mapView.gMap.camera.zoom) {
zoom = mapView.gMap.camera.zoom;
scale = (2* Screen.mainScreen.scale * 12742000) / (256 * Math.pow(2, zoom));
thePolyline.ios.spans = GMSStyleSpans(thePolyline.ios.path, pattern,[scale, scale], kGMSLengthRhumb);
}
});
You will need to adapt this for your own project/variables etc.
worked perfectly! like a charm! thank you so much @nickolanack
I need to reproduce this style on my circles, how can be made?