5

米国の州の地図を設定しようとしています。jVectorMapをドロップしましたが、何をしても色を変更できません。

私はjsfiddleで問題を実装しようとしましたが、あちらでは何もしたくありません。私のコンピューターでは地図が生成されますが、色は変わりません。

http://jsfiddle.net/rsRnj/

私が使用しているプラ​​グイン：http：//jvectormap.com/

状態の色を変更できない理由を誰かが知っていますか？

または、もっと使いやすい地図があれば、私もその推奨事項を採用します。基本的には、ページ上で色とホバー効果を備えたクリック可能なマップが必要です。

編集今すぐ別のマップライブラリを試してみて、終了すると結果を投稿します

4

2 に答える 2

17

おそらく、jvectormapに戻ることを再検討しますか？私があなたの目標を正しく理解していれば、jvectormapはうまくいくはずです。

  1. jvectormapサイトでは、1.0バージョンが使用されています。
    http://jvectormap.com/examples/world-gdp/
    http://jvectormap.com/js/jquery-jvectormap-1.0.min.js https://raw.github.com/bjornd/jvectormap/master/jquery -jvectormap.js（最新バージョン） http://jvectormap.com/js/jquery-jvectormap-us-aea-en.js

  2. フィドルは、実際のjsファイルではなくgithubWebページにリンクしているようです。また、フィドルのjavascriptセクションにタグを追加する必要はありません。http://doc.jsfiddle.net/basic/introduction.html#javascript

  3. いくつかのサイトの例でソースを表示してみてください。また、1.0 apiのWorldMapセクションも調べてください：http：//jvectormap.com/documentation/javascript-api-v1/jvm-worldmap/

実例これ
は、色とクリックイベントの要件を満たしているように見えるフィドルのフォークです：http：
//jsfiddle.net/bQ78b/1/ 

$(function() {
    $('#usMap').vectorMap({
        map: 'us_aea_en',
        hoverColor: false,
        hoverOpacity: 0.5, 
        onRegionClick: function(e, code){
            alert( code.replace("US-", "") );
        }, 
        regionStyle: {
        initial: {
          fill: '#128da7'
        },
        hover: {
            fill: "#A0D1DC"
          }
      }
    });
});

お役に立てれば...

于 2012-09-26T22:47:16.603 に答える
-1

代わりにこのオプションを使用することになりました：http：//newsignature.github.com/us-map/

オーバーレイするデータがある場合、jVectorマップは見栄えがしますが、各状態をサイトの他の場所にリンクするだけです。

于 2012-09-16T17:09:12.427 に答える