2011-06-27 22 views
0

我已经将Google地球插件加载到html页面,并且一切正常。只要我将它加载到Ajax页面中,它就不会起作用。它有什么特定的要求来工作?这是我的代码的副本。Google地球插件是否可以在支持ASP.NET Ajax的页面内工作?

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Ajax.aspx.vb" Inherits="Ajax" %> 

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
     <meta http-equiv="Content-type" content="text/html; charset=utf-8"/> 
      <title>Simple Example</title> 
        <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAA5a4NhilcmrdMQ5e3o22QWRQWrGbhbxAguaJ-a4SLWYiya7Z2NRTDfQBdxmHdf5ydkZYLZTiz1tDXfg"></script> 
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>   
        <!-- earth-api-utility-library dependencies -->   
        <script type="text/javascript" src="http://geojs.googlecode.com/svn/trunk/dist/geo.pack.js"></script>   
        <script type="text/javascript" src="http://earth-api-utility-library.googlecode.com/svn/trunk/extensions/dist/extensions.pack.js">  </script>   
        <!-- kmltree source files -->   
        <link rel="stylesheet" href="kmltree.css" media="screen"> 
        <script type="text/javascript" src="kmltree.min.js"></script>     
        <script type="text/javascript"> 
         google.load("earth", "1"); 
         function init() { 
          google.earth.createInstance('map3d', initCB, failureCB); 
          } 
         function initCB(instance) { 
          ge = instance; 
          ge.getWindow().setVisibility(true); 
          var gex = gex = new GEarthExtensions(ge); 
          var tree = kmltree({ 
           url: 'http://kmltree.googlecode.com/hg/examples/kml/hello.kml', 
           gex: gex, 
           mapElement: $('#map3d'), 
           element: $('#tree') 
          }); 
          tree.load(); 
         } 
         function failureCB(errorCode) { 
          alert('failed to load plugin'); 
         } 
         $(document).ready(init);      
        </script> 

    <style type="text/css"> 
     .style1 
     { 
      width: 100%; 
     } 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"> 
     <asp:ScriptManager ID="MainScriptManager" runat="server" /> 
     <table class="style1"> 
      <tr> 
       <td rowspan="2" width="250px"> 

        <asp:Accordion ID="Accordion2" runat="server" SelectedIndex="0"> 
        <Panes> 
         <asp:AccordionPane ID="AccordionPane1" runat="server"> 
         <Header> 
         <a href="" onclick="return false;">Section 1</a> 
         </Header> 
         <Content> 
     <div id="tree" style="float:left; width:250px; height: 400px;"></div> 
         </Content> 
         </asp:AccordionPane> 
         <asp:AccordionPane ID="AccordionPane2" runat="server"> 
               <Header> 
         <a href="" onclick="return false;">Section 2</a> 
         </Header> 
         <Content> 
         fgh 
         </Content> 
         </asp:AccordionPane> 
         <asp:AccordionPane ID="AccordionPane3" runat="server"> 
               <Header> 
         <a href="" onclick="return false;">Section 3</a> 
         </Header> 
         <Content> 
         zxc 
         </Content> 
         </asp:AccordionPane> 
         <asp:AccordionPane ID="AccordionPane4" runat="server"> 
               <Header> 
         <a href="" onclick="return false;">Section 4</a> 
         </Header> 
         <Content> 
         mbc 
         </Content> 
         </asp:AccordionPane> 
        </Panes> 
        </asp:Accordion> 

       </td> 
       <td> 
        &nbsp;</td> 
      </tr> 
      <tr> 
       <td> 
        <asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0"> 
         <asp:TabPanel runat="server" HeaderText="TabPanel1" ID="TabPanel1"> 
         <ContentTemplate> 
         id="map3d" 
          <!-- <div> id="map3d" style="float:left; height: 400px; width: 600px;"</div>--> 
           </ContentTemplate> 
         </asp:TabPanel> 
         <asp:TabPanel ID="TabPanel2" runat="server" HeaderText="TabPanel2"> 
         </asp:TabPanel> 
         <asp:TabPanel ID="TabPanel3" runat="server" HeaderText="TabPanel3"> 
         </asp:TabPanel> 
        </asp:TabContainer> 
       </td> 
      </tr> 
     </table> 
    </form> 
</body> 
</html> 

回答

0

问题是在代码中没有指定包含元素。在你的初始化函数您指定插件应该被加载到与ID map3d元素,即

google.earth.createInstance('map3d', initCB, failureCB); 

但是没有与文档中的ID map3d没有元素,我看到你注释掉的一部分这里的代码:

id="map3d" 
<!-- <div> id="map3d" style="float:left; height: 400px; width: 600px;"</div>--> 

如果取消注释该div它应该工作。如果在调用createInstance()方法时指定一个作为DOM中第一个参数存在的ID,则失败。例如

<div id="map3d" style="float:left; height: 400px; width: 600px;"></div> 
相关问题