2016-12-18 1 views
1

Я хочу, чтобы отсортированная диаграмма столбцов, как http://jsfiddle.net/z2agkzt0/2/ с несортированными сериями, подобными этому. Эта серия содержит три строки данных о 'Стокгольме', 'Göteborg', 'Malmö' , что highchart, отображаемый значением y в их данных, но данные are'nt отсортированы, но я хочу отсортированную диаграмму, такую ​​как ссылка jsfiddle в вершина., отсортировав несколько столбцов диаграммы с несортированными рядами в модуле highchart-ng

series: [{ 
     type: 'column', 
     name: 'Stockholm', 
     data: [{x:0, y:95, color: Highcharts.getOptions().colors[0]}] 
    }, { 
     type: 'column', 
     name: 'Göteborg', 
     data: [{x:0, y:110, color: Highcharts.getOptions().colors[1]}] 
    }, { 
     type: 'column', 
     name: 'Malmö', 
     data: [{x:0, y:70, color: Highcharts.getOptions().colors[2]}] 
    }, { 
     type: 'column', 
     name: 'Göteborg', 
     data: [{x: 1, name: 'February', y: 98, color: 
Highcharts.getOptions().colors[1] // Göteborg's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }, { 
     type: 'column', 
     name: 'Malmö', 
     data: [{x: 1, name: 'February', y: 85, color: 
    Highcharts.getOptions().colors[2] // Stockholm's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }, { 
     type: 'column', 
     name: 'Stockholm', 
     data: [{x: 1, name: 'February', y: 100, color: 
    Highcharts.getOptions().colors[0] // Stockholm's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }, { 
     type: 'column', 
     name: 'Göteborg', 
     data: [{x: 2, name: 'Mars', y: 120, color: 
Highcharts.getOptions().colors[1] // Göteborg's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }, { 
     type: 'column', 
     name: 'Malmö', 
     data: [{x: 2, name: 'Mars', y: 92, color: 
Highcharts.getOptions().colors[2] // Stockholm's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }, { 
     type: 'column', 
     name: 'Stockholm', 
     data: [{x: 2, name: 'Mars', y: 90, color: 
    Highcharts.getOptions().colors[0] // Stockholm's color 
     }], 
     showInLegend: false, 
     dataLabels: { 
      enabled: false 
     } 
    }] 

ответ

0

Измените порядок в ряду.

series: [{ 
    type: 'column', 
    name: 'Stockholm', 
    data: [{ 
    x: 0, 
    y: 95, 
    color: Highcharts.getOptions().colors[0] 
    }] 
}, { 
    type: 'column', 
    name: 'Göteborg', 
    data: [{ 
    x: 0, 
    y: 110, 
    color: Highcharts.getOptions().colors[1] 
    }] 
}, { 
    type: 'column', 
    name: 'Malmö', 
    data: [{ 
    x: 0, 
    y: 70, 
    color: Highcharts.getOptions().colors[2] 
    }] 
}, { 
    type: 'column', 
    name: 'Stockholm', 
    data: [{ 
    x: 1, 
    name: 'February', 
    y: 100, 
    color: Highcharts.getOptions().colors[0] // Stockholm's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}, { 
    type: 'column', 
    name: 'Göteborg', 
    data: [{ 
    x: 1, 
    name: 'February', 
    y: 98, 
    color: Highcharts.getOptions().colors[1] // Göteborg's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}, { 
    type: 'column', 
    name: 'Malmö', 
    data: [{ 
    x: 1, 
    name: 'February', 
    y: 85, 
    color: Highcharts.getOptions().colors[2] // Stockholm's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}, { 
    type: 'column', 
    name: 'Stockholm', 
    data: [{ 
    x: 2, 
    name: 'Mars', 
    y: 90, 
    color: Highcharts.getOptions().colors[0] // Stockholm's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}, { 
    type: 'column', 
    name: 'Göteborg', 
    data: [{ 
    x: 2, 
    name: 'Mars', 
    y: 120, 
    color: Highcharts.getOptions().colors[1] // Göteborg's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}, { 
    type: 'column', 
    name: 'Malmö', 
    data: [{ 
    x: 2, 
    name: 'Mars', 
    y: 92, 
    color: Highcharts.getOptions().colors[2] // Stockholm's color 
    }], 
    showInLegend: false, 
    dataLabels: { 
    enabled: false 
    } 
}] 

пример: http://jsfiddle.net/z2agkzt0/5/

+0

Спасибо, но идентификатор, как функция, которая может сортировать этот JSON – SaraMousavi