如何循环遍历geojson数据并根据条件显示属性值

时间:2016-01-30 06:12:37

标签: javascript jquery json geojson

这是我的geojson数据

var json = '[{"type": "FeatureCollection", "crs": {"properties": {"type": "proj4", "href": "http://spatialreference.org/ref/epsg/4326/"}, "type": "link"}, "features": [{"properties": {"species": "Oxalis corniculata L.", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 1}, {"properties": {"species": "Pinus roxburghii Sargen", "listvalues": 2, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 2}, {"properties": {"species": "Trifolium repens L.", "listvalues": 1, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 3}, {"properties": {"species": "Poa annua L.", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 4}, {"properties": {"species": "Fragaria nubicola Lindley ex Lacatia", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 5}, {"properties": {"species": "Cedrus deodara (Roxb. ex Lambert.) G.Don.", "listvalues": 2, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 6}]}]'

我想要以下结果:

(1) All species whose listvalues=0
(2) All species whose listvalues=1
(3) All species whose listvalues=2

如何使用jquery或javascript实现此目的?

javascript代码

 <script type="text/javascript">

    $('.bottom').hide(); // initially hide the bottom content

//set event listener to trigger on header click
    $('.header').click(function() {

    $(this).next('.bottom').slideToggle();// find the next bottom content afterthe header and toggle it up or down depending on its current state.

    });
        function main_map_init (map, options) {
            var promise = $.getJSON('{% url "extdata" %}');

            promise.then(function(data) {
            var allbusinesses = L.geoJson(data);
            var cafes = L.geoJson(data, {


                pointToLayer: function(feature, latlng) {

                 return new L.CircleMarker(latlng, {
                radius: 8,
                    fillColor:'Red ',
                    color:'Red' ,
                    weight: 1,
                    opacity: 1,
                    fillOpacity: 0.4,
                    clickable: true

           <!--     }).on('mouseover', function() {
                    <!-- this.bindPopup(feature.properties.species).openPopup(); -->
                <!-- });  -->
                }).on('click', function() {

                        var div = $('<div id="container" style="width: 200px; height: 200px;"></div>')[0];
                        this.bindPopup(div);
                        this.openPopup();
                        $("#container").ready(
                        function(){
    //---------------------------------------------------
          // Create the chart
             $(function () {
            // $.each(promise, function (i, point) {
   // point.y = point.promise;
//});
            $('#container').highcharts({
                chart: {
                    type: 'pie',
                    backgroundColor: 'rgba(0,0,0,0)',
                    y:100

                },
                title: {
                    text: 'sfs '
                },
                yAxis: {
                    title: {
                        text: ' '
                    }
                },
                plotOptions: {
                    pie: {
//                        y:1,
                        shadow: false,
//                        center: ['50%', '50%'],
                        borderWidth: 0,
                        showInLegend: false,
                        size: '80%',
                        innerSize: '60%'
                      ,

                        data: [
                            ['Plant Functional Type1', 18],
                            ['Plant Functional Type2', 14],
                            ['Plant Functional Type3', 11]


                        ]
                    }
                },
                tooltip: {
                        useHTML: true,
                        shared:true,

                         <!-- valueSuffix: '%' -->
             formatter: function () {   

                    return  this.point.name +  
                      '</b><br/>Species: ' + feature.properties.species+ ' <br> name ' + feature.properties.listvalues;                             
        }

                },
                series: [
                    {
                        type: 'pie',
                        name: 'PFT',
                        data: promise,
                        dataLabels: {
                            color:'black',
                            distance: -20,
                            formatter: function () {
                                <!-- if(this.percentage!=0)  return Math.round(this.percentage)  + '%'; -->

                            }
                        }
                    },
                    {
                        type: 'pie',
                        name: 'PFT',

                        dataLabels: {
                            connectorColor: 'grey',
                            color:'black',
//                            y:-10,
                            softConnector: false,
                            connectorWidth:1,
                            verticalAlign:'top',
                            distance: 20,
                            formatter: function () {
                                if(this.percentage!=0)  return this.point.name;

                            }
                        }
                    }
                ]
            });
        });



//===========================
                            });


                    }); 
            }

        });
        map.fitBounds(allbusinesses.getBounds(), {
            padding: [50, 50]
        });
        cafes.addTo(map)
        });


        }
</script>

https://jsfiddle.net/5fct62u1/

在弹出窗口中,我想显示物种名称,其中listvalues = 0,然后listvalues = 1 ans listvalues = 2

2 个答案:

答案 0 :(得分:2)

    int main()

{
    int t;
    cin >>t;
    cin.ignore();
    while(t--)
    {
        {

            stack s;
            char *st;
            st=new char[100];
            gets(st);

            s.create(strlen(st));

            if(!count_elem(st))
                cout << "NO" <<endl;
            else
            {
              i=0;
              flag=0;
              func1(s,st);

            }


        delete []st;
        }
    }
    return 0;
}

答案 1 :(得分:0)

试试这个

 var json = [{"type": "FeatureCollection", "crs": {"properties": {"type": "proj4", "href": "http://spatialreference.org/ref/epsg/4326/"}, "type": "link"}, "features": [{"properties": {"species": "Oxalis corniculata L.", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 1}, {"properties": {"species": "Pinus roxburghii Sargen", "listvalues": 2, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 2}, {"properties": {"species": "Trifolium repens L.", "listvalues": 1, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 3}, {"properties": {"species": "Poa annua L.", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 4}, {"properties": {"species": "Fragaria nubicola Lindley ex Lacatia", "listvalues": 0, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 5}, {"properties": {"species": "Cedrus deodara (Roxb. ex Lambert.) G.Don.", "listvalues": 2, "model": "pft.existing_data_apft"}, "type": "Feature", "geometry": {"coordinates": [76.320083, 32.233167], "type": "Point"}, "id": 6}]}]

 for(var i = 0; i< json[0].features.length;i++){
    if( json[0].features[i].properties.listvalues == 0){
      console.log(json[0].features[i].properties.species);
     }else if( json[0].features[i].properties.listvalues == 1){
      console.log(json[0].features[i].properties.species);
     }else( json[0].features[i].properties.listvalues == 2){
      console.log(json[0].features[i].properties.species);
     }
 }