Как изменить JSON-ярлыки React JS - PullRequest
Новая
       11

Как изменить JSON-ярлыки React JS

0 голосов
/ 27 мая 2018

Я пытаюсь добавить диаграмму на страницу ReactJS.На той же странице у меня есть данные в таблице, и я хотел бы, чтобы эти данные были такими же, как на моем графике.Моя диаграмма выглядит следующим образом: 

export const myDataSourcePie ={
    chart: {
        caption: "Title",
        subcaption:  "Friends' chart",
        startingangle: "120",
        showlabels: "0",
        showlegend: "1",
        enablemultislicing: "0",
        slicingdistance: "15",
        showpercentvalues: "1",
        showpercentintooltip: "0",
        plottooltext: "Friend's email : $label Total messages : $datavalue",
        theme: "ocean"
},
    data: [
        {
            label: 'email',
            value: '17',
        },
        {
            label: 'email',
            value: '100',
        },
        {
            label: 'email',
            value: '17',
        },
        {
            label: 'email',
            value: '17',
        },
        {
            label: 'email',
            value: '17',
        },
        {
            label: 'email',
            value: '17',
        },
        {
            label: 'email',
            value: '100',
        },
        {
            label: 'email',
            value: '17',
        },
]
}

export const chartConfigs = {
    type: 'pie3d',
    width: 800,
    height: 600,
    dataFormat: 'json',
    dataSource: myDataSourcePie
};

, и я импортирую ее, а затем отображаю ее с помощью 

<ReactFC {...chartConfigs} />

, теперь, очевидно, данные внутри моего JSON не являются правильными данными.У меня есть список "друзей" объекта 

    friends:[
     {"first_name": "name",
      "surname": "surname",
      "email": "foo@foo.com",
      "date_of_birth": "1982-02-20",
      "nationality": "Japan",
      "messages": 5
      },
{...},
{...},
..
]

, из которого я получаю данные для помещения в таблицу, и я хотел бы получить только две метки из этого списка объектов для добавления в диаграмму (электронная почтаи сообщения).Как я могу поместить это значение в мой «myDataSourcePie»?С реквизитом?Спасибо

1 Ответ

0 голосов
/ 28 мая 2018

Попробуйте это: 

getFriendsChart()
    {
        let dataChart = [];

        this.state.friends.forEach( function( friend ) {

            dataChart.push(
                {
                    label: friend.email,
                    value: friend.messages,
                }
            );
        });

        let tempConfig = {...chartConfigs};     
        tempConfig.dataSource.data = dataChart;

        return tempConfig;
    }
...