Google地球插件上下文菜單

我一直在使用Google地球插件來構建特定的功能，我想要做的事情之一是通過GE創建我自己的上下文菜單。Google地球插件上下文菜單

有沒有人這樣做？任何幫助是極大的讚賞。

2012-03-28 goodwince

您可以通過偵聽mouseup或click事件，然後使用填充疊加技術來顯示自定義上下文菜單來實現此目的。

事件偵聽器的代碼將如下所示。

// Listen for all mouseup events in the plugin. 
// Where 'ge' is an instance of the GEPlugin 
google.earth.addEventListener(ge.getWindow(), 'mouseup', eventHandler);

事件處理程序將類似於以下內容。

// Handles mouseup events (e is a KmlMouseEvent) 
var eventHandler = function(e) 
{ 
    // if it is a right-click 
    if (e && e.getButton() == 2) 
    { 
    event.preventDefault(); // optional, depending on your requirements 
    event.stopPropagation(); // optional, depending on your requirements 
    openMenu(e.getScreenX(), e.getScreenY()); 
    } 
}

最後，打開自定義菜單的代碼將如下所示。

// Insert a custom iframe at the x, y screen position 
var openMenu = function(x, y) 
{ 
    var iframe = document.createElement('iframe'); 
    iframe.frameBorder = 0; 
    iframe.scrolling = 'no'; 
    iframe.style.position = 'absolute'; 

    // build the menu as you require... 
    // then position and show it. 
    iframe.style.left = x + 'px'; 
    iframe.style.top = y + 'px'; // you may want to offset the position... 

    document.body.appendChild(iframe); // show the menu 
}

很明顯，您在菜單中放入的內容以及樣式取決於您。你也可能想要隱藏它，這只是一個刪除iframe的情況 - 可能在另一個菜單項上的監聽器（例如，當你點擊菜單項時菜單消失）

如果你在這裏被卡住是與事件合作的重要參考。 https://developers.google.com/earth/documentation/events

而且，這裏是iframe的墊片技術的工作示例： http://earth-api-samples.googlecode.com/svn/trunk/demos/customcontrols/index.html

來源

2012-03-29 01:26:23 Fraser

我發現你回答之前使用這種技術，但你的回答是幾乎完全一樣我的實現。我沒有使用左側和頂部的'px'，這是必要的嗎？感謝您的答覆弗雷澤！ – goodwince 2012-04-03 20:43:56

好東西......是的，左邊和上邊的定義是「自動|長度|％|繼承」。明確添加長度單位是一個非常好的主意，因爲它消除了您是否想要像素或百分比的任何歧義。一些瀏覽器需要單位（FireFox），一些會默認爲像素（IE），其他的則會做其他事情。如果你打算像素，然後使用它們。 – Fraser 2012-04-08 15:42:18

Doh！你是對的！！我完全忘記了像素與百分比。這種簡單的事情很容易被人遺忘。再次感謝。 – goodwince 2012-04-08 19:56:26

當前，您需要使用IFRAME SHIMS。希望這將改變一天。

看看這個頁面了一種通過使用iframe墊片爲例 http://earth-api-samples.googlecode.com/svn/trunk/demos/customcontrols/index.html

，並檢查了這等問題上的SO更多的一些信息 How can I place a html div over the Google Earth plugin? Involves wmode, I imagine

如果你有興趣，你可以看到我的網頁google earth http://www.3dwhistler.com/

來源

2012-03-29 01:25:11 lifeIsGood

Google地球插件上下文菜單

回答

相關問題