Jvectormap上格變化

很小我有兩個div，一個與世界地圖和一個與美國地圖。當美國在世界地圖上點擊時，我想隱藏該div並將美國地圖顯示出來。Jvectormap上格變化

雖然縮放按鈕的位置表明div的大小應該是什麼，但它可以工作，但地圖很小。

enter image description here

任何想法？

如果我從一開始就將div設置爲「block」，它們都是正確的大小，它只是在調用代碼來切換div時失敗。

onRegionClick: function(event, code){ 
         if (code == "US") { openUS('us-map') } 
      }, 

    function openUS(a) { 

    document.getElementById("world-map").style.display = 'none'; 
    document.getElementById(a).style.display = 'block'; 
    }

來源

2013-02-19 Dan James Palmer

此問題是由於您初始化隱藏元素上的貼圖而導致的，該元素的大小在此時無法正確計算。嘗試改變你的邏輯，以便jVectorMap在元素變得可見之後被初始化。

來源

2013-02-20 15:32:55 bjornd

感謝，我給一個去 – 2013-02-20 19:49:54

謝謝你 - 這解決了一個問題，即地圖太遠到右側，直到瀏覽器進行調整。延遲初始化修復它。 – Michael 2014-11-11 23:23:20

您也可以觸發該地圖的容器上的調整大小（）顯示它後。

我在做這個帖子的例子：Switch maps in Jvectormap?

來源

2013-03-03 18:49:40 silenzium

非常感謝！這工作。 – Flov 2016-05-24 05:28:50

我是有jVectorMap顯示尺寸相同的問題，並找到一種方法，讓他們正確顯示。

問題是，當你創建地圖的對象。爲了正確顯示，vectorMap對象在創建時必須可見。這就是說，當你把它們放在標籤中時，你應該：

單擊第一個選項卡。
創建第一個地圖。
單擊第二個選項卡。
創建第二張地圖.. ..
您最終可以再次單擊第一個選項卡，因此它是頁面加載中的活動頁面。

希望這可以幫助任何人有同樣的問題。

來源

2013-05-24 20:47:03 user2418915

您還可以添加邏輯代碼，當你的地圖的容器出現代碼執行一個名爲updateSize方法。特別地，這看起來像：

$('$world-map').vectorMap('get','mapObject').updateSize();

來源

2015-05-05 03:34:54 bootoffav

的問題是，與美國地圖在div是隱藏的，因此它不能計算出地圖的大小（寬度）正確。相反，你可以將CSS的高度：0。

我使用Highcharts，同爲jvectormap遇到過這個問題。下面的代碼解決了該問題（使用自舉）：

/* bootstrap hack: fix content width inside hidden tabs */ 
.tab-content > .tab-pane:not(.active), 
.pill-content > .pill-pane:not(.active) { 
    display: block; 
    height: 0; 
    overflow-y: hidden; 
} 
/* bootstrap hack end */

來源

2016-11-08 11:59:55 fraktal12

Jvectormap上格變化

回答

相關問題