地图API是由JavaScript语言编写的，您在使用之前需要通过<script>标签将API引用到页面中：
<link rel="Stylesheet" type="text/css"
href="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js" />
此API为地图展示版本，主要完成地图的展示和操作功能，如地图定位、放大和缩小等！
浏览器：IE 6.0+、Firefox 3.6+、Opera 9.0+、Safari 3.0+、Chrome
操作系统：Windows、Mac、Linux
hello world
该示例创建一个地图区域
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var map = new OpenLayers.Map("map_container");
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
map.addLayer(layer);
1.声明一个访问服务的令牌(token)，
详细信息参见常见问题
。
// 把token字符串替换为你申请的token字符串。
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
2.声明一个切片服务地址
查看所有服务
var url = "http://www.scgis.net.cn/imap/iMapServer/DefaultRest/services/SCTileMap/";
3.创建一个地图对象，设置其容器为map_container
var map = new OpenLayers.Map("map_container");
4.创建一个切片图层对象，把切片的服务地址和显示范围给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
5.向地图容器中添加切片图层对象
map.addLayer(layer);
<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<style type="text/css">
html{height:auto;}
body{height:auto;margin:0; padding:0;}
#map_container{ width:800px;height:500px;}
</style>
<title>iMap 地图JavaScript API 2.4+ 示例:Hello World</title>
<script type="text/javascript" src="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js"></script>
<script type="text/javascript">
function init() {
// 把token字符串替换为你申请的token字符串。
var token = "t0eYFNOSM-gP6rG3RfE6Kf52qNPg1UEySyzyK8ajM_q4ZoqQrGaO_0pkd36FsRzX";
// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
// 创建一个地图对象，设置其容器为map_container
var map = new OpenLayers.Map("map_container");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
</script>
</head>
<body onload="init()">
<div id="map_container"></div>
</body>
</html>
OpenLayers.Layer.SCGISTileMapEx(layername:String,url:String,{options?:Object})
创建一个切片图层的实例
url:切片服务的URL地址
options:可选参数列表
toke:令牌
layername:图层名称
isBaseLayer:是否为基础图层
zoomToExtent：缩放范围
transitionEffect:缩放渐变
errorCallback:加载失败回调函数
visibility:可见性
isZoomToInitialExtent:是否缩放到原始范围
maxExtent:显示最大范围
returnTipTile: 是否让服务器返回带提示信息的空图片
displayOutsideMaxExtent:超出最大范围是否显示
yx:坐标系设置
OpenLayers.Layer.SCGISThemeMap(layername:String,url:String,{options?:Object})
创建一个地名搜索结果图层的实例
layername:图层名称
url:地名搜索的URL地址
options:可选参数列表
toke:令牌
isBaseLayer:是否基础图层
maxResolution：显示最大分辨率
transitionEffect:缩放渐变
errorCallback:加载失败回调函数
visibility:可见性
format:返回图片格式
identify(x:Float,y:Float,tolerancePixel:Intenger,callbackFunction:function(json))
通过点查询当前图层要素信息
x:x坐标
y:y坐标
tolerancePixel:容限像素个数
callbackFunction:查询完毕回调函数
getResolution()
Resolution:float
获取图层分辨率
OpenLayers.Popup. SCGISFramed(id:String,lonlat:LonLat,contentSize:Size,contentHTML:String, anchor:String,closeBox:Object,closeBoxCallback:function())
创建一个自定义信息框的实例
id:信息框id
lonlat:经纬度
contentSize:尺寸
contentHTML:信息框html内容
closeBoxCallback:关闭按钮回调函数/p>
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var map = new OpenLayers.Map("map_container");
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
map.addLayer(layer);
1.声明一个访问服务的令牌(token)，详细信息参见
常见问题
。
// 把token字符串替换为你申请的token字符串。
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
2.声明一个切片服务地址
查看所有服务
var url = "http://www.scgis.net.cn/imap/iMapServer/DefaultRest/services/SCTileMap/";
3.创建一个地图对象，设置其容器为map_container
var map = new OpenLayers.Map("map_container");
4.创建一个切片图层对象，把切片的服务地址和显示范围给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
5.向地图容器中添加切片图层对象
map.addLayer(layer);
<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<style type="text/css">
html{height:auto;}
body{height:auto;margin:0; padding:0;}
#map_container{ width:800px;height:500px;}
</style>
<title>iMap 地图JavaScript API 2.4+ 示例:Hello World</title>
<script type="text/javascript" src="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js"></script>
<script type="text/javascript">
function init() {
// 把token字符串替换为你申请的token字符串。
var token = "t0eYFNOSM-gP6rG3RfE6Kf52qNPg1UEySyzyK8ajM_q4ZoqQrGaO_0pkd36FsRzX";
// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
// 创建一个地图对象，设置其容器为map_container
var map = new OpenLayers.Map("map_container");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
</script>
</head>
<body onload="init()">
<div id="map_container"></div>
</body>
</html>
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var map = new OpenLayers.Map("map_container");
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
map.addLayer(layer);
声明一个访问服务的令牌(token)，详细信息参见
常见问题
。
// 把token字符串替换为你申请的token字符串。
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";
创建一个地图对象实例，设置地图容器为mapShow面板，初始并加载瓦片图层。
//查询地址
var nameSearchUrl="http://www.scgis.net.cn:5506/iMap/iMapServer/DefaultRest/services/newtianditunamesearch/";
//定义地名搜索结果图层
//定义查询参数
var _content = {
keyname: "医院", //要查询关键字
startIndex: "0", //返回的数据的开始的索引值
stopIndex: "12", //返回的数据的结束的索引值
DiQuKey: "5101", //市级的行政区代码(5101为成都市)
QuXianKey: "510107", //县级的行政区划代码（510107为武侯区）
typeCode: "yl", //要查询的类型（yl为医院）
url: nameSearchUrl, //查询服务的地址
token: token, //向服务器发出查询请求的令牌
//回调函数
callback: namesearchCallback
//声明查询脚本，创建查询请求
var jsonp = new OpenLayers.Protocol.Script();
jsonp.createRequest(nameSearchUrl+"Search?",_content,namesearchCallback);
function namesearchCallback(json, context) {
var data = json.message.features;
//地图显示点的样式声明
//地名点
var geometrypt;
//地名要素
var namefeat;
//遍历返回的12个数据，在地图上进行显示
for (i = 0; i < data.length; i++) {
var stylenamesearch = {
externalGraphic: "img/marker.png",
graphicWidth: 20,
graphicHeight: 20,
graphicTitle: data[i].attributes[3]
var infoStr = data[i].attributes[3];
//要素点坐标
geometrypt = new OpenLayers.Geometry.Point(data[i].attributes[1], data[i].attributes[2]);
namefeat = new OpenLayers.Feature.Vector(geometrypt, data[i].attributes, stylenamesearch);
//加载要素
nameSearchVector.addFeatures(namefeat);
创建地名搜索对象实例，使用对象实例的execute方法，构建查询参数，并在回调函数中将返回的数据录入气泡框，并将信息点的位置在地图上进行显示。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<title>天地图四川帮助页面</title>
<script src="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js"></script>
<script type="text/javascript">
var nameSearchVector = new OpenLayers.Layer.Vector();
function init() {
// 把token字符串替换为你申请的token字符串。
var token = "t0eYFNOSM-gP6rG3RfE6Kf52qNPg1UEySyzyK8ajM_q4ZoqQrGaO_0pkd36FsRzX";
// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
// 创建一个地图对象，设置其容器为map_container
var map = new OpenLayers.Map("mapShow");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(nameSearchVector);
//查询地址
var nameSearchUrl="http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditunamesearch/";
//定义地名搜索结果图层
//定义查询参数
var _content = {
keyname: "医院", //要查询关键字
startIndex: "0", //返回的数据的开始的索引值
stopIndex: "12", //返回的数据的结束的索引值
DiQuKey: "5101", //市级的行政区代码(5101为成都市)
QuXianKey: "510107", //县级的行政区划代码（510107为武侯区）
typeCode: "yl", //要查询的类型（yl为医院）
url: nameSearchUrl, //查询服务的地址
token: token, //向服务器发出查询请求的令牌
//回调函数
callback: namesearchCallback
//声明查询脚本，创建查询请求
var jsonp = new OpenLayers.Protocol.Script();
jsonp.createRequest(nameSearchUrl+"Search?",_content,namesearchCallback);
function namesearchCallback(json, context) {
var data = json.message.features;
//地图显示点的样式声明
//地名点
var geometrypt;
//地名要素
var namefeat;
//遍历返回的12个数据，在地图上进行显示
for (i = 0; i < data.length; i++) {
var stylenamesearch = {
externalGraphic: "img/marker.png",
graphicWidth: 20,
graphicHeight: 20,
graphicTitle: data[i].attributes[3]
var infoStr = data[i].attributes[3];
//要素点坐标
geometrypt = new OpenLayers.Geometry.Point(data[i].attributes[1], data[i].attributes[2]);
namefeat = new OpenLayers.Feature.Vector(geometrypt, data[i].attributes, stylenamesearch);
//加载要素
nameSearchVector.addFeatures(namefeat);
</script>
</head>
<body onload="init()">
<div id="mapShow" class="soria" style="width:800px;height:400px;"></div>
</body>
</html>
var map = new OpenLayers.Map("mapShow");
// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
extent=[104.0624 - 0.1, 30.6615 - 0.1, 104.0624 + 0.1, 30.6615 + 0.1]; //成都
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(shortpathLayer);
声明一个访问服务的令牌(token)，详细信息参见
常见问题
。
// 把token字符串替换为你申请的token字符串。
var token = "-pxvYt1zsn3NWaFKnNvWvz8XULYQ3EkCCUawdi0vv3FyHI49bieLddJgEHz6bcaR";
创建一个地图对象实例，设置地图容器为mapShow面板，初始并加载瓦片图层。
//起点和终点坐标
var startX=104.0703;
var startY=30.7128;
var stopX=104.1318;
var stopY=30.6838;
//创建图层显示范围
var extent=[104.0624 - 0.1, 30.6615 - 0.1, 104.0624 + 0.1, 30.6615 + 0.1]; //成都
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(shortpathLayer);
//路径分析参数
var _content = {
startX: startX, startY: startY, //起点XY
stopX: stopX, stopY: stopY, //终点XY
powerColumnName: "length", //路径分析选项（length为路径最短、power时间最短）
returnDirection: false, //是否输出方向文本描述信息。
VIAPoints: "", //途经点json
BarriesLocation: "", //障碍点json
token: token, //令牌
ST: parseInt(Math.random() * 100000) //随机数，以免提交请求的时候路径相同就用客户端缓存。
var jsonp = new OpenLayers.Protocol.Script();
jsonp.createRequest(shortPathUrl + "/shortPath", _content, function (json, context) { //回调函数
if(json.success)
var temp = json.message;
var imapjson_format = new OpenLayers.Format.SCGISJSON();
//以返回值构建的一条路径(几何对象，就是一条线)
var geom = imapjson_format.read(temp.route, "Polyline");
//定义线段样式
var style_path={
strokeColor: "#0000FF",
strokeWidth: 4,
strokeOpacity: 0.5,
strokeDashstyle: "solid"
//地图图形层加入路径对象得到显示
var graphic_path = new OpenLayers.Feature.Vector(geom, null, style_path); //地图图形对象
shortpathLayer.addFeatures(graphic_path);
alert(json.message.error);
创建路径分析对象实例，使用对象实例的execute方法，构建分析参数，并在回调函数中将返回的数据录入气泡框，并将信息点的位置在地图上进行显示。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<title>天地图四川帮助页面</title>
<script src="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js"></script>
<script type="text/javascript">
var shortpathLayer = new OpenLayers.Layer.Vector();
function init() {
//定义地图
var map = new OpenLayers.Map("mapShow");
// 把token字符串替换为你申请的token字符串。
var token = "t0eYFNOSM-gP6rG3RfE6Kf52qNPg1UEySyzyK8ajM_q4ZoqQrGaO_0pkd36FsRzX";
// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var shortPathUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/scShortpath/"; //路径分析服务地址
//起点和终点坐标
var startX=104.0703;
var startY=30.7128;
var stopX=104.1318;
var stopY=30.6838;
//地图初始函数
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
extent=[104.0624 - 0.1, 30.6615 - 0.1, 104.0624 + 0.1, 30.6615 + 0.1]; //成都
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(shortpathLayer);
//路径分析参数
var _content = {
startX: startX, startY: startY, //起点XY
stopX: stopX, stopY: stopY, //终点XY
powerColumnName: "length", //路径分析选项（length为路径最短、power时间最短）
returnDirection: false, //是否输出方向文本描述信息。
VIAPoints: "", //途经点json
BarriesLocation: "", //障碍点json
token: token, //令牌
ST: parseInt(Math.random() * 100000) //随机数，以免提交请求的时候路径相同就用客户端缓存。
var jsonp = new OpenLayers.Protocol.Script();
jsonp.createRequest(shortPathUrl + "/shortPath", _content, function (json, context) { //回调函数
if(json.success)
var temp = json.message;
var imapjson_format = new OpenLayers.Format.SCGISJSON();
//以返回值构建的一条路径(几何对象，就是一条线)
var geom = imapjson_format.read(temp.route, "Polyline");
//定义线段样式
var style_path={
strokeColor: "#0000FF",
strokeWidth: 4,
strokeOpacity: 0.5,
strokeDashstyle: "solid"
//地图图形层加入路径对象得到显示
var graphic_path = new OpenLayers.Feature.Vector(geom, null, style_path); //地图图形对象
shortpathLayer.addFeatures(graphic_path);
alert(json.message.error);
</script>
</head>
<body onload="init()">
<div id="mapShow" class="soria" style="width:800px;height:400px;"></div>
</body>
</html>
var map;
var tilemapurl = "http://www.scgis.net.cn/imap/iMapServer/DefaultRest/services/SCTileMap/mapserver";
var datasearchurl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/SClocation/";
// 把token字符串替换为你申请的token字符串。
var token = "KcZLcw1phSk7n9XICcZcBnhDwtHx35zeE1BsOI-a9tF5VW6HZfYGTx_UfWYa-N3z";// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var datasearchLayer = new OpenLayers.Layer.Vector();
//地图初始函数
function init() {
// 创建一个地图对象，设置其容器为map_container
map = new OpenLayers.Map("im_mapShow");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(datasearchLayer);
search();
function search() {
//创建一个面对象
var polygonJson = { "rings": [[[103.045, 31.362], [103.023, 29.998], [104.535, 30.388], [104.365, 31.169],[103.045, 31.362]]]};
//构建一个查询条件对象,
var content={
token: token, //Token字符串
layerID: 0, //请求图层
geometry: polygonJson, //空间对象
spatialRel: "spatialRelIntersects", //空间关系
whereClause: "OBJECTID<50" //条件语句
$.ajax({
type: "get",
async: false,
data:content,
url: datasearchurl+"searchData?", //请求地址
dataType: "jsonp",
jsonp: "callback",
success: callback,
error: function(ex) {
alert("查询错误:" + ex.description);
声明一个访问服务的令牌(token)，详细信息参见
常见问题
。
// 把token字符串替换为你申请的token字符串。
var token = "-pxvYt1zsn3NWaFKnNvWv5-mzjHQHxI-Wx8RtNhi_we1AmbRU2aD5_hwqJ-PWIra";
创建一个地图对象实例，设置地图容器为mapShow面板，初始并加载瓦片图层。
// 创建一个地图对象，设置其容器为map_container
map = new OpenLayers.Map("im_mapShow");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(datasearchLayer);
够建要素查询条件，创建查询对象执行查询。
//创建一个面对象
var polygonJson = { "rings": [[[103.045, 31.362], [103.023, 29.998], [104.535, 30.388],
[104.365, 31.169],[103.045, 31.362]]], "spatialReference": { " wkid": 4326 }
//构建一个查询条件对象,
var content={
token: token, //Token字符串
layerID: 0, //请求图层
geometry: polygonJson, //空间对象
spatialRel: "spatialRelIntersects", //空间关系
whereClause: "OBJECTID<50" //条件语句
$.ajax({
type: "get",
async: false,
data:content,
url: datasearchurl+"searchData?", //请求地址
dataType: "jsonp",
jsonp: "callback",
success: callback, //回调函数
error: function(ex) {
alert("查询错误:" + ex.description);
将查询结果显示在地图上，并将其属性信息加入该图形的标题中。
//遍历每个要素
for (var i = 0; i < feas.length; i++) {
var fea = feas[i];
//收集要素的字段名称及字段值
var infoStr = "";
for (var j = 0; j < cols.length; j++) {
infoStr += cols[j].caption + "： " + fea.attributes[j] + "
";
//对查询结果要素进行添加
//对象添加至图层
if (fea.geometryType == "Point") {
//地图显示点要素的样式
var style_Point={
externalGraphic: "img/marker.png",
graphicWidth: 20,
graphicHeight: 20,
graphicTitle: infoStr,
graphicYOffset: -20
feature=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(fea.geometry.x, fea.geometry.y));
feature.style=style_Point;
datasearchLayer.addFeatures(feature);
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<title>天地图四川帮助页面</title>
<script src="http://www.scgis.net/SCGCMap/OpenLayers-scgisExtension-2.12.03.js"></script>
<script type="text/javascript">
var map;
var tilemapurl = "http://www.scgis.net.cn/imap/iMapServer/DefaultRest/services/SCTileMap/";
var datasearchurl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/SClocation/";
// 把token字符串替换为你申请的token字符串。
var token = "t0eYFNOSM-gP6rG3RfE6Kf52qNPg1UEySyzyK8ajM_q4ZoqQrGaO_0pkd36FsRzX";// 切片服务地址
var tilemapUrl = "http://www.scgis.net.cn/iMap/iMapServer/DefaultRest/services/newtianditudlg/";
var datasearchLayer = new OpenLayers.Layer.Vector();
//地图初始函数
function init() {
// 创建一个地图对象，设置其容器为map_container
map = new OpenLayers.Map("mapShow");
//创建图层显示范围
var extent=[95.50484501954,28.198615625002, 110.65328251954, 32.284064843752];
// 创建一个切片图层对象，把切片的服务地址给它
var layer = new OpenLayers.Layer.SCGISTileMapEx("dlgMapLayer", tilemapUrl,{token:token,zoomToExtent:extent});
// 向地图容器中添加一个切片图层对象
map.addLayer(layer);
map.addLayer(datasearchLayer);
search();
function search() {
//创建一个面对象
var polygonJson = { "rings": [[[103.045, 31.362], [103.023, 29.998], [104.535, 30.388], [104.365, 31.169],[103.045, 31.362]]]};
//构建一个查询条件对象,
var content={
token: token, //Token字符串
layerID: 0, //请求图层
geometry: polygonJson, //空间对象
spatialRel: "spatialRelIntersects", //空间关系
whereClause: "OBJECTID<50" //条件语句
$.ajax({
type: "get",
async: false,
data:content,
url: datasearchurl+"searchData?", //请求地址
dataType: "jsonp",
jsonp: "callback",
success: callback,
error: function(ex) {
alert("查询错误:" + ex.description);
function callback(json, context) {
if (json.success) {
addToMap(json.message);
} else {
alert("查询错误:" + json.description);
function addToMap(returnData) {
var cols = returnData.columns;
var feas = returnData.features;
//遍历每个要素
for (var i = 0; i < feas.length; i++) {
var fea = feas[i];
var feature;
//收集要素的字段名称及字段值
var infoStr = "";
for (var j = 0; j < cols.length; j++) {
infoStr += cols[j].caption + "：" + fea.attributes[j] + ", ";
//对象添加至图层
if (fea.geometryType == "Point") {
//地图显示点要素的样式
var style_Point={
externalGraphic: "img/marker.png",
graphicWidth: 20,
graphicHeight: 20,
graphicTitle: infoStr,
graphicYOffset: -20
feature=new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(fea.geometry.x, fea.geometry.y));
feature.style=style_Point;
datasearchLayer.addFeatures(feature);
</script>
</head>
<body onload="init()">
<div id="mapShow" class="soria" style="width:800px;height:400px;"></div>
</body>
</html>
