Круговая диаграмма JQuery Flot (строка для данных)

Question

Я пытаюсь построить круговую диаграмму с некоторыми данными, которые я получаю в виде серверной сборки, в строку:

"[{ Label: "text", Data: number },{ Label: "text", Data: number }]"

немного похоже на это, но мне было интересно, можно ли как-то проанализировать эту строку для данных, которые могут использовать ее на круговой диаграмме.

Answer 1

Flot круговые диаграммы принимает только массив в качестве ввода по умолчанию. JSON - это строковый формат, поэтому он не будет работать. Чтобы решить эту проблему, вы должны либо создать массив со столбцами «метка» и «данные», либо разбить JSON и сформировать из него массив.

Пожалуйста, проверьте ниже фиктивный пример для этого:

function dataFormatter() {

    var data = [], size = 3, dataInput = 10;

        for ( var i = 0; i < size; i++) {
            data[i] = {
                        label : "Series" + (i+1),
                        data : parseInt(dataInput)
                    }
            dataInput = parseInt(dataInput) * 10;
        }   
    return data;
};

Надеюсь, это решит вашу проблему.

Answer 2

Если данные уже находятся в массиве JSON и правильно отформатированы с использованием Label и Data, вы можете просто передать массив JSON на флотацию.

Ваш код может выглядеть примерно так:

$.plot($("#default"), data,
{
    series: {
        pie: { 
            show: true
        }
    }
});

Где переменная данных - это массив JSON.