bencoding.map 中 KML 的 Appcelerator 替代品

Appcelerator alternative to KML in bencoding.map

我正在更新一个曾经使用 "bencoding.map" https://github.com/benbahrenburg/benCoding.Map/blob/master/documentation/index.md.

的 Appcelerator 应用程序

现在 "bencoding.map" 已弃用,因此我更新为使用原生 Titanium 地图功能。

但是我现在遇到一个问题,"bencoding.map" 中的 "addKML" 在 Titanium 地图 api 中不可用。

有谁知道我可以用什么来替换 KML 功能?代码如下:

    function onkmlCompleted(){
        Ti.API.info("onkmlCompleted");
        Ti.API.info("onkmlCompleted"+JSON.stringify(mapLoadingWindow));
        mapLoadingWindow.close({animated:false});
        mapView.removeEventListener('kmlCompleted',onkmlCompleted);
    };

    mapView.addEventListener('kmlCompleted',onkmlCompleted);

    mapView.addKML({
        path:"some_file.kml", //Path to our kml file
        tag : 55, //Integer value used as the tag for all polygons and annotations. If you want use remove you need to set this to a known value.
        flyTo:false, //Will set your zoom to show all of your points added (false by default)        
        //Contains all of the details used to process overlays from your KML file
        overlayInfo:{
            title:'my kml batch key', //This identifies all of the overlay elements in your kml file. This is also used for delete or query operations.
            alpha:0.5, //Alpha value of your overlays
            lineWidth:1.2, //Line Width of your overlays
            strokeColor:'#000', //Stroke Color of your overlays
            color:'yellow', //Sets the color of all your overlays ( if left off, a random color will be selected)
            useRandomColor:true, //If true, a random color will be selected, this overrides the color provided if true              
        }
    });

一种选择是将 kml 数据转换为 JSON,然后通过地图模块的方法(例如 createPolygon、createPolyline 等)将数据添加到原生 Titanium Map,作为您的数据要求。

我使用 togeojson Node.js 模块完成了此操作。从 Titanium 6 开始,我们现在可以直接从我们的项目中访问 Node 模块。假设您正在使用 Alloy 项目:

cd MyProject/app/assets
npm install togeojson

这也会安装一些其他的依赖模块,包括xmldom,我们也可以使用

取一些sample KML LineString data并放入MyProjects/app/assets,然后我们可以使用togeojson模块转换它。这将使我们完成一半。 Titanium 地图模块不支持 GeoJSON,但由于 GeoJSON 只是 JSON,我们可以遍历它并获取我们需要的数据,然后将其提供给相关的映射模块方法。

下面是通过将 KML LineString 数据发送到地图的 createPolyline 方法来完成所有这些操作的示例。假设这个 Alloy index.js 控制器有一个 id 为 'map' 的地图视图:

//the titanium map module
var Map = require('ti.map');
//the node module we installed
var togeojson = require('togeojson');
//a dependency of togeojson which we will also use
var DOMParser = require('xmldom').DOMParser;

//with out data file in apps/assets
var file = Ti.Filesystem.getFile(Ti.Filesystem.resourcesDirectory, "linestring.kml");
var kml = file.read().text;

//the module requires the xml data in XML DOM, so we parse it first
var xml = (new DOMParser()).parseFromString(kml, 'text/xml');

//convert the kml to GeoJSON
var converted = togeojson.kml(xml);

//Here, we iterate through the GeoJSON file and pull out the coordinates to use to 
//create our Map polygons, polylines, etc.  Your implementation will vary depending
//on the data you are reading
converted.features.forEach(function(feature){
    if(feature.geometry.type === 'LineString')
    $.map.addPolyline(Map.createPolyline({
        points: feature.geometry.coordinates,
        strokeColor: '#ff0000',
        strokeWidth: '2'
    }));
});

$.map.setRegion({
    latitude: 37.824664,
    latitudeDelta: 0.002,
    longitude: -122.364383,
    longitudeDelta: 0.002
});