2011-12-15 9 views
0

私はZKフレームワークを扱っています。私はZKに既にGoogle Mapsコンポーネントがあることを知っていますが、私はCE版を使用していますので、このコンポーネントは利用できません。それが正常に動作し、私はGoogleマップを見ることができる私のためとしてGoogle MapsをTabコンポーネントに統合できません

gmaps.zul 
<zk> 
    <style> 
    html, body { 
     height: 100%; 
     margin: 0; 
     padding: 0; 
    } 

    #map_canvas { 
     height: 100%; 
    } 

    @media print { 
     html, body { 
     height: auto; 
     } 

     #map_canvas { 
     height: 650px; 
     } 
    } 
    </style> 
    <html> <![CDATA[ 
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&language=uk"> 
    </script> 
    <script type="text/javascript"> 
    function initialize() { 
     var myOptions = { 
      zoom: 8, 
      center: new google.maps.LatLng(-34.397, 150.644), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('map_canvas'), 
    myOptions); 
    } 

    function loadScript() { 
     var script = document.createElement('script'); 
     script.type = 'text/javascript'; 
     script.src = 'http://maps.googleapis.com/maps/api/js?sensor=false&' + 'callback=initialize'; 
     document.body.appendChild(script); 
    } 

    window.onload = loadScript; 
    </script> 
    <div id="map_canvas"> 
    </div> 
    ]]></html> TEST TEXT 
</zk> 

:私はジャバスクリプトの助けを借りて、それを統合しようとしました。しかし、実際に私は別のページのタブの要素に統合したいと思います:私は、このページを開いて、Tab1ををしようとすると

<?page id="main-page"?> 
    <zk> 
    <window id="wnd" title="Tabs of Content" width="100%" height="100%" border="normal"> 
      <tabbox id="tbox" width="100%"> 
       <attribute name="onSelect">{ 
        Window w = Path.getComponent("//main-page/wnd"); 
        if (self.selectedIndex==1) { 
         Include inc = (Include)Path.getComponent("//main-page/wnd/project_tab"+self.selectedIndex); 
         inc.setSrc("gmaps.zul"); 
        } 
       }</attribute> 
       <tabs> 
        <tab id = "tab1label" label="Tab 0"/> 
        <tab id = "tab2label" label="Tab 1"/> 
       </tabs> 
       <tabpanels> 
        <tabpanel>Test</tabpanel> 
        <tabpanel><include id="project_tab1" src=""/></tabpanel> 
       </tabpanels> 
      </tabbox> 
     </window> 
    </zk> 

、何のGoogleマップはありません。 これはどのように修正できますか?

答えて

0

あなたはZKはそれがあなたがGoogleマップコードで静的なHTMLまたはJSPページを作成することができzkgmapsz downloads list

よろしく、

ベン

0

でダウンロードすることができ3.0.0.Beta、 をgmaps試すことができ、そのページをiframeに読み込むことができます。

CE版を使用する場合は最適です。

マップの操作に必要なすべての機能を備えた「iframeマップ」を使用してカスタムZK Googleマップコントロールを作成することもできますが、JavaScriptのコーディングが必要になります。

これは私がやったことです。

関連する問題