mapView.getLayers().clear(); mapView.setTilt(60, 0);

const mapUrl = 'https://{s}.basemaps.cartocdn.com/light_all/{zoom}/{x}/{y}@1x.png'; const httpDataSource = new CartoMobileSDK.HTTPTileDataSource(0.0, 24.0, mapUrl); const rasterTileLayer = new CartoMobileSDK.RasterTileLayer(httpDataSource); mapView.getLayers().add(rasterTileLayer);

window.localDataSource = new CartoMobileSDK.LocalVectorDataSource(new CartoMobileSDK.EPSG3857()); const vectorLayer = new CartoMobileSDK.VectorLayer(localDataSource); mapView.getLayers().add(vectorLayer);

const pos = new CartoMobileSDK.MapPos(-8237821, 4970805); const markerStyleBuilder = new CartoMobileSDK.MarkerStyleBuilder(); markerStyleBuilder.setSize(20.0); const marker = new CartoMobileSDK.Marker(pos, markerStyleBuilder.buildStyle()); localDataSource.add(marker);

const poses = new CartoMobileSDK.MapPosVector(); poses.push_back(new CartoMobileSDK.MapPos(-8237821, 4970805)); poses.push_back(new CartoMobileSDK.MapPos(-8238832, 4970287)); const lineStyleBuilder = new CartoMobileSDK.LineStyleBuilder(); const color = new CartoMobileSDK.Color(255, 0, 0, 125); lineStyleBuilder.setColor(color); const line = new CartoMobileSDK.Line(poses, lineStyleBuilder.buildStyle()); localDataSource.add(line);