在本地运行Azure Maps教程时,数据文件相对于html的位置-atlas.io.read()



试图确定如何修改下面Azure Maps教程中的atlas.iored((函数,以便在我的windows机器上本地读取数据。

atlas.io.read(window.location.origin + '/Common/data/Gpx/Route66Attractions.xml')

"window.location.oorigins+"是否适用于本地文件?

我已经嵌套了与上面的字符串类似的.xml文件,相对于html文件,但是,它在启动映射时读取文件。

Azure地图教程:

https://github.com/Azure-Samples/AzureMapsCodeSamples/blob/master/AzureMapsCodeSamples/Spatial%20IO%20Module/Load%20spatial%20data%20(简单(.html

该函数将无法直接访问本地文件,因为URL必须是http或https URL。你可以采取几种方法。

如果您计划稍后托管该文件,您可以在本地主机上托管它,然后有一个指向它的URL

如果你想访问本地文件,你首先需要使用文件输入标记和FileReader类将文件加载到你的应用程序中。一旦你有了原始文件数据(文本(,你就可以把它传递到atlas.io.read函数中,它会为你处理if。这里有一个简单的例子:

<!DOCTYPE html> 
<html>   
<head> 
<title>Read Text File</title> 

<!-- Add references to the Azure Maps Map control JavaScript and CSS files. -->
<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css" type="text/css" />
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.js"></script>
<!-- Add reference to the Azure Maps Spatial IO module. -->
<script src="https://atlas.microsoft.com/sdk/javascript/spatial/0/atlas-spatial.min.js"></script>
</head>   
<body> 
<input type="file" name="inputfile" id="inputfile"> 

<script type="text/javascript"> 
window.onload = function() {
var input = document.getElementById('inputfile');

input.addEventListener('change', function() { 

var fr = new FileReader(); 
fr.onload = function(){ 
atlas.io.read(fr.result).then(function(r){
//r is the parsed data. Do something with it.
});
} 

fr.readAsText(input.files[0]); 
});
});
</script> 
</body>   
</html> 

最新更新