I have a leaflet geojson layer:
var geojsonlayer = L.geoJson({
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {},
"geometry": {
"type": "LineString",
"coordinates": [
[0,0],
[1,1],
[2,2]
]
}
}
]
}).addTo(map);
How is it possible to delete a coordinate or multiple coordinates (and apply such changes to map)?
Related
I'm wondering if an InfoWindow (or similarly rich component) can be handed to a Google Map within the GeoJSON itself as a "feature", or "shape", etc.
(I'm working in an environment where I don't have access to the google.maps.Map object, but I do have access to the GeoJSON that is rendered on the map.)
In other words, is something like this possible?:
{
"type": "FeatureCollection",
"features": [
{
"type":"Feature",
"properties":
{
"strokeColor":"#00FF00",
"strokeWeight":4,
"strokeOpacity":1
},
"geometry":
{
"type":"LineString",
"coordinates":
[
[-150.6339948,64.98646889999999],
[-147.8560028,64.81510162]
]
}
},
{
"type":"Feature",
"properties":
{
"content":"testing testing",
"minWidth":100
},
"geometry":
{
"type":"InfoWindow",
"coordinates":
[-150.6339948,64.98646889999999]
}
}
]
}
Thanks in advance for your time!
In Flutter, no matter what json file i try to decode I get the same above titled error.
Originally I thought it was something with my project but after starting a new template Flutter project I still receive the same error. I have the json file in my root folder and have added them to the pubspec.yaml file:
assets:
- Sample-JSON-data.json
- Sample-employee-JSON-data.json
Main.dart code at the moment:
var jsonString = 'Sample-JSON-data.json';
var response = jsonDecode(jsonString);
print(response);
I have verified my json data on multiple test sites as well as tried various methods in the Flutter Documentation. Json data:
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.0763783444317,
-33.98045132346684
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.0763783444317,
-33.98045132346684
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.07774912725728,
-33.97470462237792
]
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
151.0763783444317,
-33.98045132346684
]
}
}
]
}
jsonDecode expects an input to be valid JSON serialized into String fe.
{ "message": "Hello World!" }. So this would work: jsonDecode('{"message": "Hello World!"}').
What you are passing to it is a file name, it won't automatically read the file for you. You can check how to do that here:
Flutter - Read text file from assets
Actually you are not loading the data from the json file.
Try:
var jsonString = await rootBundle.loadString('Sample-JSON-data.json')
I've set up a rest API that is supplying geojson data from a database. The issue is each coordinate could/does have multiple items associated to it.
Currently troubleshooting the application's javascript file to load, and plot - but looking for feedback on best practice. Any information is appreciated. Thanks!
var foo = {
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {
"item": "A",
},
"geometry": {
"type": "Point",
"coordinates": [
90,
135
]
}
},
{
"type": "Feature",
"properties": {
"item": "B",
},
"geometry": {
"type": "Point",
"coordinates": [
90,
135
]
}
},
{
"type": "Feature",
"properties": {
"item": "C",
},
"geometry": {
"type": "Point",
"coordinates": [
90,
135
]
}
},
...
I have a function which is parsing JSON provided by the foursquare api to GeoJSON, which I then provide to the MapBox API using JSON.stringify() on the GeoJSON object then loading it to the map with the following code
MapBox API returns saying that my GeoJSON is invalid.
I checked the GeoJSON specification and it matches exactly !
Can anybody spot the error ?
loading function
this.map.on("load", () => {
this.map.addSource("venues", {
type: "geojson",
data: geojson
});
GeoJSON
{
"type": "FeatureCollection",
"features": [
{ "type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [48.31272484668867, 18.092948926236698]
},
"properties": {
"id": "4d0a6cc933d6b60c1c569a85",
"venueName": "Peciatkaren",
"address": "Kmetkova 32",
"distance": 20119,
"icon": {
"iconUrl": "../assets/img/dot_PNG41.png",
"iconSize": [25, 25],
"iconAnchor": [0, 0]
}
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [48.30957732182106, 18.087218856597]
},
"properties": {
"id": "4bd5ad37637ba5933bc3f670",
"venueName": "Zanzibar",
"address": "Štefánikova trieda 43",
"distance": 20030,
"icon": {
"iconUrl": "../assets/img/dot_PNG41.png",
"iconSize": [25, 25],
"iconAnchor": [0, 0]
}
}
}]
}
There is nothing wrong with your GeoJSON and there are several ways how you could use it.
Docs:
https://www.mapbox.com/mapbox-gl-js/api/#geojsonsource
https://www.mapbox.com/mapbox-gl-js/style-spec/#sources-geojson
One example below:
var yourgeojson = {
"type": "FeatureCollection",
"features": [
{ "type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [48.31272484668867, 18.092948926236698]
},
"properties": {
"id": "4d0a6cc933d6b60c1c569a85",
"venueName": "Peciatkaren",
"address": "Kmetkova 32",
"distance": 20119,
"icon": {
"iconUrl": "../assets/img/dot_PNG41.png",
"iconSize": [25, 25],
"iconAnchor": [0, 0]
}
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [48.30957732182106, 18.087218856597]
},
"properties": {
"id": "4bd5ad37637ba5933bc3f670",
"venueName": "Zanzibar",
"address": "Štefánikova trieda 43",
"distance": 20030,
"icon": {
"iconUrl": "../assets/img/dot_PNG41.png",
"iconSize": [25, 25],
"iconAnchor": [0, 0]
}
}
}]
};
map.on('load', function () {
map.addSource('someid', {
type: 'geojson',
data: yourgeojson
});
map.addLayer({
"id": "points",
"type": "symbol",
"source": "someid",
"layout": {
...
}
});
});
I wanna change marker color for in geojson. However, this code doesn't work as expected.
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-2.5555, 53.6666]
},
"style": {
"color": "red",
"weight": 5,
"opacity": 0.65
},
"properties": {}
}
]
}