使用此处地图将样式添加到KML图层

时间:2019-01-27 20:43:19

标签: here-api

我正在使用Here maps js从下面的数组加载几个KML文件。下面,KmlObjs包含KML文件的路径,我想要的折线颜色以及它们的不透明度。

当前,每个文件都呈现蓝色折线。这必须是默认值。

有没有一种方法可以动态设置KML文件中的折线样式?

   var dataSet = [
            new KmlObj('./kml/footway.kml', 'green', 100),
            new KmlObj('./kml/path.kml', 'red', 100),
            new KmlObj('./kml/track_central.kml', 'black', 50),
            new KmlObj('./kml/track_north_2.kml', 'black', 50),
            new KmlObj('./kml/track_northeast1.kml', 'black', 50),
            new KmlObj('./kml/track_northeast2.kml', 'black', 50),
            new KmlObj('./kml/track_south.kml', 'black', 50),
            new KmlObj('./kml/track_southeast.kml', 'black', 50),
        ]

        function loadKmlLayer() {
            dataSet.forEach(set => {
                var reader = new H.data.kml.Reader(set.path);
                reader.parse();
                layer = reader.getLayer();

              //  ADD STYLING TO THE LAYER BEFORE IT'S ADDED TO THE MAP ? 
                map.addLayer(layer);

        loadKmlLayer();

1 个答案:

答案 0 :(得分:1)

尝试一下:

// create a group to put all objects
kmlGroup = new H.map.Group();
map.addObject(kmlGroup);

然后读取kml文件,并准备好处理:

let reader = new H.data.kml.Reader('file to read.kml');
reader.parse();

reader.addEventListener('statechange', async function () {

    // Wait till the KML document is fully loaded and parsed
    if (this.getState() === H.data.AbstractReader.State.READY) {

        // get all parsed objects
        var objects = reader.getParsedObjects();

        // if first object is a group
        if (objects[0] instanceof H.map.Group)
            objects = objects[0];

        // iterate through each object
        objects.forEach((obj, i, group) => {

            if (obj instanceof H.map.Marker) {
                // process points
            } else if (obj instanceof H.map.Polygon) {
                // light red filling with yellow border
                obj.setStyle({
                    strokeColor: 'rgba(255, 255, 0, 1)',
                    fillColor: 'rgba(255, 0, 0, 0.4)',
                    lineWidth: 2
                });
                kmlGroup.addObject(obj);

            } else if (obj instanceof H.map.Polyline) {
                obj.setStyle({
                    strokeColor: 'rgba(0, 185, 100, 1)'
                });

            } else console.log("obj type", obj.type);


        }, true, this);

    }
});