$.getjson is an asynchronous request. once you receive the data, then you can pass it to highcharts, thus you have to call that code from within the callback function of $.getjson().

try this, use a helper function to process your data and draw the chart, see drawchart() below:

var options1 = {
    chart: {
        renderto: 'container1'
    series: []

var drawchart = function(data, name) {
    // 'series' is an array of objects with keys: 
    //     - 'name' (string)
    //     - 'data' (array)
    var newseriesdata = {
        name: name,
        data: data

    // add the new data to the series array

    // if you want to remove old series data, you can do that here too

    // render the chart
    var chart = new highcharts.chart(options1);

$.getjson('tokyo.jsn', function(data){
    drawchart(data, 'tokyo');
$.getjson('sydney.jsn', function(data){
    drawchart(data, 'sydney');

see fiddle:


you can use solution used by highcharts in that example:

or first create empty chart, without any series, and then use addseries() function in each callback, see:

Related Query

More Query from same tag