2

米国の州の選択について、米国の州に焦点を当てたいと思います。コードは次のとおりです。

    var ddd = {
        "US-VA": 1,
        "US-PA": 1,
        "US-TX": 1,
        "US-RI": 1,
        "US-SC": 1,
        "US-OR": 1,
        "US-CO": 1,
        "US-KY": 1
    };
    var map = {};

  $(function(){
    map = new jvm.WorldMap({
        map: 'us_aea_en',
        backgroundColor: '#EEEEEE',
        container: $('#us-map'),
        regionsSelectable: true,
        regionsSelectableOne: true,
        regionStyle: {
            initial: {
                fill: '#777777',
                "fill-opacity": 1,
                stroke: 'none',
                "stroke-width": 0,
                "stroke-opacity": 1
            }
        },
        series: {
            regions: [{
                values: ddd,
                scale: ['#FF6633', '#FF6622'],
                normalizeFunction: 'linear'
            }]
        },
        markerStyle: {
        initial: {
        fill: '#F8E23B',
        stroke: '#383f47'
        }
        },
        markers: [
            {latLng: [41.17, -74.92], name: 'New York'},
            {latLng: [34.06, -118.25], name: 'Los Angeles'},
            {latLng: [29.98, -95.54], name: 'Houston'},
            {latLng: [42.42, -71.3], name: 'Boston'},
            {latLng: [32.79, -96.81], name: 'Dallas'},
            {latLng: [32.79, -79.95], name: 'Charleston'},
            {latLng: [38.02, -122.89], name: 'San Francisco'},
            {latLng: [35.17, -106.86], name: 'Albuquerque'},
            {latLng: [35.72, -97.99], name: 'Oklahoma City'},
            {latLng: [61.22, -149.91], name: 'Anchorage'},
            {latLng: [21.47, -158.08], name: 'Honolulu'}
        ],
        //onRegionSelected: function(event, isSelected, selectedRegions){
        onRegionSelected: function(selectedRegions){
            map.setFocus(9, selectedRegions);
        }
      });
    });

リージョンを選択すると、マーカーが間違った場所に描画されます。マップのように小さなシフトが見られますsetFocusが、マーカーは左上隅に移動します。jvectormap-1.1.1.min.jsとjquery- 1.8.3.min.jsを使用しています

ロード時のマップは次のとおりです。 ここに画像の説明を入力

州を選択した後のマップは次のとおりです。 ここに画像の説明を入力

どんな手掛かり？

4

1 に答える 1

1

onRegionSelectedメソッドの定義を次のように変更します。

onRegionSelected: function(e, code, isSelected,  selectedRegions){
     map.setFocus(selectedRegions);
}

このsetFocusメソッドは、最大3つのパラメーターを受け取ることを想定しています。1つ目は、スケール、リージョンコード、またはリージョンコードの配列のいずれかです。2番目と3番目のパラメータは、ビューポートの中心を指定するcenterXとです。centerY

9最初のパラメーターとして番号を送信し、次にイベントオブジェクトを送信する2番目のパラメーターと奇妙なことが起こりました。

また、regionsSelectableOne: falseマップを設定すると、選択した地域（州）を含めるために適切なレベルにズームすることがわかります。

于 2013-02-17T18:45:01.773 に答える