`
夏莹_合肥
  • 浏览: 179356 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

Chapter 2: OpenLayers.Map

阅读更多

Here I give a simple demo how to write map class.

  1. MapOptions
  2. Map

1.  MapOptions

     A JSON object in JavaScript, but in GWT you must write a class extend BaseJavaScriptObject for it. Because it is a simple JSON, so result in the createNew method as following. In this JSON, "resolutions" and "controls" are JavaScript Array, so I must convert Object[] to JavaScript Array then can setProperty.

 

package org.gwtopenmaps.openlayers.client;

import org.gwtopenmaps.openlayers.client.common.BaseJavaScriptObject;
import org.gwtopenmaps.openlayers.client.common.JavaScriptObjectHelper;
import org.gwtopenmaps.openlayers.client.control.Control;

import com.google.gwt.core.client.JavaScriptObject;

public class MapOptions extends BaseJavaScriptObject {

	protected MapOptions() {}
	
	public static MapOptions createNew() {
		return (MapOptions) JavaScriptObject.createObject();
	}
	
	public final void setProjection(String projection) {
		setProperty("projection", projection);
	}
	
	public final void setResolutions(Double... resolutions) {
		JavaScriptObject javaScriptArray = JavaScriptObjectHelper.toJavaScriptArray((Object[]) resolutions);
		setProperty("resolutions", javaScriptArray);
	}
	
	public final void setPanRatio(int panRatio) {
		setProperty("panRatio", panRatio);
	}
	
	public final void setPanDuration(int panDuration) {
		setProperty("panDuration", panDuration);
	}
	
	public final void setControls(Control... controls) {
		JavaScriptObject javaScriptArray = JavaScriptObjectHelper.toJavaScriptArray((Object[]) controls);
		setProperty("controls", javaScriptArray);
	}
}

 

2. Map

     Because this is a small demo, so just see the code following...

 

package org.gwtopenmaps.openlayers.client;

import org.gwtopenmaps.openlayers.client.common.BaseJavaScriptObject;
import org.gwtopenmaps.openlayers.client.control.Control;
import org.gwtopenmaps.openlayers.client.layer.Layer;

public class Map extends BaseJavaScriptObject {

	protected Map() {
	}
	
	public static native Map createNew(String divId, MapOptions mapOptions) /*-{
		return new $wnd.OpenLayers.Map(divId, mapOptions);
	}-*/;
	
	public final void addLayer(Layer layer) {
		invokeMethodReturnJavaScriptObject("addLayer", layer);
	}
	
	public final void setCenter(LonLat lonLat, int zoom) {
		invokeMethodReturnJavaScriptObject("setCenter", lonLat, zoom);
	}
	
	public final Control getControl(String id) {
		return (Control) invokeMethodReturnJavaScriptObject("getControl", id);
	}
	
	public final int getZoom() {
		return invokeMethodReturnInt("getZoom");
	}
}

 

to be continued...

分享到:
评论

相关推荐

    第3章:走进Openlayers.rar

    第3章:走进Openlayers.rar

    openlayers.js及入门事例

    openlayers.js库及入门事例; OpenLayers是一个开源的js框架,用于在您的浏览器中实现地图浏览的效果和基本的zoom,pan等功能。OpenLayers支持的地图来源包括了WMS,GoogleMap,KaMap,MSVirtualEarth等等,您也可以...

    openlayers : ol.js、ol.css 下载

    openlayer ol.js ol.css

    OpenLayers_2.10_Beginners_Guide_Code

    通过`OpenLayers.Map`类,你可以创建一个地图容器,并加载来自不同服务的地图层。例如,使用`addLayer`方法添加新的图层。 2. 图层管理:OpenLayers允许你添加、删除和控制图层的可见性。这包括对图层透明度的调整...

    Packt.OpenLayers.3.x.Cookbook.2nd.Edition.2016.3.pdf

    Packt.OpenLayers.3.x.Cookbook.2nd.Edition.2016.3.pdf

    openLayers_geoserver常见问题.

    var map = new OpenLayers.Map('map'); var layer = new OpenLayers.Layer.WMS('myLayer', 'http://example.com/wms', {layers: 'myLayer'}); map.addLayer(layer); map.zoomToExtent(new OpenLayers.Bounds(-180, -...

    OpenLayers技术研究参考文档

    在使用 OpenLayers 时,需要实例化一个地图类 OpenLayers.Map,加载 WMS 和 GML 文件,添加控件 OpenLayers.Control 等。 OpenLayers 的优点包括: * 灵活的数据格式支持 * 丰富的地图数据资源 * 无浏览器依赖性 *...

    OpenLayers.mobile.debug.js

    OpenLayers.mobile.debug.js

    OpenLayers.2.10.Beginners.Guide (英文版)

    OpenLayers是一个流行的JavaScript库,它允许开发者在网页上无缝集成地理信息系统(GIS)的功能,支持多种地图服务,如Google Maps、Bing Maps和OpenStreetMap等。 OpenLayers的核心功能包括地图的加载、图层管理、...

    openlayers : ol.css ol.js

    openlayer 需引入ol.css ,ol.js,就和Arcgis 引入 Arcgis JS API 一样的道理

    openlayers.github.io:OpenLayers网站基础架构

    OpenLayers网站构建实用程序使用main的更新来更新站点要求您已安装和 。 当前,构建网站还需要所有openlayers。 # only once: clonegit clone -b build ... 这将从openlayers存储库的main分支中更新站点文档和示例。...

    OpenLayers.debug.js

    OpenLayers.debug.js

    OpenLayers.2.10.Beginners.Guide

    OpenLayers.2.10.Beginners.Guide原书pdf和书中所有代码

    Packt.OpenLayers.2.10.Beginner's.Guide

    Packt.OpenLayers.2.10.Beginner's.Guide英文pdf電子檔

    openLayers的缩放级别

    map = new OpenLayers.Map( $('map') , options); ``` 在这个示例中,我们配置了缩放级别的各种参数,包括比例尺、解析度、最大最小比例尺、最大最小解析度、最大最小范围等。这些参数可以根据实际情况进行调整,以...

    openlayers-map

    2. **投影(Projections)**:OpenLayers支持多种地理坐标系统,如EPSG:4326(经纬度)和EPSG:900913(Google Maps坐标系)。可以使用 Proj4js 库进行坐标系之间的转换。 3. **控件(Controls)**:OpenLayers提供...

    openlayers 教程

    position: new OpenLayers.Pixel(2, 15) })); ``` 添加鼠标坐标拾取控件 使用以下代码添加鼠标坐标拾取控件: ```javascript map.addControl(new OpenLayers.Control.MousePosition()); ``` 其他控件 OpenLayers ...

    openlayers自定义规则切片TMS浏览实例

    2. 创建地图对象:`var map = new OpenLayers.Map('map_div')`,这里的'map_div'是地图容器的ID。 3. 加载TMS图层:`var tmsLayer = new OpenLayers.Layer.TMS("Your Layer Name", "TMS Service URL", {layername: '...

    ol-grid:OpenLayers 6的动态网格实现

    link rel =" stylesheet " href =" https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.3.1/css/ol.css " type =" text/css " > < style > . map { height : 400 px ; width ...

Global site tag (gtag.js) - Google Analytics