7

jvectormapプラグインを使用していて、マップ上の各領域の色を設定しようとしています。ただし、下のコードを適用すると、マップは表示されますが、色は適用されません。地図を白で表示しているだけです。

私はこの問題について複数の例と質問を読みましたが、それをうまく機能させることができないようです。

地図上にランダムな色を設定する例1 。

ドキュメンテーション

私と同じような質問ですが、それでも私の問題は解決しません。

jQuery('#mapDiv').vectorMap({
    map: 'au_merc_en',
    backgroundColor: 'none',
    colors: {
        AU-SA: '#4E7387',
        AU-WA:'#333333',
        AU-VIC:'#89AFBF',
        AU-TAS:'#817F8E',
        AU-QLD:'#344B5E',
        AU-NSW:'#344B5E',
        AU-ACT:'#344B5E',
        AU-NT:'#344B5E'

    },
    series: {
      regions: 
      [{
        attribute: 'fill'
      }]
    }
});

誰かが問題を見ることができますか？

4

2 に答える 2

12

これがあなたがやろうとしていることの実例です。

http://jsfiddle.net/3xZ28/34/

(function() {
    var myCustomColors = {
        'AU-SA': '#4E7387',
        'AU-WA': '#333333',
        'AU-VIC': '#89AFBF',
        'AU-TAS': '#817F8E',
        'AU-QLD': '#344B5E',
        'AU-NSW': '#344B5E',
        'AU-ACT': '#344B5E',
        'AU-NT': '#344B5E'
    };

    map = new jvm.WorldMap({
        map: 'au_merc_en',
        container: $('#ausie'),
        backgroundColor: '#eff7ff',
        series: {
            regions: [{
                attribute: 'fill'
            }]
        }
    });

    map.series.regions[0].setValues(myCustomColors);
})();

この例は、jvectormapサイトの2つの例から構築されています。1。http : //jvectormap.com/maps/countries/australia/
2. http://jvectormap.com/examples/random-colors/

フィドルには、サイトのjvectormap1.1ファイルが含まれています。また、サイトのランダムカラーの例ではjvmを使用していることに注意してください。世界地図。

于 2012-10-13T00:57:48.707 に答える
2

以下のコードは、投稿されたコードの構文エラーを修正するために編集されています。

jQuery('#mapDiv').vectorMap({
    map: 'au_merc_en',
    backgroundColor: 'none',
    colors:{
        "AU-SA": '#4E7387',
        "AU-WA":'#333333',
        "AU-VIC":'#89AFBF',
        "AU-TAS":'#817F8E',
        "AU-QLD":'#344B5E',
        "AU-NSW":'#344B5E',
        "AU-ACT":'#344B5E',
        "AU-NT":'#344B5E'

    },
    series: {
      regions: 
      [{
        attribute: 'fill'
      }]
    }
});

オブジェクトキー内のバインドされていない（カプセル化された私が集めることができる最も近い反意語）ハイフンは、構文エラーを引き起こします。エラー自体は無効なラベルに対するものです。

于 2012-10-13T00:37:22.707 に答える