1

i am trying to get the data for pie chart looping array named "pie". But getting error at the selected line e.location. i have comment that line. and here is the picture. please help me find the solution image where i get the error

<div class="col-md-6">
    <style>
        #chartdiv {
        width: 100%;
        height: 500px;
        }
    </style>

    <script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
    <script src="https://www.amcharts.com/lib/3/pie.js"></script>
    <script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
    <link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
    <script src="https://www.amcharts.com/lib/3/themes/light.js"></script>

    <script>
        var pie = [
            {"id":"1","location":"address1","value":"20"},
            {"id":"2","location":"address2","value":"30"},
            {"id":"3","location":"address3","value":"40"},
            {"id":"4","location":"address4","value":"50"},
            {"id":"5","location":"address5","value":"60"},
            {"id":"6","location":"address6","value":"70"},
            {"id":"7","location":"address7","value":"80"},
        ];

        console.log(pie);

        pie.map((e) => {
            console.log(e.location);
            return e;
        });

        var chart = AmCharts.makeChart( "chartdiv", {
            "type": "pie",
            "theme": "light",
            "dataProvider": [pie.map((e)=>{
              "location": e.location, //here is the error
              "value": e.value //here is the error
            })],
            "valueField": "value",
            "titleField": "location",
             "balloon":{
             "fixedPosition":true
            },
            "export": {
              "enabled": true
            }
        });
    </script>

    <div id="chartdiv"></div>
</div>

3 Answers 3

2

It seems like you don't need to do that mapping at all, it works without it.

So just use "dataProvider": pie,

Here's a working version on JSFiddle.

Sign up to request clarification or add additional context in comments.

1 Comment

I don't have enough reputation to vote. sorry for that.
0
[pie.map((e)=>{return {
              "location": e.location, //here is the error
              "value": e.value //here is the error}
            }})]

First { is for function and second is for object.

Comments

0
heres the controller:

    $branch_emp = $this->mainModel->getbranchwise();

            foreach ($branch_emp as $data)
            {
                $series_data[]= array('name'=>$data['branch_name'],'data'=>array($data['totalemp']));
            }
$data['branch_emp']=json_encode($branch_emp);


 <script type="text/javascript">
        $(function () {
            var temp = <?php echo $branch_emp; ?>;
            console.log(temp);
            $('#pie_chart').highcharts({
                chart: {
                    type: 'pie',
                    options3d: {
                        enabled: true,
                        alpha: 45,
                        beta: 0
                    }
                },
                title: {
                    text: 'Pie Chart of Employees'
                },
                tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        depth: 35,
                        dataLabels: {
                            enabled: true,
                            format: '{point.name}'
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: 'Browser share',
                    data: temp.map(function(e){
                        return [e.branch_name,e.totalemp];
                    })
                }]
            });
        });
    </script>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.