jquery - Jquery-ui-map をマーカーにパンし、ボタンのクリックで情報ボックスを開く

Question

jquery-ui-map を使用して、json 経由でデータを取得し、マップに表示しています。それはうまくいきます。

しかし、私がやりたいのは、HTMLページのリンクをクリックして、選択したマーカーにパンできるようにすることです

ので、私は持っています

id="13" などの例のリンク

クリックするとパンして、選択したマーカーの情報ウィンドウが開きます

マーカー自体にIDが必要だと思うので、jsonを使用してデータベースから引き出しています。そうしないと、失われます...

この例を使用して、json http://jquery-ui-map.googlecode.com/svn/trunk/demos/jquery-google-maps-json.htmlからデータを取得しています

$(function () {
    demo.add(function () {
        $('#map_canvas').gmap({
            'disableDefaultUI': false,
            'callback': function () {
                var self = this;
                $.getJSON('jsonfile', function (data) {
                    $.each(data.markers, function (i, marker) {
                        self.addMarker({
                            'id': marker.id,
                            'position': new google.maps.LatLng(marker.latitude, marker.longitude),
                            'icon': 'images/stendas.png',
                            'bounds': true
                        }).click(function () {
                            self.openInfoWindow({
                                'content': marker.content
                            }, this);
                        });
                    });
                });
            }
        });
    }).load();
});

私のjsonは

{
    "markers": [{
        "latitude": "55.347889111331924",
        "longitude": "23.01470909375007",
        "title": "Kaunas-Marijampol\u0117",
        "content": "<p>Kelyje Kaunas-Marijampol\u0117 \u00a0(25,5 km nuo Kauno)<\/p>\r\n<p><img src=\"images\/stendu_nuotraukos\/JA_reklaminis_stendas_15000x5000_1_mariampole_r1_c1.jpg\" alt=\"JA reklaminis stendas 15000x5000 1 mariampole r1 c1\" height=\"280\" width=\"370\" \/><\/p>",
        "id": "9"
    }, {
        "latitude": "55.260338151525985",
        "longitude": "24.78350792187507",
        "title": "Panev\u0117\u017eys \u2013 Vilnius",
        "content": "<p>Kelyje Panev\u0117\u017eys \u2013 Vilnius (79 km nuo Vilniaus, prie Ukmerg\u0117s)\u00a0<\/p>\r\n<p><img src=\"images\/stendu_nuotraukos\/P5211983_r1_c1.jpg\" alt=\"P5211983 r1 c1\" height=\"280\" width=\"370\" \/><\/p>",
        "id": "10"
    }, {
        "latitude": "54.87660670317833",
        "longitude": "24.24517784375007",
        "title": "Vilnius \u2013 Kaunas 1",
        "content": "<p>Kelyje Vilnius \u2013 Kaunas (70 km nuo Vilniaus link Kauno)<\/p>\r\n<p><img src=\"images\/stendu_nuotraukos\/Nuo_Vilniaus_1_stendo_puse_r1_c1.jpg\" alt=\"Nuo Vilniaus 1 stendo puse r1 c1\" height=\"280\" width=\"370\" \/><\/p>",
        "id": "11"
    }, {
        "latitude": "54.794351653090246",
        "longitude": "24.68463096875007",
        "title": " Vilnius \u2013 Kaunas 2",
        "content": "<p>Kelyje Vilnius \u2013 Kaunas (55 km nuo Vilniaus link Kauno)<\/p>\r\n<p><img src=\"images\/stendu_nuotraukos\/SDC11331_r1_c1.jpg\" alt=\"SDC11331 r1 c1\" height=\"280\" width=\"370\" \/><\/p>",
        "id": "12"
    }, {
        "latitude": "55.720922855823375",
        "longitude": "21.37774620312507",
        "title": " Klaip\u0117da \u2013 Kaunas",
        "content": "<p>Kelyje Klaip\u0117da \u2013 Kaunas (14,5km nuo Klaip\u0117dos link Kauno)<\/p>\r\n<p><img src=\"images\/stendu_nuotraukos\/P9050011_r1_c1.jpg\" alt=\"P9050011 r1 c1\" height=\"280\" width=\"370\" \/><\/p>",
        "id": "13"
    }]
}

少なくとも任意のマーカーを開くことができるコードを見つけました

function (map, marker) {
    $('.item-page').click(function () {
        $(marker).triggerEvent('click');
        return false;
    });
}

id=13 のマーカーなど、特定する必要があります