Javascript 从视图复制的传单地图代码源：不工作

我尝试使用现成的传单地图示例，基于以下内容：

鼠标在地图上单击时，它将鼠标悬停在距离地图150英里以内的所有点上。 正如你所看到的，网站上的链接工作得非常完美。与我的本地文件不同

我将此示例中的整个代码复制到本地文件中，并将其另存为.html代码。 所有javascript文件都是故意复制的（但是，它们显示为链接，因此没有必要将它们复制到我的硬盘上）

我必须复制的一个文件是baseballfail.json，包括提供的所有placemarks的数据

我真的很困惑，因为文件扩展名.html意味着那里没有php代码，所以所有东西都应该很容易传输。不幸的是，我有一个空白的地图，上面有一个清晰的标记。 相反，上面链接下提供的地图提供了我所需要的一切

你能给我解释一下，这次手术有什么问题吗？为什么 var url=“baseballfail.json”根本不起作用

---

这部分代码似乎影响了后面的部分，不可用且不可见。

通过控制台的网络复制粘贴JSON后，您根本不需要使用jquery。只需像这样导入GEOJSON：

import json from "./BaseBallFinal.json";

然后使用这个代码

sites = L.geoJson(json, {
  pointToLayer: function(feature, latlng) {
    return L.circleMarker(latlng, {
      radius: 4, //expressed in pixels circle size
      color: "red",
      stroke: true,
      weight: 7, //outline width  increased width to look like a filled circle.
      fillOpcaity: 1
    });
  }
});

而不是

var promise = $.getJSON(url);
    promise.then(function(data) {

        sites = L.geoJson(data, {

            pointToLayer: function(feature, latlng) {
                return L.circleMarker(latlng, {
                radius: 4, //expressed in pixels circle size
                color: "red", 
                stroke: true,
                weight: 7,      //outline width  increased width to look like a filled circle.
                fillOpcaity: 1
                });
                }
        });
   ...
}

代码的其余部分基本相同。我使用了es6。 只是为了提醒你，我下载并在本地测试了它，它工作正常

---

您在控制台中看到任何错误吗？是的，我有很多错误：在'file:///C:/Users/mariuszk/Desktop/BaseBallFinal.jsonCORS策略已阻止来自源“null”：跨源请求仅支持协议方案：http、数据、chrome、chrome扩展、https.BaseBallFinal.json:1无法load resource:net:：ERR_失败了150英里。html:62您在LAT:40.212440718286466处单击了地图，并且长：-78.57421875000001 150英里。html:89未捕获引用错误：未定义站点…那么我该怎么办？感谢您在不使用web服务器的情况下无法轻松加载JSON文件，因为cross大多数浏览器中的源代码资源共享策略。因此，对于初学者，我会在现有脚本中为JSON分配一个变量（即，

var data=/*JSON文件内容*/

）然后删除AJAX调用。否则，请尝试使用web服务器。代码/*JSON文件名*/不起作用，因此另一个选项是localhost。JS中是否有另一个命令允许我在某个时候运行此映射？恐怕我将需要它脱机运行。Cheers请保存JSON文件的内容，其中@AndroidNoobie编写了JSON文件内容s*/