Question

我正在尝试使用存储在geoJson文件中的本地数据在Bing Maps中创建热图，但我无法使其正常工作......奇怪的是，如果完全相同的文件在线，则绝对没有问题。这是我正在使用的脚本：

<script type='text/javascript'>
function GetMap() {
    var map = new Microsoft.Maps.Map('#myMap', {
        credentials: 'my_bing_maps_key_(not_forgotten)',
        zoom: 4
    });

    //Load the GeoJSON and HeatMap modules
    Microsoft.Maps.loadModule(['Microsoft.Maps.GeoJson', 'Microsoft.Maps.HeatMap'], function () {
        // Earthquake data in the past 30 days from usgs.gov
        Microsoft.Maps.GeoJson.readFromUrl('data/all_month.geojson', function (shapes) {
            var heatMap = new Microsoft.Maps.HeatMapLayer(shapes, { radius: 5 });
            map.layers.insert(heatMap);
        });
    });
}
</script>

有了它，就不会出现热图图层。但是当我简单地用它替换它时，一切都很好：

<script type='text/javascript'>
function GetMap() {
    var map = new Microsoft.Maps.Map('#myMap', {
        credentials: 'my_bing_maps_key_(not_forgotten)',
        zoom: 4
    });

    //Load the GeoJSON and HeatMap modules
    Microsoft.Maps.loadModule(['Microsoft.Maps.GeoJson', 'Microsoft.Maps.HeatMap'], function () {
        // Earthquake data in the past 30 days from usgs.gov
        Microsoft.Maps.GeoJson.readFromUrl('http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson', function (shapes) {
            var heatMap = new Microsoft.Maps.HeatMapLayer(shapes, { radius: 5 });
            map.layers.insert(heatMap);
        });
    });
}
</script>

我真的不明白这里有什么问题。

非常感谢！

Answer 1

我尝试的时候都适合我。确保您的本地文件与您的网页位于同一位置，因为您的网址是相对网址。即如果您的网页为http://mywebsite.com，则您提供的网址要求文件位于http://mywebsite.com/data/all+month.geojson。

如果您确实想要访问用户文件系统上的文件，则必须使用HTML5 FileReader API，因为URL无法访问用户文件系统。

如何使用本地json文件创建热图（Bing Maps）？

1 个答案: