optimize speed display GEOJSON on google api - google-maps-api-3

I'am displaying geojson with the function below. In my geojson file, I've approximately 12 000 records and the display lag.. is slow. Do you know a way to optimize speed ?
Data displying are polylines.
countyLayer = new google.maps.Data();
countyLayer.loadGeoJson('orange.json');
countyLayer.setMap(map);
countyLayer.setStyle(function(feature) {
return /** #type {google.maps.Data.StyleOptions} */({
strokeColor: "#2D241E",
strokeWeight: feature.getProperty('stroke')/7
});
});
Thanks

Related

Unable to download ERA5 land hourly data via Google earth engine platform recently

Recently I find that I can't download ERA5 land hourly data via Google Earth Engine, and the following code can only return null. But if I replace the first row with "var era51 = ee.ImageCollection('ECMWF/ERA5/DAILY')", it could return the images. Is there something wrong with the ERA5 land hourly data?
Here is the code:
var era51 = ee.ImageCollection("ECMWF/ERA5_LAND/HOURLY")
.filterDate('2018-01-01', '2018-02-02')
.select('total_precipitation');
function exportImageCollection(imgCol) {
var indexList = imgCol.reduceColumns(ee.Reducer.toList(), ["system:index"])
.get("list");
indexList.evaluate(function(indexs) {
for (var i=0; i<indexs.length; i++) {
var image = imgCol.filter(ee.Filter.eq("system:index", indexs[i])).first();
print(image)
}
});
}
exportImageCollection(era51);
EDIT: Turns out that it was a problem on the Dataset side. It is now fixed. Happy downloading :)
Same problem here, about last week my script worked smoothly, but today it just fails. I use to work with the python API, but I've been able to download Landsat-[5,8] images with no problem.
I tried to use Earth Engine Javascript API to download the same area with both: an URL (image.GetDownloadURL()) and to Drive (Export.image.toDrive()); but both approaches also failed.
Tests in Javascript API:
var imgcol = ee.ImageCollection("ECMWF/ERA5_LAND/HOURLY");
var subset = imgcol.filterDate("2010-09-11T10", "2010-09-11T11").filterBounds(geometry);
var img = subset.map(function(x){return x.clip(geometry);}).first();
Map.addLayer(subset.select("surface_latent_heat_flux"))
var url = img.getDownloadURL(
{
name: 'single_band',
bands: ['surface_latent_heat_flux'],
region: geometry
}
);
print(url); //url is printed but fails in the download
Export.image.toDrive(
{
image: img,
description: 'LET',
folder: 'ee_test',
region: geometry,
scale: 9000
});
Could it be an error in Earth Engine end?
EDIT: Turns out that it was a problem on the Dataset side. It is now fixed. Happy downloading :)

Flutter : polylines show straight line

Im implementing a flutter app to display polylines by flutter google maps plugin, But It only shows a straight line between those two points rather than showing actual route, I'm not quite sure what needed to do.
Here my add markers function
void addMarker() {
latlng.add(LatLng(5.973804, 80.429838));
allMarkers.add(Marker(
markerId: MarkerId('busLoc'),
draggable: true,
onTap: () {
print('Marker Tapped');
},
position: LatLng(5.973804, 80.429838),
));
_polyline.add(Polyline(
color: Colors.blue,
visible: true,
points: latlng,
polylineId: PolylineId("distance"),
));
Here my scaffold
GoogleMap(
polylines: _polyline,
markers: Set.from(allMarkers),
initialCameraPosition:
CameraPosition(target: LatLng(widget.la, widget.l0), zoom: 14),
mapType: MapType.normal,
),
And I'll attach screenshot below as well
To get the route from point A to point B you will need to use Directions API that is available on the google_maps_webservice flutter package, which is a service from Google Maps Platform that gives the route information
One of the route information is the overview_polyline that holds an encoded polyline representation of the route.
You can get the overview_polyline by having a function that sends request to Directions API using the google_maps_webservice package like this:
import 'package:google_maps_webservice/directions.dart' as directions;
final _directions = new directions.GoogleMapsDirections(apiKey: "YOUR_API_KEY");
var overviewPolylines;
directions.DirectionsResponse dResponse = await _directions.directionsWithAddress(
_originAddress,
_destinationAddress,
);
if (dResponse.isOkay) {
for (var r in dResponse.routes) {
overviewPolylines = r.overviewPolyline.points
}
}
Then, once you get the overview_polyline from Directions API using the sample code above, you will need to decode it using the PolyUtil(); method from the google_maps_util flutter package like this:
import 'package:google_maps_util/google_maps_util.dart';
PolyUtil myPoints = PolyUtil();
var pointArray = myPoints.decode(overviewPolylines);
Once decoded you can pass the pointArray to your polyline object like this:
_polyline.add(Polyline(
color: Colors.blue,
visible: true,
points: pointArray,
polylineId: PolylineId("distance"),
));
it shows straight line because you have in your polyline only two points, so the expected behavior is to draw a line from one point to the other
you have to use google direction API here is an article explains how to draw route between two points in flutter.
https://medium.com/flutter-community/drawing-route-lines-on-google-maps-between-two-locations-in-flutter-4d351733ccbe

Geometry has too many edges (Google Earth Engine). Help me

I have problem during working in Google Earth Engine. I was processing some vector files. And i am getting below code:
The geometry has too many vertices. You can try to simplify it using:
// Get a feature collection and subset the first feature.
var feature = ee.FeatureCollection("TIGER/2018/States").first();
// Simplify the feature - think of max error as resolution.
// Setting to 100 means that the geometry is accurate to
// within 100 meters, for example.
var featureSimple = ee.Feature(feature).simplify({maxError: 100});
or for a ee.FeatureCollection:
// Get a feature collection.
var featureCol = ee.FeatureCollection("TIGER/2018/States");
// Simplify each feature in the collection, by mapping the
// .simplify() function over it.
var simplifiedCol = featureCol.map(function(feature) {
return feature.simplify({maxError: 100});
});

Enter zipcode and display users within a certain radius

I have a Meteor app where product providers enter their zip code when registering.
This data is stored in users.profile.zipcode.
Flow:
1. Anyone visiting the site can enter a zip code in a search field.
2. A list of product providers with zipcodes within 10 kilometers of that zip code is displayed.
The app will be for Norwegian users to begin with, but will maybe be expanded to different countries in the future.
Can someone provide me with example code of how this can be done, i guess using the Google API or something similar? I'm pretty new to JavaScript so a complete example would be very much appreciated. Hopefully using Meteor.Publish and Meteor.Subscribe, including the display of the data.
Thank you in advance!
First you will have to convert ZIP code to coordinates, there is a zipcodes lib - for US and Canada only, if you're targeted other region/country libs can be easily found on NPM.
For example we have a Meteor Method which accepts form with zipcode field:
import zipcodes from 'zipcodes';
// Create `2dsphere` index
const collection = new Mongo.Collection('someCollectionName');
collection._ensureIndex({zipLoc: '2dsphere'});
Meteor.Methods({
formSubmit(data) {
const zipData = zipcodes.lookup(data.zipcode);
// Save location as geospatial data:
collection.insert({
zipLoc: {
type: "Point",
coordinates: [zipData.longitude, zipData.latitude]
}
});
}
});
To search within radius use next code:
const searchRadius = 10000; // 10km in meters
const zip = 90210;
const zipData = zipcodes.lookup(zip);
collection.find({
zipLoc: {
$near: {
$geometry: [zipData.longitude, zipData.latitude],
$maxDistance: searchRadius
}
}
});
Further reading:
zipcodes NPM library
MongoDB: Geospatial Queries
MongoDB: $near
MongoDB: $geometry
MongoDB: 2dsphere Indexes

openlayers show half wms layer with googlemap v3 api

Hi I need to show some shapefiles over a map, for that I use geoserver, openlayers and google maps V3, it works as far I do not use OpenLayers.Layer.Google, I can see my shapefile.
This is my working code:
var map = new OpenLayers.Map('map');
var ghyb = new OpenLayers.Layer.Google(
"Google Hybrid",
{type: google.maps.MapTypeId.HYBRID, numZoomLevels: 30,srs:'EPSG:2077'}
// used to be {type: G_HYBRID_MAP, numZoomLevels: 20}
);
var wms = new OpenLayers.Layer.WMS( "Italy WMS",
"http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} );
var regioni_wms = new OpenLayers.Layer.WMS(
"comuni",
"http://localhost:8080/geoserver/wms",
{
layers: "prov2011_g" ,
transparent: "true",
format: "image/png",
srs:'EPSG:2077',
},
{isBaseLayer: false}
);
map.addLayer(regioni_wms);
//map.addLayer(ghyb);
map.addLayer(wms)
map.zoomToMaxExtent();
if I add the layer ghyb to the map, only half of my polygon is rendered and if zoom in it disappears.I do not know if is a problem of mercator nor how to fix it.
Google layers are only projected in EPSG 900913. If you try to use anything else it is doubtful it will work. The good news is that Geoserver will reproject your wms service on the fly to EPSG 9000913. I would suggest chaniging to this projection in both your layers and seeing if that makes a difference.
One thing to note about this is if you are trying to print your layers they will not be to scale along the x axis. Also if you are using a measuring tool on your website you will need to ensure it can operate in a geodesic fassion.

Resources