Question

我有问题显示我从MySQL数据库中提取的数据。虽然JSON有效，但JSON格式不正确。我想我的问题至少有两种方法，1。改变MySQL查询或2.用jQuery操纵JSON输出，然后用Gmap3构建谷歌地图。我和他们中的任何一个都很挣扎..

my-json.php中的MySQL查询和JSON编码：

try {

$db = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);

$tatorte = $db->query("
    SELECT p.post_title as title,
        max(case when pm.meta_key = '_cmb_tatort_map_latitude' then pm.meta_value end) as lat,
        max(case when pm.meta_key = '_cmb_tatort_map_longitude' then pm.meta_value end) as lng,
        max(case when pm.meta_key = '_cmb_subline' then pm.meta_value end) as subline,
        max(case when pm.meta_key = '_cmb_teaser_text' then pm.meta_value end) as teaser
    FROM mob_posts p join
        mob_postmeta pm
        on pm.post_id = p.ID
    WHERE pm.meta_key in ('_cmb_tatort_map_latitude', '_cmb_tatort_map_longitude', '_cmb_subline', '_cmb_teaser_text') and
        p.post_type = 'tatort'
        group by p.id
    ORDER BY p.id DESC
    LIMIT 100;
");

$rows = array();

while ($locations = $tatorte->fetch_assoc()) {
    $rows[] = array('values' => $locations);
}

$json = array(
    "center" => array(51.95026490,11.69227350), // center map at a given location
    "tatorte" => $rows
);

header('Content-Type: application/json; charset=UTF-8;');
echo json_encode( $json );

} catch (Exception $e) {
    echo $e->getMessage();
}

所以这看起来工作得很好，我得到了一个有效的JSON：

{
    "center":[
        51.9502649,
        11.6922735
    ],
    "tatorte":[
        {
            "values":{
                "title":"my title",
                "lat":"51.7920562",
                "lng":"11.141447999999968",
                "subline":"my sublime",
                "teaser":"my teaser text"
            }
        }
   ]
}

显然，格式应该是这样的：

{
    "center": [
        46.578498,
        2.457275
    ],
    "tatorte": [
        {
            "lat": 49.00408,
            "lng": 2.56228,
            "data": {
                "title":"my title",
                "subline":"my sublime",
                "teaser":"my teaser text"
            }
        }
    ]
}

所以我尝试在jQuery中加载和操作我的JSON：

function loadData(){
    var markers = [];
    $.ajax({
        url:'my-json-load.php',
        success:function(data){
            var markers = [];
            $.each(data, function(key, val){
            var position = [val.lat, val.lng];
            markers.push({ latLng: position });
            });
            display(data.center, data.tatorte);
        }
    });
}

然后，使用Gmap3插件显示它们：

$(function(){
    loadData();
});

function display(center, tatorte) {
    $('#map_canvas').gmap3({
        map:{
            options:{
                center: center,
                zoom:7,
                mapTypeId: google.maps.MapTypeId.TERRAIN
            }
        },
        marker: {
            values: tatorte
        }
    });
}

正确显示中心点，与地图相同。只缺少标记。我错过了正确的做法......我想这很容易，但我对jQuery / javascript没有太多经验，或者如何改变MySQL查询以获得正确的标记值格式。任何人？非常感谢。感谢。

Answer 1

尝试调整你的PHP。

while ($locations = $tatorte->fetch_assoc()) {
    $lat = $locations['lat'];
    $lng = $locations['lng'];
    $values = json_encode( array('title' => $locations['title'], 'subline' => $locations['subline'], 'teaser' => $locations['teaser']) );

    $rows[] = array('lat' => $lat, 'lng' => $lng, 'values' => $values);
}

使用MySQL，JSON和jQuery插件Gmap3填充Google Map Markers

1 个答案: