$.getJSON("data/fooo", function (data) {
    var list = $("<ul />");
    var mapC = $("<div />", {class: "map", id: "map"});
    mapC.appendTo("body");
    var track = [];
    var times = [];
    $.each(data.spatials, function (i, elem) {
        track.push([elem.coordinates[1], elem.coordinates[0]]);
        times.push(i);
    });
    var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
        });
    var map = L.map("map", {layers: [tiles]});
    L.control.scale().addTo(map);
    var layer = L.polyline(track).addTo(map);
    map.fitBounds(layer.getBounds());
    $.each(data, function (key, value) {
        //console.log(key, value);
        //key: instance_id, value: AnlysisResult
        //value.result.instance: InstanceConfig_id
        // console.log(key, value[0].result.store[0].timestamp);
        /*$.each(value[0].result.store, function (index, entry) {
            //console.log(entry);
            var time = new Date(entry.timestamp);
            var item = $("<li>", {html: entry.sequence + " @ " + time.toLocaleDateString() + " "+ time.toLocaleTimeString()});
            var container = $("<p />");
            if (entry.track.length > 0) {
                var mapName = "map" + index;
                //console.log(mapName, entry.track.length);
                var mapContainer = $("<div />", {id: mapName, class: "map"});
                var track = [];
                $.each(entry.track, function (i, elem) {
                    track.push([elem.coordinates[1], elem.coordinates[0]]);
                });
                maps[mapName] = track;

                mapContainer.appendTo(container);
            }
            $.each(entry.events, function (i, event) {
                if ("image" in event) {
                    $("<img />", {src: event.image, height: 200}).appendTo(container);
                }
            });
            container.appendTo(item);
            item.appendTo(list);
        });*/
    });
    list.appendTo("body");
    var slider = $("<input />", {type: "range", start:0,end:100});
    slider.appendTo("body");
    /*});

    $(window).on("load", function () {*/
    // setTimeout(function () {

    //console.log(maps);
    /*$.each(maps, function (mapName, track) {
        //console.log("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAa");
        var tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
        });
        var map = L.map(mapName, {layers: [tiles]});
        L.control.scale().addTo(map);
        // console.log(mapName, track);
        var layer = L.polyline(track, {color: "green"}).addTo(map);
        map.fitBounds(layer.getBounds());
        //console.log(layer)
        //L.control.layers({"osm":tiles}, {layer]).addTo(map);
    });*/
    // }, 2000);
});