如何使用 Overpass API 从 jQuery 获取 OSM 数据？

Question

我有以下用于从 OSM 请求地图数据的代码：

$.ajax({
    url:
        'https://www.overpass-api.de/api/interpreter?' + 
        '[out:json][timeout:60];' + 
        'area["boundary"~"administrative"]["name"~"Berlin"];' + 
        'node(area)["amenity"~"school"];' + 
        'out;',
    dataType: 'json',
    type: 'GET',
    async: true,
    crossDomain: true
}).done(function() {
    console.log( "second success" );
}).fail(function(error) {
    console.log(error);
    console.log( "error" );
}).always(function() {
    console.log( "complete" );
});

当我在 Overpass Turbo 上测试请求时，它运行没有任何问题，但是在 JavaScript 中执行此请求时，我总是得到错误：

"<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>  <meta http-equiv="content-type" content="text/html; charset=utf-8" lang="en"/>  <title>OSM3S Response</title></head><body><p>The data included in this document is from www.openstreetmap.org. The data is made available under ODbL.</p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Key expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: '!', '~', '=', '!=', or ']'  expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Value expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: ',' or ']' expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Key expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: '!', '~', '=', '!=', or ']'  expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Value expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: ',' or ']' expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: static error: For the attribute "k" of the element "has-kv" the only allowed values are non-empty strings. </p><p><strong style="color:#FF0000">Error</strong>: line 1: static error: For the attribute "k" of the element "has-kv" the only allowed values are non-empty strings. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Key expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: '!', '~', '=', '!=', or ']'  expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: Value expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: parse error: ',' or ']' expected - '%' found. </p><p><strong style="color:#FF0000">Error</strong>: line 1: static error: For the attribute "k" of the element "has-kv" the only allowed values are non-empty strings. </p></body></html>"

一定是我请求的方式有问题，但我想不出有什么问题。

如何从 JavaScript 获取柏林所有学校的位置？

我也尝试过使用 $.getJSON()，但这对我也不起作用。

Answer 1

您在示例中使用的 URL 似乎不完整：它应该显示为 ...interpreter?data=[out:json]... 即 data=部分丢失。

作为参考，您还可以将查询放入立交桥 Turbo，然后只需单击导出 -> 直接来自立交桥 API 的原始数据即可获得工作 URL。也许先用 wget 试试这个，如果没问题，把 URL 放在你的 Javascript 代码中。

也许您还想研究一下，overpass turbo 如何（基于POST）调用 Overpass API：请参阅 https://github.com/tyrasd/overpass-turbo/blob/master/js/overpass.js#L581 了解详细信息。

如何使用 Overpass API 从 jQuery 获取 OSM 数据？

How to get OSM data using Overpass API from jQuery?

javascript

ajax

jquery

openstreetmap

overpass-api