如何将Google地图添加到dojox手机视图？ [英] How do I add a google map to a dojox mobile view?

问题描述

我在标记中有以下元素：

 < div id =场地dojotype =dojox.mobile.Viewstyle =height：100％> 
< div id =map_canvasstyle =width：100％; height：100％>< / div> 
< / div> 
  

此脚本：

  function initializeMap（）{
 var latlng = new google.maps.LatLng（-34.397,150.644）; 
 var myOptions = {
 zoom：8，
 center：latlng，
 mapTypeId：google.maps.MapTypeId.ROADMAP 
}; 
 var node = dojo.byId（map_canvas）; 
 var map = new google.maps.Map（node，myOptions）; 
} 
  

当我执行initializeMap函数时，不会出现任何内容。我还尝试将map变量设置为node.innerHTML，但只有一条地图出现在视口顶部。

仅在dojo站点中的示例显示标记的来源，而不是脚本。

解决方案

这是HTML / Javascript的片段，我能够工作。

详细信息

  var latlng = new google.maps.LatLng（item.Latitude，item.Longitude）; 
 if（global.map == null）{
 var myOptions = {
 zoom：16，
 center：latlng，
 mapTypeId：google.maps.MapTypeId。 ROADMAP 
}; 
 global.map = new google.maps.Map（dojo.byId（'map_canvas'），myOptions）; 
} else {
 global.map.setCenter（latlng）; 
} 
 var view = dijit.byId（'ObjectsListView'）; 
 view.performTransition（'ObjectDetailView'，1，'slide'）; 
  

I am unable to successfully add a google map to my dojo mobile application.

I have the following element in markup:

<div id="venue" dojotype="dojox.mobile.View" style="height:100%">
        <div id="map_canvas" style="width:100%; height:100%"></div>
</div>

And this script:

function initializeMap() {
   var latlng = new google.maps.LatLng(-34.397, 150.644);
   var myOptions = {
   zoom: 8,
   center: latlng,
   mapTypeId: google.maps.MapTypeId.ROADMAP
   };
   var node = dojo.byId("map_canvas");
   var map = new google.maps.Map(node, myOptions);
}

Nothing appears when I execute the initializeMap function. I also tried to set the map variable to the node.innerHTML but only a sliver of the map appears on the top of the viewport.

The example in the dojo site only shows the source of the markup and not the script. What am I missing, please?

解决方案

Here's snippets of HTML/Javascript I was able to get working.

Details

var latlng = new google.maps.LatLng(item.Latitude, item.Longitude);
if (global.map == null) {
    var myOptions = {
          zoom: 16,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
  global.map = new google.maps.Map(dojo.byId('map_canvas'), myOptions);
} else {
  global.map.setCenter(latlng);
}
var view = dijit.byId('ObjectsListView');
view.performTransition('ObjectDetailView', 1, 'slide');

这篇关于如何将Google地图添加到dojox手机视图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！