Я пытаюсь получить данные от json с помощью Leaflet.
Я использую систему визуализации Leaflet Data.
Я хочу использовать ajax, потому что в будущем я хочу генерировать случайные числа в своих свойствах данных (что-то вроде Math.random () во временных интервалах)
Что я уже пробовал
Я скачал плагин Leaflet-ajax, включил его в шапку.
Когда я использую что-то подобное:
новый L.geoJSON.ajax
Я не вижу ни одного из своих маркеров на карте. Я не получаю никаких ошибок в этом случае.
Данные, хранящиеся в data.js (этот файл включен в заголовок):
var geojsonred = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"name": "1",
"value": 20 //I want to replace this with Math.random()
},
"geometry": {
"type": "Point",
"coordinates": [315, -360]
}
},
{
"type": "Feature",
"properties": {
"name": "2",
"value": 50 //I want to replace this with Math.random()
},
"geometry": {
"type": "Point",
"coordinates": [360, -360]
}
}
]
}
Вот так выглядит мой скрипт:
var minHue = 120;
var maxHue = 0;
//var marker = new L.RadialMeterMarker(new L.LatLng(-360, 320), meterMarkerOptions);
var marker = new L.geoJSON(geojsonred, {
pointToLayer: function(feature, latlng) {
return new L.RadialMeterMarker(latlng, {
data: {
'Speed': feature.properties.value
},
chartOptions: {
'Speed': {
displayName: 'Speed',
displayText: function (value) {
return value.toFixed(1);
},
color: 'hsl(240,100%,55%)',
fillColor: 'hsl(240,80%,55%)',
maxValue: 200,
minValue: 0
}
},
displayOptions: {
'Speed': {
color: new L.HSLHueFunction(new L.Point(0,minHue), new L.Point(200,maxHue), {outputSaturation: '100%', outputLuminosity: '25%'}),
fillColor: new L.HSLHueFunction(new L.Point(0,minHue), new L.Point(200,maxHue), {outputSaturation: '100%', outputLuminosity: '50%'})
}
},
fillOpacity: 0.8,
opacity: 1,
weight: 0.5,
radius: 20,
barThickness: 15,
maxDegrees: 360,
rotation: 0,
numSegments: 10
});
},
});
marker.addTo(map);
У кого-нибудь есть идеи?