Javascript 使用Json文件在GeoTeco上显示数据_Javascript_Html_Json_Geolocation

Javascript 使用Json文件在GeoTeco上显示数据

javascript html json geolocation

Javascript 使用Json文件在GeoTeco上显示数据,javascript,html,json,geolocation,Javascript,Html,Json,Geolocation,我有一个简单的json文件“example.json”，其条目的格式如下： { "id": 122, "name" : Wearable, "description": someDescription, "lon" : 11.581981, "lat" : 48.135125, "place" : Munich, "time" : 2013-11-20, "tableContent": someValuesList } 我想在

我有一个简单的json文件“example.json”，其条目的格式如下：

{ 
    "id": 122,
    "name" : Wearable,
    "description": someDescription,
    "lon" : 11.581981, 
    "lat" : 48.135125,
    "place" : Munich,
    "time" : 2013-11-20,
    "tableContent": someValuesList
}

我想在一个名为Geotemco（）的可视化程序上显示这些信息

我可以显示地图，但无法显示此json文件中的信息。 loader.html文件如下所示：

    <!DOCTYPE html>
    <html>

      <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>GeoTemCo</title>
        <link rel="stylesheet" href="css/geotemco.css" type="text/css"/>
        <script src="geotemco-min.js"></script>
        <script src="js/Util/Publisher.js"></script>
        <script src="js/Build/Loader/DynaJsLoader.js"></script>
        <script src="js/Build/Loader/Loader.js"></script>
      </head>

      <body>

        <div id="mapContainerDiv" style="position:relative;"></div>
        <div id="plotContainerDiv" style="position:relative;"></div>
        <div id="tableContainerDiv" style="position:relative;"></div>

        <script>
            var datasets = [];
            var mapDiv = document.getElementById("mapContainerDiv");
            var map = new WidgetWrapper();
            var mapWidget = new MapWidget(map,mapDiv);
            var timeDiv = document.getElementById("plotContainerDiv");
            var time = new WidgetWrapper();
            var timeWidget = new TimeWidget(time,timeDiv);
            var tableDiv = document.getElementById("tableContainerDiv");
            var table = new WidgetWrapper();
            var tableWidget = new TableWidget(table,tableDiv);
        //  var jsonFile = GeoTemConfid.getJson('data/example.json');
        //  var jsonData = GeoTemConfig.loadJson(jsonFile);
        //  var dataset = new Dataset([{"name" : "Wearable","lon" : "11.0","lat" : "48.0","place" : "USA/New York/New York City/Liberty Island","time" : "2013","tableContent": "someValuesList"}],'Events');
        //  datasets.push(dataset);

datasets.push(new Dataset(GeoTemConfig.loadJson(GeoTemConfig.getJson('/data/example.json')),'Events'));

            map.display(datasets);
            time.display(datasets);
            table.display(datasets);

        </script>

      </body>

    </html>


土工
var数据集=[]；
var mapDiv=document.getElementById（“mapContainerDiv”）；
var map=新的WidgetWrapper（）；
var mapWidget=新的mapWidget（map，mapDiv）；
var timeDiv=document.getElementById（“plotContainerDiv”）；
var time=新的WidgetWrapper（）；
var timeWidget=新的timeWidget（time，timeDiv）；
var tableDiv=document.getElementById（“tableContainerDiv”）；
var table=新的WidgetWrapper（）；
var tableWidget=新的tableWidget（table，tableDiv）；
//var jsonFile=GeoTemConfid.getJson（'data/example.json'）；
//var jsonData=GeoTemConfig.loadJson（jsonFile）；
//var数据集=新数据集（[{“名称”：“可穿戴”、“lon”：“11.0”、“lat”：“48.0”、“地点”：“美国/纽约/纽约市/自由岛”、“时间”：“2013”、“表格内容”：“someValuesList”}]、“事件”）；
//push（数据集）；
push（新数据集（GeoTemConfig.loadJson（GeoTemConfig.getJson（'/data/example.json'），'Events'））；
地图显示（数据集）；
时间显示（数据集）；
表.显示（数据集）；

我尝试了各种方法，但无法在地图上的任何位置显示事件。它始终仅加载地图：

请帮我解决这个问题。

非常感谢您的json文件内容有误。应该是这样的：

[
    { 
        "id": 122,
        "name": 'Wearable',
        "description": 'someDescription',
        "lon" : 11.582, 
        "lat" : 48.135,
        "place" : 'Munich',
        "time" : '2013-11-20',
        "tableContent":  {'a': '111', 'b': '222'}
    }
]

查看和查看Geotermco现场