jqvmap - JQVMap にピンを追加するには?

Question

質問はそれ自体を物語っています-私はすべてのドキュメントを調べましたが、明らかに何かが欠けています。

これが私の現在のjavascriptです：

私のページで私は呼び出しますIndex.initJQVMAP();

これを呼び出す：

initJQVMAP: function () {
    if (!jQuery().vectorMap) {
        return;
    }

    var showMap = function (name) {
        jQuery('.vmaps').hide();
        jQuery('#vmap_' + name).show();
    }

    var setMap = function (name) {
        var data = {
            map: 'world_en',
            backgroundColor: null,
            borderColor: '#333333',
            borderOpacity: 0.5,
            borderWidth: 1,
            color: '#c6c6c6',
            enableZoom: true,
            hoverColor: '#c9dfaf',
            hoverOpacity: null,
            values: sample_data,
            normalizeFunction: 'linear',
            scaleColors: ['#b6da93', '#909cae'],
            selectedColor: '#c9dfaf',
            selectedRegion: null,
            showTooltip: true,
            onLabelShow: function (event, label, code) {
                if (sample_data[code] > 0)
                    label.append(': ' + sample_data[code] + ' Views');
            },
            onRegionOver: function (event, code) {
                if (code == 'ca') {
                    event.preventDefault();
                }
            },
            onRegionClick: function (element, code, region) {
                var message = 'You clicked "' + region + '" which has the code: ' + code.toUpperCase();
                alert(message);
            },
            pins: { "AF": "pin_for_af", "NA": "pin_for_na" },
            pinMode: 'id'
        };

        data.map = name + '_en';
        var map = jQuery('#vmap_' + name);
        if (!map) {
            return;
        }
        map.width(map.parent().parent().width());
        map.show();
        map.vectorMap(data);
        map.hide();
    }

    setMap("world");
    setMap("usa");
    setMap("europe");
    setMap("russia");
    setMap("germany");
    showMap("world");



    jQuery('#regional_stat_world').click(function () {
        showMap("world");
    });

    jQuery('#regional_stat_usa').click(function () {
        showMap("usa");
    });

    jQuery('#regional_stat_europe').click(function () {
        showMap("europe");
    });
    jQuery('#regional_stat_russia').click(function () {
        showMap("russia");
    });
    jQuery('#regional_stat_germany').click(function () {
        showMap("germany");
    });

    $('#region_statistics_loading').hide();
    $('#region_statistics_content').show();
},

私のHTMLには次のものがあります：

<div style="display:none">
    <div id="pin_for_af"><p>123</p></div>
    <div id="pin_for_na"><p>456</p></div>
</div>

機能していない唯一の部分はピンです。地域コードの大文字と小文字を変更しようとしましたが、効果がありません。

私のコードは、ここで入手可能なドキュメントに従っているようです

誰が私が間違っているかを見ることができますか？ピンはまったく表示されません。