[GIS] can’t read attribute from map file (.kml) using OpenLayers2

kmlopenlayers-2

I want to create thematic maps using OpenLayers with KML map. But when I run the code, color and label thematic maps of the polygon can't show up. instead writing out undefined. what's the cause? are attributes of the map can not be read?

here is the code :

<script type="text/javascript" src="OpenLayers.js"></script>

        <script type="text/javascript">


            var map;
            var jogja;
            var data= new Array();
            data['3401']=663;
            data['3402']=1794;
            data['3403']=472;
            data['3404']=1902;
            data['3471']=11986;

            var wilayah= new Array();
            wilayah['3401']="kulon progo";
            wilayah['3402']="bantul";
            wilayah['3403']="gunung kidul";
            wilayah['3404']="sleman";
            wilayah['3471']="kota yogyakarta";

            var batas = [0, 500, 1000, 2000];
            var warna = ["#EEFFFF","#6DD5FF","#19A3FF","#0048FF"];

        function init(){
            map = new OpenLayers.Map('map',{
            controls: [
                new OpenLayers.Control.Navigation(),
                new OpenLayers.Control.PanZoom(),
                new OpenLayers.Control.ScaleLine(),
                new OpenLayers.Control.MousePosition(),
            ]});

            var context = {
                getColor: function(feature){
                var id = feature.attributes.IDKAB;
                var val=data[id];
                var color = "white";

                var i =0;
                while(i<batas.length-1){
                    if (val<batas[i+1]){
                        color = warna[i];
                        break;
                    }
                    i++;
                }
                    if (val !=null && color == "white"){
                        color = warna[batas.length-1];
                    }
                    return color;
                },
                getLabel: function (feature){
                    return wilayah[feature.attributes.IDKAB];
                }
            };

            var template = {
                strokeColor: "#808080",
                strokeWidth: 1,
                graphicZIndex: 1,
                fillColor: "${getColor}",
                label: "${getLabel}",
                labelAlign: "cm"

            };

            var style = new OpenLayers.Style(template, {context: context});
            var myStyle = new OpenLayers.StyleMap(style);

            jogja = new OpenLayers.Layer.GML ("KML", "kml/cite-jogja.kml", {format: OpenLayers.Format.KML
                        , isBaseLayer: true, styleMap: myStyle});

            jogja.events.on({'loadend': onLoadEnd})

            map.addLayer(jogja);
            map.zoomToMaxExtent();

        function onLoadEnd(){var ext = jogja.getDataExtent();
                             map.zoomToExtent(ext,false);}


    </script>

<body onLoad="init()">

    <div id="map"></div>

</body>

–>IDKAB is attribute codes in the map file

–>and its the result :
enter image description here

Best Answer

You need to use a context to allow you to write a function to assign a kml attribute to your features.

The problem is that the kml attributes are not simple attributes - they are actually objects. You cannot assign an object to a feature attributes.

See this earlier question:

openlayers attribute substitution failing on kml file

P.S. I was logged in incorrectly, so ignore my other (junk) username

Related Question