I'm using Mapbox gl for showing POI in using the geocoder. for some reason, the location of most of the poi is not accurate, because this marker is not getting placed on the POI. Is it possible to change the poi label style based upon the search result? I know using setLayoutProperty we can change all the poi label names but I want to change the specific poi name which comes out of the geocoder search result. Any help is much appreciated.
Adding more information, I'm creating a marker using the geocoder results, however, there were a good amount of restaurants whose marker is positioned away from the actual location. Maybe because of the incorrect coordinates. So the idea is to change the style of the restaurant name in the map instead of creating a maker, this will remove the marker floating around the wrong location.
My question is it possible to do such kind of styling or is there a way we can get more accurate coordinates. I could able to see using SetLayoutProperty for "POI_LABLE" we can change the styles of the name attribute. Is it possible to apply a filter here and change the style of the matched name?. Thanks for looking into this question.
Styles which use Mapbox Streets data show POIs from OpenStreetMap data unless you are in Japan, this is documented at https://docs.mapbox.com/vector-tiles/reference/mapbox-streets-v8/#data-sources--updates.
According to https://docs.mapbox.com/help/how-mapbox-works/geocoding/#source-data,
The Mapbox Geocoding API contains data sources from governments, open data projects, and private companies. In some cases, results from the Geocoding API may differ from Mapbox Streets or OpenStreetMap data.
So the POI results from the Mapbox Geocoder aren't guaranteed to be the same as those POIs shown on the map as they come from different data sources, hence won't always be in the same location and aren't linked with any form of ID.
Related
I have played with Mapbox and can quite easily create a Choropleth map in Mapbox studio and interact with it in Javascript.
I would like to create Choropleth map of the states with the ability to change the colours of the states for 100 years of different data points. I'm not allowed to upload the data into Mapbox as its sensitive healthcare data and I can't get sign of for the $499 a month cost.
My idea is I create a mapbox style layer in MapBox Studio then push the data client side for each of the states depending on the year x that the user selects. I have seen quite a few cloropeth tutorials such as this https://www.mapbox.com/help/choropleth-studio-gl-pt-1/ but the data is added in through a layer in Mapbox Studio. My thoughts are to embed the large GeoJson in the style and only push the data to the Polygon ID's, whilst creating transtions between the two.
Does anyone have any ideas if this is possible? and perhaps any useful API requests which may help me achieve this https://www.mapbox.com/api-documentation/.
It's possible. There are two approaches:
Upload the geometry as a Dataset in Studio, or load it directly as a GeoJSON.
Set data attributes directly on the geometry.
Create a style with data-driven styles (eg, map "47" to "rgb(100,0,0)" and "153" to "rgb(250,250,0)" and let Mapbox interpolate.
Or:
Upload the geometry as a Tileset to Studio.
Calculate the color you want to represent each possible value of each state.
Generate a data-driven style property that maps each state's code to the color you want, like ...['FL','rgb(143,15,0)']....
Neither method will cope with large numbers of regions, but should be ok for 50 US states at low resolution.
More discussion here: https://github.com/mapbox/mapbox-gl-js/issues/4261
I'm using Mapbox GL JS. Is there any way I can style my base layer to look like the Mapbox Light example, but showing only the UK?
I assume I would use Mapbox Studio to build my own base layer, but I can't see any way in Studio to filter by country.
If that's not possible, is there any way I could show labels on the UK only, and show other countries as filled polygons? (As per this unanswered question.)
Unfortunately it is not possible to filter by a certain geography when selecting the data source for a layer. If you're working with Mapbox's tiles, they'll always cover the entire planet.
There is the possibility to restrict the map to a certain (rectangular) bounds, with the map.setMaxBounds method (https://www.mapbox.com/mapbox-gl-js/api/#Map#setMaxBounds). This might work reasonably well since you want to restrict the view to the UK, but might not be suitable depending on the geometry you want to restrict the view to.
As a workaround you could create a dataset and add a polygon that covers the entire planet except for the extent you want to show in your map. Then add this dataset in your style as the top most layer and style it with whatever you'd like the empty space in your map to look like.
The workaround has been also suggested in this SO answer, if you can get maptiles for the UK only (the SO answer gives a link, but for Germany) you can
upload them to Mapbox as a dataset, export it to tilesets, and then
to a map as a layer. Delete all other layers
You have also the possibility to Style a single country in Mapbox
studio ref this tutorial. The other countries are still shown, but you can style your map in a way to highlight UK
There is a option that allows you to show only one country highlighted. But drawback is, you lose all the layers and tile-level details. Here is the link https://www.mapbox.com/videos/how-to/map-a-single-country-in-mapbox-studio/.
But if you want to include the tile details as well as whole world map but in that map only one or two or custom amount of countries highlighted, then, from above link of Natural Earth download the zipped file of ne_10m_admin_0_countries and upload.
Go back to your map style, and instead of making a blank one. Add another layer of ne_10m_admin_0_countries in your current map. Select the country in the filter option (in same way as shown in video). And change its opacity. That's it.
Hope it helps. Have a great day.
I'm interested in custom map tiles, and using advice from here and here, I've experimented with exactly that. For a prototype I did a very geeky map of the Star Trek Federation, with episode links moving you around the planets/systems etc.
While that's all fine and dandy for fantastical locations, I'd also be interested in using heavily stylised renditions of real world locations, yet still using real lat,lng points. So, for example, a bespoke, yet mostly geo accurate, map of London, chopped into tiles, but if you passed in lat,lng coords for Camden Tube (51.53911 -0.14235), you would move to that location.
Any ideas how you configure LeafletJS to do this, without going the route of using Google Maps with custom tiles?
If I understand correctly, you have 2 different applications:
Your Star Trek map, for which you are satisfied.
Stylised map of real world, for which you would like real lat,lng coordinates to be accurate?
Then your question is how to create your custom tiles, so that Leaflet shows the stylised view of London when passed the real London coordinates?
In that case, it would be probably just a matter of correctly numbering your tiles. Or the reverse, modifying the tile numbers used by Leaflet to build the tiles URL. For the latter solution, see Specifying Lat & Long for Leaflet TileLayer
I'm not quite sure what you mean by "mostly geo accurate". It sounds like you probably just want to generate your own map tiles from some kind of source like OpenStreetMap. In that case, TileMill (although kind of obsolete) is probably the easiest way to go.
There are basically three parts:
Generate some map tiles (eg TileMill)
Host them (eg TileStream)
Point Leaflet at them
I have a complete set of waypoints (beginning, end, every intersection) and I'd like to display this on a map. I don't want to use a routing service and it should be offline.
How can I draw polylines on a map so that they follow the curves of the road?
I'm using leaflet.
Could the data be extracted from a relational database(PostgreSQL) and then convert it into GeoJSON and display on the map by leaflet?
I can't use any paid services either.
Leaflet has a polyline object. MapBox has a nice example how to use it.
I think scai has given you a good example to practice.By the way you can also store the data in JSON format in PostgreSQL.Refer this documentation for more details.JSON Types
I am creating an application using MapBox.js, I would like to display all place names at Zoom Level 13 in MapBox Streets but some place names only will display at Level 14. Does anyone know if it is possible to change this preset on MB Streets without having access to their Style Sheets?
This is not possible at this time as this is pretty much burned into the streets layer (streets, streetnames, and place names). If you want further customization, I would suggest looking into TileMill and using something like the OSM Bright Quickstart to make custom basemaps.