5

jVectorMap プラグインを使用しており、次のようなマップ配列から name 要素を取得しようとしています。

$.fn.vectorMap('addMap', 'usa_en', {
    "width": 959,
    "height": 593,
    "pathes": {
        "hi": {
            "path": "COORDINATES_GO_HERE",
            "name": "Hawaii"
        },
        "ak": {
            "path": "COORDINATES_GO_HERE",
            "name": "Alaska"
        },
        "fl": {
            "path": "COORDINATES_GO_HERE",
            "name": "Florida"
        },
        ...and so on for the other 47 states
    }
})

プラグインは以下を使用して開始され、マップ配列ファイルは「map」設定によって定義されます。

var myData = {"hi":0,"ak":0,"fl":0, ...and so on}

$('#us-map').vectorMap({
    map: 'usa_en',
    values: myData,
    color: '#ccc',
    onRegionClick: function(event, code){
        $.get('{site_url}embeds/state_view/'+code, function(data) {
            $('#data-replace').fadeOut(200,function(){ $(this).html(data).fadeTo(200,1); });
            $('#data-title').fadeOut(200,function(){ $(this).text(INSERT_CLICKED_STATE_NAME_HERE).fadeTo(200,1); });
        });
    }
});

マップ ファイル配列から onRegionClick コールバックに州名を挿入する方法についてのアイデアはありますか?

4

1 に答える 1

5

マップ オブジェクトのハンドルを取得する必要がある場合は、次のgetRegionName()メソッドを使用できます。

onRegionClick: function(event, code){
    //obtain the reference to the map object
    var map = $('#world-map').vectorMap('get', 'mapObject');

    $.get('{site_url}embeds/state_view/'+code, function(data) {
        $('#data-replace').fadeOut(200,function(){ $(this).html(data).fadeTo(200,1); });
        $('#data-title').fadeOut(200, function(){ $(this).text(map.getRegionName(code)).fadeTo(200,1); });
    });
于 2012-10-01T00:59:07.273 に答える