How would you change the basemap string in a leaflet / mapbox app depending on time of day? I would like to create a basemap that shows current night/day division on world map for current user.
Related
I have data consisting of parts of road segments of a city, with different number of visits. I want to plot the data on a Map and visualise it in the form of a heatmap.
I have two related questions:
I have the data from Open Street Maps (OSM) in the form of pairs of node ID's, where node ID correspond to the unique ID being assigned to a point by OSM. I also have a mapping for each node Id to its corresponding coordinates. Is there any Leaflet or Mapbox utility or plugin, which can plot a trip / highlight the road segment using 2 node ID's. I can always do it manually (by using the coordinate mapping and converting it into GeoJSON), but the problem occurs with the line width -- I have to make it exactly overlap with the width of the road, so that it seems that I am highlighting a road segment.
Is there any plugin / utility for Leaflet or Mapbox, which can be used for plotting polylines or geojson as heatmap efficiently? My current approach is calculating the color for each polyline and encoding that as a geojson property. But the problem is that with the increase in the number of lines (> 1K) the rendering becomes a pain and the method is not feasible. There are some plugins for Leaflet out there for plotting heatmap, but all of them are for points only and not lines. Any approach using WebGL would be really great.
An approach which I thought of could be converting my data into a shape file, upload to Mapbox Studio and use as a layer directly. But I have no idea how to go about doing that i.e. creating a shapes file, encoding the information in such a way that the complete road segment gets highlighted in the correct color.
I am working Mapbox-gl.js (v0.38.0) Ionic3 & angular4. I want to set the dynamic center point. The latitude and longitude should be set based on the data in the real time data place's latitude and longitude.
If I set static center point hard-coded, when my real time data changes it will show the center as per the new markers. So I want to set the center point dynamically.
I tried the following following link,
mapbox example
I have added the real time data and marker. But how can I set the expected center point?
Actually my requirement:
For eg: if the real time data has multiple markers in New York, by default the center point should be pointed to New york. Next time the data may change to Callifornia, that time it should point to California.
Based on the markers my center point should be set.
The following snippet is inspired from zoom-to-linestring example on mapbox-gl
As #Aravind mentions above, we use map.fitBounds, however, we have to determine the bounds, we have to reduce the array of features to determine the LngLatBounds.
Just make sure you loaded the feature data.
Example
let features = [feature, feature] // ... array of features
// first coordinate in features
let co = features[0].geometry.coordinates;
// we want to determine the bounds for the features data
let bounds = features.reduce((bounds, feature) => {
return bounds.extend(feature.geometry.coordinates);
}, new mapboxgl.LngLatBounds(co[0].lng, co[0].lat));
// set bounds according to features
map.fitBounds(bounds, {
padding: 50,
maxZoom: 14.15,
duration: 2000
});
You can use the built-in GeolocateControl to find the location of the user and move the center of the map to that location, Check out this example.
You can use the watchPosition option to enable the tracking of the user's location.
MapBox is actively working to improve the location tracking part. You will have better control over this in the next version, Check out this link.
I am trying to display the movement of vehicles that have GPS trackers on them in QGIS. I have a CSV file of the data that looks like so:
Vehicle points
I import the CSV file into QGIS saved as a SHP and put in the necessary information into the Time Manager plugin in QGIS, but when I hit the play botton on the Time Manager all my points just disappear even though it shows it as playing through.
I've checked my date formats and they are correct as QGIS should take them as: yyyy/m/d HH:mm:ss
Any ideas or advice would be much appreciated.
I found the issue, there was a start lat and long and an end lat and long for each point. I had to set the end lat and long in the start lat and long for the next proceeding point for the a particular points vehicle ID. Doing this allowed me to track a vehicles movement.
My understanding of the Leaflet timeline (a Leaflet GeoJSON subclass) is that a GeoJSON feature is needed for each time point. Thus, if you were showing the same country with a different color over 100 years, you would need to have 100 features, including the same geometry in each, but with a different start/end time, and a style function pegging the color to the time.
Is that right? Or is there some more efficient way?
I need to display on the map a scale showing how far a inch / cm is for example. This will need to change depending on the zoom level.
My theory is that if I know the length of the map, and the length of the graphic, If I know what the current scale of the map was I could just do some maths to work out the graphic indicator scale.
So is there a way to get the current zoom lvl in meters? Is it linked to the span or something?
The zoom level is linked to the span - you first need to get the span of your map view, and then convert it into meters.