JQVMapにピンを追加するには？

Question

質問はそれ自体のことを言います - 私はすべてのドキュメントを通過しましたが、私は明らかに何かが欠けています。ここで

は私の現在のjavascriptです：

私のページで、私はこれを呼び出しIndex.initJQVMAP();

呼び出す：私のHTMLで

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(); 
}, 

私は持っているが：

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

のみ作業していない部分はピンです。私は地域コードの大文字と小文字を変更しようとしましたが、これは効果がありません。

私のコードは、誰もが私が間違ってやっているかを見ることができます

here可能なドキュメントに従っているようです。ピンはまったく表示されません。

Answer 1

idのピンで作業するときに問題が発生しました。私はhereの例を使用しました。 jqvmap使用の定義における

function escapeXml(string) { 
    return string.replace(/[<>]/g, function (c) { 
     switch (c) { 
     case '<': return '\u003c'; 
     case '>': return '\u003e'; 
     } 
    }); 
    } 

var pins = { 
     mo: escapeXml('<div><span>123</span></div>'), 
     fl: escapeXml('<div><span>456</span></div>') 
    }; 

そして：

 pins: pins, 
     pinMode: 'content', 

あなたのケースでは、それはようなものになるだろう