时间戳

首页 > 解决方案 > 如何将 www.educationcounts.govt.nz 中的区域数据嵌入到我自己的 Leaflet 地图中？

leaflet - 如何将 www.educationcounts.govt.nz 中的区域数据嵌入到我自己的 Leaflet 地图中？

问题描述

在这个网站https://www.educationcounts.govt.nz/find-school/school/profile?school=780&district=16®ion=3，地图上显示了学校的位置，并且某些学校有招生区，所以只有某些学校的区域允许学生注册。有没有办法添加将分区地图嵌入另一个网站的选项？例如，如果学校想在他们的网站上嵌入地图？[它是一个使用 Leaflet 的 OpenStreetMap]

标签： leafletopenstreetmap

解决方案

您似乎指的是educationcounts.govt.nz网站地图中突出显示的区域：

招生区

稍微摆弄一下我的网络浏览器的网络监视器，就会发现该注册区域的数据是通过 GeoJSON（包装在一个简单的 JSON 数据结构中）通过端点传输的https://www.educationcounts.govt.nz/js-content/school-enrolment-zone-geo-data?school=780，其中780是一个数字学校 ID。这是个好消息：端点没有被混淆，没有 API 注册过程，没有奇怪的东西。

现在，有几种方法可以将数据添加到您自己的 Leaflet 地图中。一种方法是从您的网页中从该端点获取一些 javascript 请求数据，然后让 Leaflet 解析并显示该 GeoJSON 数据，即：

fetch('https://www.educationcounts.govt.nz/js-content/school-enrolment-zone-geo-data?school=780')
.then(function(response){return response.json()})
.then(function(json){
    var zone = L.geoJson(json.schoolZones[0]).addTo(map);
    map.fitBounds(zone.getBounds());
});

但是，如果您尝试运行它，您将遇到CORS 错误。这意味着托管在educationcounts.govt.nz域名上的网页可以从托管在的端点请求数据educationcounts.govt.nz，但是如果网页和数据端点位于不同的域中，则无法正常工作。

第二种方法是设置代理网络服务器。访问您的网页的浏览器将从代理服务器中的端点请求数据，然后您的代理服务器将从educationcounts.govt.nz端点请求数据。我觉得如何设置这样的代理网络服务器超出了这个答案的范围。

那么另一种方法将是一个很好的复制粘贴。请注意，我们可以这样做，因为新西兰教育部允许任何人这样做：

“[...] 除非针对特定项目另有说明 [...] 此版权材料已根据知识共享署名 4.0 国际许可进行重复使用。本质上，您可以自由复制、分发和改编该材料，只要您将其归于 [代理/许可人的名称] 并遵守其他许可条款。[...]

因此，您只需下载https://www.educationcounts.govt.nz/js-content/school-enrolment-zone-geo-data?school=780、复制粘贴 GeoJSON 数据到您的 JS 代码中，添加一个属性文本，就可以完成，即：

var geojson_for_school_780 = {
    "type": "Feature", 
    "geometry": {
        "type": "Polygon",
        "coordinates": [[[175.228088376393515, -37.72252796906151], [175.226034730098121, -37.720644653205419], [175.22766664238091, -37.719790045099124], [175.226669852036935, -37.719494534245776], [175.226063764869849, -37.719139298407981], [175.225684377028415, -37.718639517004007], [175.229416445471969, -37.718249363032648], [175.229085250983672, -37.71615637690455], [175.232916799597604, -37.715781597614502], [175.232994305233518, -37.716138715739554], [175.233444251633273, -37.716777017700473], [175.234158364268694, -37.71640115383375], [175.236281071637421, -37.716492901297777], [175.236778969848842, -37.714982027731864], [175.23678197389944, -37.714972736633278], [175.237007068442892, -37.714289969996393], [175.237241870249363, -37.713577440478581], [175.237270572373717, -37.713490244242642], [175.240150572754345, -37.714065821500597], [175.240643435719903, -37.712513828060004], [175.243666181667777, -37.712865753620441], [175.250868816480903, -37.716764632124416], [175.251583336046906, -37.717696153282141], [175.254009088257504, -37.723034477939613], [175.253880254830392, -37.723454795140654], [175.25349101820072, -37.723784706999517], [175.253036672946649, -37.724303029748867], [175.252594231767404, -37.72400311293994], [175.251708805537902, -37.724234350926004], [175.250761189334611, -37.724405921967168], [175.248617924442527, -37.724701883851303], [175.248670831855691, -37.724983622610388], [175.248108644705894, -37.725216958649114], [175.248650574856413, -37.725715016374757], [175.249211188456741, -37.72611261827015], [175.249655009537463, -37.726795407802669], [175.249611471330013, -37.727653444472836], [175.249251932365951, -37.728735469804036], [175.24882851502224, -37.729535978099591], [175.248699477963925, -37.729951947833527], [175.248679639737873, -37.730696376073432], [175.247396212196207, -37.730617917521215], [175.246153794004499, -37.730656875737637], [175.241864451038253, -37.727794371200304], [175.241180169528519, -37.728000311784783], [175.240588231182812, -37.727848333950995], [175.240153830359304, -37.727715480402672], [175.239851710703874, -37.727454948983301], [175.239875963992915, -37.727229477760901], [175.240149140367777, -37.726915638650944], [175.240215554761789, -37.726697642096219], [175.239903506117116, -37.726453987907334], [175.239653784325327, -37.726127205552878], [175.239401725478814, -37.725855878978372], [175.23926283076392, -37.725450394672841], [175.238884215081299, -37.725544253360944], [175.238640207482177, -37.725662986352773], [175.238359547776611, -37.725743664646863], [175.237811460334513, -37.725663095694664], [175.237255020354979, -37.725649360565903], [175.236522478420255, -37.725705843488996], [175.235863906512094, -37.725769794857271], [175.235254998449847, -37.725764800151751], [175.234768745586678, -37.725649642237613], [175.23447386768197, -37.725613939759789], [175.234072007153287, -37.725513740156622], [175.233809457524046, -37.725177407031069], [175.233740971157573, -37.725003820731189], [175.233592583214886, -37.724956818310353], [175.23343240605891, -37.724868400347226], [175.233446176252102, -37.724643142640126], [175.232926621407813, -37.724158104107403], [175.232567102025371, -37.72386686778475], [175.232324859841981, -37.723743049267213], [175.231984024121715, -37.723568840798833], [175.23168917633987, -37.723418148852147], [175.230339273580199, -37.721887519404923], [175.230117128172367, -37.720706116231113], [175.229491841292969, -37.720595274641148], [175.229321718089551, -37.720651789039294], [175.229205499717182, -37.720954090252832], [175.228911973926813, -37.72096000947694], [175.22877250197385, -37.720862830025283], [175.228781549692457, -37.721145956121312], [175.228565121524923, -37.721266978437441], [175.228351630524628, -37.72147959497768], [175.228462480264795, -37.721993967796962], [175.228088376393515, -37.72252796906151]]]}, "properties": {"Office": "HM", "PolyID": 780, "INSTTYPE": "Contributing", "PolyName": "Te Ao Marama School", "SchoolID": 780, "ApprovalDate": "2017/03/16", "EffectiveDate": "2019/01/01"
    }
}

var zone_780 = L.geoJson(geojson_for_school_780,{
    attribution: "<a href='https://www.educationcounts.govt.nz/site-info/privacy'>CC-by NZ Ministry of Education</a>"
});

zone_780.addTo(map);
map.fitBounds(zone_780.getBounds());

在此处查看一个工作示例。

如果您想为一千所学校执行此操作，这具有（明显）不容易自动化的缺点，并且对原始数据的任何更新都不会反映在您的副本中。如果这是一个问题，那么是时候考虑使流程自动化了。

无论如何，联系网站工作人员可能是个好主意。他们可能有一些其他渠道来分发未公布的学校地理数据，如果最终接收者是学校，它们可能会特别有用。

推荐阅读