当我从列表视图中加载单页jQuery Mobile应用程序中的页面时,我得到一张空白的谷歌地图:
Listview页面:
<div data-role="page" id="addresses">
<div data-role="header" data-position="fixed"><h1>mobile</h1></div>
<div class="ui-content" role="main">
<ul data-role="listview">
<li><a href="" id="345" class="address">Paris</a></li>
<li><a href="" id="456" class="address">London</a></li>
</ul>
</div>
</div>
地址页
<div data-role="page" id="address">
<div data-role="header" data-position="fixed"><h1>mobile</h1></div>
<div class="ui-content" role="main">
<div id="map_canvas"></div>
</div>
</div>
加载地址页面的脚本:
$(document).on("pageshow", "#address", function ()
{
addressLoadMap();
});
function addressLoadMap()
{
var latitude = $("#latitude").val();
var longitude = $("#longitude").val();
var centerLatLng = new google.maps.LatLng(latitude, longitude);
var myOptions =
{
zoom: 16,
center: centerLatLng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
streetViewControl: false,
mapTypeControl: false
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker = new google.maps.Marker({
position: centerLatLng,
map: map
});
}
我在涟漪模拟器中工作得很好,但在iPhone中它是这样的:
答案 0 :(得分:0)
我发现问题,使用iPhone上的应用程序访问控制台日志消息,我发现在iPhone中,来自MVC WebApi的经度和经度被转换为错误的双重格式以构建图:
我不得不改变WebApi返回的模型:
public class MobileGetAddressDto
{
public int Id { get; set; }
public string Name { get; set; }
public double Latitude { get; set; }
public double Longitude { get; set; }
}
为:
public class MobileGetAddressDto
{
public int Id { get; set; }
public string Name { get; set; }
public string Latitude { get; set; }
public string Longitude { get; set; }
}
问题解决了。