GWT Google Maps:setCenter:不是LatLng或LatLngLiteral:属性lat:不是数字
GWT Google Maps: setCenter: not a LatLng or LatLngLiteral: in property lat: not a number
我使用GWT（版本2.61）和GWT地图（版本3.8.0）来通过GWT显示Google地图。
基本功能似乎可以工作，但现在我正在尝试运行gwt-maps-zip附带的CitySimple示例。这里它是用纯JavaScript编写的，但我正试图通过GWT来实现。
然而，当我运行示例时，在启动时会出现以下错误：
com.google.gwt.core.client.JavaScriptException: (InvalidValueError) @com.google.maps.gwt.client.Circle::create(Lcom/google/maps/gwt/client/CircleOptions;)([JavaScript object(17)]): setCenter: not a LatLng or LatLngLiteral: in property lat: not a number
at com.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript(BrowserChannelServer.java:249)
at com.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke(ModuleSpaceOOPHM.java:136)
at com.google.gwt.dev.shell.ModuleSpace.invokeNative(ModuleSpace.java:576)
at com.google.gwt.dev.shell.ModuleSpace.invokeNativeObject(ModuleSpace.java:284)
at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeObject(JavaScriptHost.java:91)
at com.google.maps.gwt.client.Circle$.create(Circle.java)
at com.test.client.GwtTest.renderMap(GwtTest.java:80)
地图显示出来了，但没有一个城市圈显示出来。它似乎认为我的LatLng类型中的lat值不是一个数字，这在GWT中是不可能的，因为Java将仅取一个双值。
以下是我正在运行的GWT代码：
package com.test.client;
import java.util.HashMap;
import com.google.gwt.ajaxloader.client.AjaxLoader;
import com.google.gwt.ajaxloader.client.AjaxLoader.AjaxLoaderOptions;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.dom.client.Document;
import com.google.maps.gwt.client.Circle;
import com.google.maps.gwt.client.CircleOptions;
import com.google.maps.gwt.client.GoogleMap;
import com.google.maps.gwt.client.LatLng;
import com.google.maps.gwt.client.MapOptions;
import com.google.maps.gwt.client.MapTypeId;
public class GwtTest implements EntryPoint {
static class City {
LatLng center;
Long population;
City(LatLng center, Long population) {
this.center = center;
this.population = population;
}
}
private static java.util.Map<String, City> citymap = new HashMap<String, City>();
static {
citymap.put("Chicago", new City(LatLng.create(41.878113, -87.629798), 2842518L));
citymap.put("New York", new City(LatLng.create(40.714352, -74.005973), 8143197L));
citymap.put("Los Angeles", new City(LatLng.create(34.052234, -118.243684), 3844829L));
}
@Override
public void onModuleLoad() {
AjaxLoaderOptions options = AjaxLoaderOptions.newInstance();
options.setOtherParms("sensor=false");
Runnable callback = new Runnable() {
public void run() {
renderMap();
}
};
AjaxLoader.loadApi("maps", "3", callback, options);
}
public static void renderMap() {
MapOptions mapOpts = MapOptions.create();
mapOpts.setZoom(4);
mapOpts.setCenter(LatLng.create(37.09024, -95.712891));
mapOpts.setMapTypeId(MapTypeId.TERRAIN);
GoogleMap map = GoogleMap.create(Document.get().getElementById("map_canvas"), mapOpts);
for (String cityName : citymap.keySet()) {
System.out.println("City: " + cityName);
City city = citymap.get(cityName);
// Construct the circle for each value in citymap. Scale population by 20.
CircleOptions populationOptions = CircleOptions.create();
populationOptions.setStrokeColor("#ff0000");
populationOptions.setStrokeOpacity(0.8);
populationOptions.setStrokeWeight(2);
populationOptions.setFillColor("#ff0000");
populationOptions.setFillOpacity(0.35);
populationOptions.setMap(map);
System.out.println("Lat: " + city.center.lat());
System.out.println("Lng: " + city.center.lng());
populationOptions.setCenter(city.center);
populationOptions.setRadius(city.population / 20);
Circle.create(populationOptions);
}
}
}
正如你所看到的，所有LatLng值的lat和lng都有数字，所以这个错误对我来说没有任何意义。
为了完整起见，这里是我的html文件：
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="GwtTest.css">
<title>GWT Test</title>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" language="javascript"
src="gwttest/gwttest.nocache.js"></script>
</head>
<body>
<p>Testing</p>
<div style="width:500px; height:500px">
<div id="map_canvas" style="width: 100%; height: 100%;">Map is loading...</div>
</div>
</body>
</html>
这是我的GWT模块xml文件：
<?xml version="1.0" encoding="UTF-8"?>
<!--
When updating your version of GWT, you should also update this DTD reference,
so that your app can take advantage of the latest GWT module capabilities.
-->
<!DOCTYPE module PUBLIC "-//Google Inc.//DTD Google Web Toolkit 2.6.1//EN"
"file:///C:/Users/kworkman/Desktop/gwt-2.6.1/gwt-module.dtd">
<module rename-to='gwttest'>
<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User'/>
<inherits name="com.google.maps.gwt.GoogleMaps" />
<inherits name="com.google.gwt.ajaxloader.AjaxLoader" />
<!-- Inherit the default GWT style sheet. You can change -->
<!-- the theme of your GWT application by uncommenting -->
<!-- any one of the following lines. -->
<inherits name='com.google.gwt.user.theme.clean.Clean'/>
<!-- <inherits name='com.google.gwt.user.theme.standard.Standard'/> -->
<!-- <inherits name='com.google.gwt.user.theme.chrome.Chrome'/> -->
<!-- <inherits name='com.google.gwt.user.theme.dark.Dark'/> -->
<!-- Other module inherits -->
<!-- Specify the app entry point class. -->
<entry-point class='com.test.client.GwtTest'/>
<!-- Specify the paths for translatable code -->
<source path='client'/>
<source path='shared'/>
<!-- allow Super Dev Mode -->
<add-linker name="xsiframe"/>
</module>
有人能看出我做错了什么吗？我还是GWT的新手，所以如果我做了一些愚蠢的事情，我不会感到震惊，但这个错误似乎与代码直接矛盾，所以我有点不知所措。
我已经在谷歌上搜索了这个错误，但我看到的每一个问题都是由人们将字符串而不是数字传递给LatLng类型引起的，我没有这样做。
我认为使用LatLng类型的代码是在加载api之前执行的。一旦api完全加载，尝试初始化你的城市地图对象：
Runnable callback = new Runnable() {
public void run() {
citymap.put("Chicago", new City(LatLng.create(41.878113, -87.629798), 2842518L));
citymap.put("New York", new City(LatLng.create(40.714352, -74.005973), 8143197L));
citymap.put("Los Angeles", new City(LatLng.create(34.052234, -118.243684), 3844829L));
renderMap();
}
};
这是因为LatLng对象的类型是JavaScriptObject，并且将使用api中的javascript函数。
另请参阅我对您两次加载api的评论。
相关文章：
- RegEx删除空属性?例如，如果(class=“”||class=“”）移除;否则就下课
- 全局变量和全局对象的属性之间有什么区别吗
- 如果使用 lodash 将属性存在于另一个对象中，则向对象添加属性
- 如何在Bootstrap Modal中为动态点击生成的变量设置jade属性
- 序列化数据属性中对象的最可靠方法
- 分析高度属性时出现意外值｛｛specs.height｝｝.index.html
- TypeError:无法读取属性'推'未定义的JavaScript
- 同样，同样的错误'ahorcado.js:26未捕获类型错误:无法读取属性'beginPath'
- AngularJS-使用'true'属性
- 可以't使用JavaScript获取width属性
- 未捕获的TypeError无法读取未定义的属性socialsharing
- 如何使用javascript获取嵌套对象中所有子对象的单个属性
- JavaScript Pub/Sub属性访问问题
- 从JavaScript访问struts操作中的属性
- 是否可以从父类访问子类的属性
- 如何修复未捕获的InvalidValueError:属性lat中的setPosition不是LatLng或LatLngL
- 未捕获的类型错误: 无法读取未定义的属性“lat”
- 谷歌地图 API 中的多个标记 无法读取未定义的属性“lat”
- 未捕获的类型错误:无法读取空异常的属性“lat”
- GWT Google Maps:setCenter:不是LatLng或LatLngLiteral:属性lat:不是数字
