assign data query to each Polygon with bindpopup Leaflet in Codeigniter-CodePudding

i wrote some codes in Codeigniter to assign query result into each polygons with $.getJSON but i found some problems. Here is my $.getJSON code

$.getJSON("<?php echo base_url(); ?>Request/showData", function(data) {
            var area_data = new Array(3);
            var total_data = new Array(3);
            for (var i = 0; i < data.length; i  ) {
                area_data[i] = data[i].Area;
                total_data[i] = data[i].total;      
            }         
            layer.bindPopup(area_data   ':'   total_data);
        })

from this js script, i got this kind of result

The expected result is each polygon shows its alphabet and value same like the red color. but right now i have each polygon shows all alphabets and values from query.

model function

public function map()
{
    $query = $this->db->query(
        "SELECT Area, sum(Value) as total from ( select Area,Value from try_1 union all select Area,Value from try_2 ) view_vall group by Area"
    );
    return $query->result_array();
}

controller function

public function showData()
    {
        $aa = $this->model_request->map();
        echo json_encode($aa);     
    }

Thanks in advance

CodePudding user response：

turns out that i found the answer..

it needs to add conditional with if after the looping and add variable to put value inside bindpopup.

$.getJSON("<?php echo base_url(); ?>Request/showData", function(data) {
        var area_data = new Array(3);
        var total_data = new Array(3);
        for (var i = 0; i < data.length; i  ) {
            area_data[i] = data[i].Area;
            total_data[i] = data[i].total;      
        }         
        var popup;
        if (feature.properties.Area == 'A') {
          popup = area_data[0]   ':'   total_data[0];
        } else if (feature.properties.Area == 'B') {
          popup = area_data[1]   ':'   total_data[1];
        } else {
          popup = area_data[2]   ':'   total_data[2];
        }

        layer.bindPopup(popup);
    })