0

我已将 Google 地球插件加载到 html 页面中，一切正常。一旦我将它加载到 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>
4

1 回答 1

0

问题是您的代码中没有指定包含元素。在您的 init 函数中，您指定插件应加载到具有 ID 的元素中map3d，即

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

但是map3d文档中没有带有 id 的元素，我看到您在这里注释掉了部分代码：

 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>
于 2011-08-30T18:16:54.703 回答