想知道最好的方法是将来自AJAX的大型数据对象分开。如果我只发送一个部分(表示路径),我使用JSON.parse(data)
我真正想做的是先将对象拆分成单独的块,然后能够执行JSON.parse(data['paths'])
之类的操作。 / p>
这是JSON数据的剪辑样本
{
"paths": {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"type": "MultiLineString",
"coordinates": [
[
[-122.32074805731085, 47.634990818586026],
[-122.32074412999432, 47.63497931696752],
[-122.32107629703529, 47.63465666282262]
]
]
},
"properties": {
"path_name": "Woodland path"
},
"id": 2
}]
},
"beds": {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"type": "MultiPolygon",
"coordinates": [
[
[
[-122.32073753862116, 47.6347629704532],
[-122.32071585642394, 47.63470617810399],
[-122.32073753862116, 47.6347629704532]
]
]
]
},
"properties": {
"bed_name": "Azalea Triangle"
},
"id": 1
}]
}
}
这是我在javascript中的内容
$.ajax
dataType: 'text'
url: 'map.json'
success: (data) ->
这是生成调用的Rails代码
data = { buildings: @geopaths, lawns: @geobeds }
respond_to do |format|
format.json { render json: data }
format.html
end
更新:
我有点避免解释我想做什么,因为我认为这会混淆问题。在坚果壳中 - 我从数据库收集数据,并将其发送到Javascript以在地图上显示为图层。每个层都有一个名称(路径,床等),并在使用AJAX命令发送到Javascript之前在Rails中编码为GeoJSON。如果我只发送一个图层,我可以解析数据并将其放到地图上。典型的代码行看起来像pathMarkers = L.geoJSON(JSON.parse(data))
。
我现在需要将多个图层传递给地图。我的理解是AJAX只能处理一个对象,所以我将路径和床组合成一个对象。当我到达Javascript端时,我不知道该怎么做。换句话说,我只需要获得具有pathMarkers路径数据的对象部分,并且只获得具有bedMarkers床数据的对象部分。
从图形上看,这就是我要做的事情:
paths = a bunch of GeoJSON data
beds = a bunch of GeoJSON data
Use AJAX to send paths and beds to javascript
build pathMarkers with JSON.parse for the paths data
build bedsMarkers with JSON.parse for the beds data
我可以构建一个样本并将其发布到bitbucket,如果有帮助的话。
答案 0 :(得分:1)
我之前遇到过这个问题,在移动设备(具有Phonegap的iOS,确切地说是iOS)上有非常大的负载。您可能希望在http://www.juancaicedo.com/oboe.js-website/处查看名为OboeJS的库。
本质上,该库流式传输JSON请求,以便您可以以块的形式处理它。您应该能够使用它来满足您的需求。
答案 1 :(得分:1)
假设我理解正确并且您的关注是将不同的数据层引入到 Leaflet.js 这样的地理库中,单个AJAX请求就可以了,除非JSON有效负载它太大了,它会使浏览器崩溃。
由于您没有提供大部分代码,以下是您如何执行此操作的一般示例。
首先创建地图对象。 显然:)
const map = L.map(id).setView([1.2345, -1.2345], 10);
启动AJAX请求以获取geoJSON文件。
$.ajax({
dataType: "json",
url: '/json/lives/here.json',
data: {} /* any props you'd like to pass as query string to your server */,
success: success
});
问题的关键:"如何访问每个功能集?"
sucess
或done
回调是您可以确定收到数据的地方,并可以将其添加到地图中。
jQuery的AJAX方法在使用dataType: 'json'
调用时会自动为您运行JSON.parse()
(以及其他一些事情)。解析JSON后,可以像JS中的任何其他对象一样访问它。
此时,success
回调接收 JSON-turned-into-object ,您可以使用传统的JS方法访问它。像这样:
function success (data) {
// data is the parsed JSON. It is now just a JS object.
// Below: for every "key" in the data object, pass its data to L.geoJSON() and add it to the map.
for (var geojsonFeatureCollection in data) {
if (data.hasOwnProperty(geojsonFeatureCollection)) {
L.geoJSON(geojsonFeatureCollection, {/* options */}).addTo(map);
}
}
}
回答关于AJAX和单个对象的观点:AJAX就像任何其他浏览器请求一样。
是的,您确实一次发送一个请求。同样,您从服务器收到一个响应。 但响应中包含的内容可以绝对是任何数据。所以你在服务器端做的事情是完全可以的!
在您的情况下,数据包含一个JSON文本文件,该文件稍后会被解析并转换为JS对象,以便您实际执行某些操作。该对象包含一堆"键" (beds
,paths
)您需要做的就是遍历每个密钥并将每个密钥传递给Leaflet的geoJSON
方法进行渲染。