如何使用$ .getJson设置Highcharts数据系列选项

Question

我正在尝试使用Highcharts渲染条形图，该条形图将从外部api获取json对象数组。 x轴将是城市，y轴是该城市中的人数。当我尝试将系列数据选项设置为json数组时，我得到一个未捕获的TypeError：无法读取属性＆＃39;数据＆＃39;未定义的＆＃39; chrome中的错误。

这是我正在使用的图表。

$(document).ready(function(){

var options = {
    chart : {
        renderTo: 'container1',


        title: {
            text: 'Chart 1',
        },
        subtitle: {
            text: 'data'
        },
        xAxis: {
            title: {
                text: 'city'
            }
        },
        yAxis: {
            title: {
                text: 'people'
            }

        },
        tooltip: {

            formatter: function(){
                return '<b>' + this.series.name + '</b><br/>' +
                this.x + ': ' + this.y;
            }
        },

        series: [{
            data: []
        }]
     },
 };

    $.getJSON('http://localhost:3000/api/v1/logitems_list', function(data){
    options.series.data[0] = data;
    var chart = new Highcharts.Chart(options);

    });     
});

这是我回来的json结构的一个例子

[{"id":1,"state":"Massachusetts","city":"Boston"},    {"id":2,"state":"Massachusetts","city":"Boston"},{"id":3,"state":"Massachusetts","city":"Boston"},{"id":4,"state":"Massachusetts","city":"Boston"}]