jVectorMap增加（世界）地圖大小

我使用從http://jvectormap.owl-hollow.net/的jVectorMap，一切工作正常。但是世界地圖的標準尺寸非常小。如果有人想打波斯尼亞和黑塞哥維那，他需要大眼鏡！有縮放按鈕可用，但您必須在容器內移動地圖。jVectorMap增加（世界）地圖大小

我試圖擴大div元素，但它似乎是地圖都有一個固定的大小。要幫我provida一個更大的世界地圖：

有沒有機會獲得當用戶進入地圖網站不同的標準變焦？
我需要一個更大的世界地圖？

或者我還能以提供更大的世界地圖做什麼？

乾杯！

來源

2011-10-12 Ajin

要使它成爲一個更大的世界地圖，只需調整容器的大小。

如果你想用默認值放大，變焦按鈕被綁定到下面的代碼位：

this.container.find('.jvectormap-zoomin').click(function(){ 
    if (map.zoomCurStep < map.zoomMaxStep) { 
     var curTransX = map.transX; 
     var curTransY = map.transY; 
     var curScale = map.scale; 
     map.transX -= (map.width/map.scale - map.width/(map.scale * map.zoomStep))/2; 
     map.transY -= (map.height/map.scale - map.height/(map.scale * map.zoomStep))/2; 
     map.setScale(map.scale * map.zoomStep); 
     map.zoomCurStep++; 
     $('#zoomSlider').css('top', parseInt($('#zoomSlider').css('top')) - sliderDelta); 
    } 
}); 
this.container.find('.jvectormap-zoomout').click(function(){ 
    if (map.zoomCurStep > 1) { 
     var curTransX = map.transX; 
     var curTransY = map.transY; 
     var curScale = map.scale; 
     map.transX += (map.width/(map.scale/map.zoomStep) - map.width/map.scale)/2; 
     map.transY += (map.height/(map.scale/map.zoomStep) - map.height/map.scale)/2; 
     map.setScale(map.scale/map.zoomStep); 
     map.zoomCurStep--; 
     $('#zoomSlider').css('top', parseInt($('#zoomSlider').css('top')) + sliderDelta); 
    } 
});

你可以簡單地複製和調整的代碼。

來源

2011-10-14 07:58:00 pgl

在文件中jQuery的jvectormap.js是代碼：

WorldMap.prototype = { 
    transX: 0, 
    transY: 0, 
    scale: 1, 
    baseTransX: 0, 
    baseTransY: 0, 
    baseScale: 1,

我只是改變規模：3和，似乎工作

來源

2012-06-22 09:15:09 Steve

@阿金這應該被標記爲在2016年仍然相關的答案。 – EpicJoker

，你只需要改變這些值：

$('#world-map').vectorMap({ 
     map: 'chile', 
      focusOn: { 
     x: 0.6, 
     y: -0.2, 
     scale: 2 
    },

來源

2015-12-10 23:30:01

歡迎來到堆棧溢出！請添加一些關於此代碼爲何/如何幫助OP的解釋。這將有助於提供未來觀衆可以從中學習的答案。有關更多信息，請參閱[答案]。 –

你最好不要修改jQuery的jvectormap.js代碼，而不是指定的水平和垂直（X和Y）座標，如API顯示：params.x - 數從0到1，指定的中央點的水平座標視 – fraktal12

這爲我做

var mapParams = { 
      map: 'world_en', 
      backgroundColor: '#FAFBFC', 
      color: '#f2f4f6', 
      borderColor: '#D1D4D7', 
      borderOpacity: 0.7, 
      values: mapData, 
      scaleColors: ["#4671E0", "#5AA6F0"], 
      normalizeFunction: 'polynomial', 
      onLoad: function(event, map) 
      { 
       jQuery('#map-email-opens').vectorMap('zoomIn'); 
      } 
     } 

     $('#map-email-opens').vectorMap(mapParams);

來源

2017-09-13 12:14:54

jVectorMap增加（世界）地圖大小

回答

相關問題