使用 mysql 填充 ammap

Question

我在 Javascript 方面经验不足，而且我对 ammap (http://www.amcharts.com/javascript-maps/) 有点着迷。

想法是从 mysql 数据库向地图添加一些位置。他们关于此的教程章节已过时，建议改用 DataLoader 插件 (http://www.amcharts.com/tutorials/using-data-loader-plugin/)。然而，这是针对 amcharts 而不是 ammap，我无法弄清楚。

代码如下：

index.php

<script src="ammap/ammap.js" type="text/javascript"></script>
<link rel="stylesheet" href="ammap/ammap.css" type="text/css"
media="all" />
<script src="ammap/maps/js/germanyLow.js" type="text/javascript"></script>
<script
src="http://www.amcharts.com/lib/3/plugins/dataloader/dataloader.min.js"
type="text/javascript"></script>



<script type="text/javascript">
AmCharts.makeChart( "mapdiv", {
      "type": "map",
      "dataProvider": {
          "map": "germanyLow"
      }
      "dataLoader": {
        "url": "data.php",
        "format": "json",
        "showErrors": true
      },
    } );
</script>


<div id="mapdiv" style="width: 600px; height: 400px;"></div>

data.php

<?php
$server = "localhost";
$user = "root";
$pass = "";
$db = "map";

$conn = new mysqli ( $server, $user, $pass, $db);

if ($conn->connect_error) {
    die ( "Connection failed: " . $conn->connect_error );
}

$sql = "SELECT latitude, longitude FROM map";

$result = $conn->query($sql);

if($result->num_rows > 0){
    $data = array();
    while($row = $result->fetch_assoc()){
        $data[] = $row;
    }
}else{
    //
}
$string = json_encode($data);
echo $string;
?>

data.php文件的json字符串是：

[{"latitude":"48.47","longitude":"9.11"},{"latitude":"53.33","longitude":"10"}]

使用此代码无法加载地图。如果我注释掉 dataLoader 部分，则地图本身加载得很好。有人知道如何正确使用 dataLoader 吗？任何帮助将不胜感激。

Answer 1

在 amcharts 支持人员的帮助下解决了。对于那些对解决方案感兴趣的人：

AmCharts.makeChart("mapdiv", {
  "type": "map",
  "data": {
    "map": "germanyLow"
  },
  "dataLoader": {
    "url": "data.php",
    "format": "json",
    "showErrors": true,
    "postProcess": function(data, config, map) {
      // create a new dataProvider
      var mapData = map.data;

      // init images array
      if (mapData.images === undefined)
        mapData.images = [];

      // create images out of loaded data
      for(var i = 0; i < data.length; i++) {
        var image = data[i];
        image.type = "circle";
        mapData.images.push(image);
      }
      return mapData;
    }
  }
 });

使用 mysql 填充 ammap

Filling ammap using mysql

javascript

php

mysql

ammap