Добавление динамического массива в данные серии круговых диаграмм ECharts

У меня динамический массив arr объектов, которые дают следующий результат:

{value:0, name:'Safety'},{value:0, name:'Environmental'},{value:0, name:'Finance'},{value:0, name:'Health'},{value:1, name:'Quality'}

Я хочу использовать его в следующем JavaScript:

                        series: [
                        {
                            name: 'Pie Chart',
                            type: 'pie',
                            radius: '55%',
                            center: ['50%', '60%'],
                            data: [arr]
                            //data: [{value:0, name:'Safety'},{value:0, name:'Environmental'},{value:0, name:'Finance'},{value:0, name:'Health'},{value:1, name:'Quality'}]
                        }
                    ]

Тем не менее, когда я использую data: [arr] диаграмма не отображается. Но если я вставлю вывод необработанного массива, он будет работать

Любой способ решить это?

Изменить: результаты отладчика ниже:

["{value:0, name:'Safety'}", "{value:0, name:'Environmental'}", "{value:0, name:'Finance'}", 2 more...]

Когда я alert(arr) это показано без двойных кавычек.

Изменить 2. Полный код ниже

<script type="text/javascript">

            window.onload = function () {
                $.ajax({
                    dataType: "json",
                    url: "/Home/GetDataPie",
                    type: "POST",
                    data: JSON,
                    success: function (data) {
                        PieChart(data);

                    },
                    error: function () {
                        alert("err!");
                    }
                });

            }

            function PieChart(data) {

                var arr = [];

                var arrayLength = data.value.length;
                for (var i = 0; i < arrayLength; i++) {
                    var item = "{value:" + parseInt(data.value[i]) + ",name:'" + data.name[i] + "'}";
                    arr.push(item);
                }
                //shows correct array list
                //alert(arr);

                var myChart = echarts.init(document.getElementById('main'));

                option = {
                    title: {
                        text: 'My Chart',
                        subtext: '',
                        x: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    legend: {
                        orient: 'vertical',
                        x: 'left',
                        data: data.name
                    },
                    toolbox: {
                        show: true,
                        feature: {
                            mark: { show: true },
                            dataView: { show: true, readOnly: true },
                            magicType: {
                                show: true,
                                type: ['pie'],
                                option: {
                                    funnel: {
                                        x: '25%',
                                        width: '50%',
                                        funnelAlign: 'left',
                                        max: 1548
                                    }
                                }
                            },
                            restore: { show: true },
                            saveAsImage: { show: true }
                        }
                    },
                    calculable: false,
                    series: [
                        {
                            name: 'Pie Chart',
                            type: 'pie',
                            radius: '55%',
                            center: ['50%', '60%'],
                            data: arr

                        }
                    ]
                };


                myChart.setOption(option);
            }


        </script>

Это результат:

Благодарю.

решаемая

Правильный ответ, данный пользователем @AshishMalhotra в комментариях ниже

замещать

var item = "{value:" + parseInt(data.value[i]) + ",name:'" + data.name[i] + "'}";

с

var item = {value: data.value[i] ,name:data.name[i]};

3 ответа

Решение

Правильный ответ, данный пользователем @AshishMalhotra в комментариях

замещать

var item = "{value:" + parseInt(data.value[i]) + ",name:'" + data.name[i] + "'}";

с

var item = {value: data.value[i] ,name:data.name[i]};

Попробуйте заменить

data: [arr]

с

data: arr

Поскольку arr сам по себе является массивом, arr = [{value:0, name:'Safety'},{value:0, name:'Environmental'},{value:0, name:'Finance'},{value:0, имя: "Здоровье"}, {значение:1, имя: "Качество"}].

Это означает, что ваше свойство данных в настоящее время настроено на чтение [[{value:0, name:'Safety'},{value:0, name:'Environmental'},{value:0, name:'Finance'},{ значение: 0, имя: "Здоровье"}, {значение:1, имя: "Качество"}]] или массив с одним значением, которое является обр.

Привет, надеюсь, это поможет вам:

попробуйте сначала построить данные и ряд данных как:

try building the data for legend and data series first as:

var groupChartData=[];
var groupEmployeeDataSeries=[];

// build from dynamic data (json or array) 
<for data: datalist>
      groupChartData.push(data.name);
      groupEmployeeDataSeries.push({value:data.value,name:data.name+"("+ data.value+")"});
</for>
echartPie.setOption({
      tooltip: {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
      },
       legend: {
        x: 'center',
        y: 'bottom',
        data: groupChartData
      }, 
      toolbox: {
        show: true,
        feature: {
          magicType: {
            show: true,
            type: ['pie', 'funnel'],
            option: {
              funnel: {
                x: '25%',
                width: '50%',
                funnelAlign: 'left',
                max: 1548
              }
            }
          },
          saveAsImage: {
            show: true,
            title: "Save Distribution"
          }
        }
      },
      calculable: true,
      series: [{
        name: 'Employee Distribution ('+type+' Wise)',
        type: 'pie',
        radius: '55%',
        center: ['50%', '48%'],
        data:groupEmployeeDataSeries
      }]
    });

Это работает для меня.

Другие вопросы по тегам