本文介绍了一款基于天地图的高校招生服务系统，采用B/S模式，利用VS2008和SQL Server 2005开发。系统通过自定义WebService与数据库交互，提供可视化的招生信息查询。界面设计包括查询栏、导航栏和地图显示，调用天地图服务实现地图功能，同时提供数据更新和系统维护。
“天地图”是国家测绘地理信息局建设的地理信息综合服务网站。它是“数字中国”的重要组成部分，是国家地理信息公共服务平台的公众版。“天地图”的目的在于促进地理信息资源共享和高效利用，提高测绘地理信息公共服务能力和水平，改进测绘地理信息成果的服务方式，更好地满足国家信息化建设的需要，为社会公众的工作和生活提供方便。
本文基于天地图提供的位置服务，采用B/S（浏览器/服务器）的系统设计开发模式，以用户的实际需求为出发点，以甘肃各高校的历年各专业招生数据为支撑，开发出了基于位置服务的高校招生服务系统，旨在为广大用户提供直接、可视化的招生服务信息。
在Visual Studio 2008开发环境里新建网站，新建ASP.NET动态网页，采用HTML语言，内嵌JavaScript语言及其组件Ext-3.0.0进行界面设计。该系统界面设计主要包括三大部分：快速查询栏、导航栏和地图显示区域。系统主界面如下所示：
1、自定义WebService
浏览器端编程主要由JavaScript语言来完成，但JavaScript不能通过直接访问数据库来获取数据，必须借助WebService来完成。WebService是一种构建应用程序的应用实体，同时也是一个可互操作的分布式应用程序平台，并能在所有支持HTTP协议操作系统上实施运行[1]。本系统采用C#语言编写中间层WebService，通过设计JSON（JavaScript Object Notation）格式的数据传出形式来调用系统数据库NMET中的数据，返回xmlns格式的字符串至浏览器端，实现数据库的调用。
using System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Data;
using System.Data.SqlClient;
/// <summary>
///WebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{
public WebService()
{
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public string HelloWorld()
{
return "Hello World";
}
[WebMethod]
public string GetSchool()
{
try
{
string SQL = "SELECT * FROM SCHOOL order by PID";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{sname:\'" + RD["sname"].ToString().Trim() + "\',url:\'" + RD["URL"].ToString().Trim() + "\',lnglat:[" + RD["LNG"].ToString().Trim() + "," + RD["LAT"].ToString().Trim() + "],info:\'" + RD["SAdd"].ToString().Trim() + "\'},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
catch (Exception e)
{
return e.ToString();
}
}
[WebMethod]
public string GetCollege(string RSchool)
{
string SQL = "SELECT * FROM college where PID in(select Pid from school where sname='" + RSchool + "') order by MID ";
//string SQL = "SELECT * FROM getCollegetable('" + RSchool + "')"; // getCollegetable为表值函数
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{cname:\'" + RD["cname"].ToString().Trim() + "\',url:\'" + RD["URL"].ToString().Trim() + "\',lnglat:[" + RD["LNG"].ToString().Trim() + "," + RD["LAT"].ToString().Trim() + "]},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
[WebMethod]
public string GetMajor(string RCollege)
{
string SQL = "SELECT * FROM major where MID in(select Mid from college where cname='" + RCollege + "') ";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{MName:\'" + RD["MName"].ToString().Trim() + "\'," + "MNum:\'" + RD["MNum"].ToString().Trim() + "\'," + "MScore:\'" + RD["MScore"].ToString().Trim() + "\'" + "},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
[WebMethod]
public string GetLocate(string SNAME)
{
string SQL = "SELECT LNG,LAT FROM SCHOOL WHERE SNAME='" + SNAME + "'";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{lnglat:[" + RD["LNG"].ToString().Trim() + "," + RD["LAT"].ToString().Trim() + "]},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
[WebMethod]
public string City()
{
string SQL = "select * from CITY";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st+"{name:\'"+RD["City_Name"].ToString().Trim()+"\',code:\'"+RD["ZipCode"].ToString().Trim() +"\',lnglat:[" + RD["LNG"].ToString().Trim() + "," + RD["LAT"].ToString().Trim() + "]},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
[WebMethod]
public string LCity(string name)
{
string SQL = "select * from CITY where City_Name='"+name+"' ";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{lnglat:[" + RD["LNG"].ToString().Trim() + "," + RD["LAT"].ToString().Trim() + "],NOTES:\'"+RD["Notes"].ToString().Trim()+"\'},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
[WebMethod]
public string City_school(string name)
{
string SQL = "select * from school where CityCode in (select CityId from City where City_Name='" + name + "' )";
string st;
MyDBase DB = new MyDBase(".", "NMET", "sa", "abc");
SqlDataReader RD = DB.DBDataReader(SQL);
st = "[";
while (RD.Read())
{
st = st + "{name:\'" + RD["SName"].ToString().Trim() +"\'},";
}
int n = st.Length - 1;
st = st.Substring(0, n);
st = st + "]";
DB.DBClose();
return st;
}
}2、系统数据库设计
采用SQL Server 2005数据库。数据库设计主要包括表设计、表之间关系设计和函数设计。
2.2.1 表设计
本数据库设计的表有4个：CITY表，用来存储甘肃省的14个地级市；SCHOOL表，用来存储甘肃省的16所本科高校；COLLEGE表，用来存储省内本科高校及各个高校的所有学院；Major表，用来存储省内本科高校的所有专业设置。
2.2.2 关系图设计
关系图确定了表与表及表表之间字段间的参照关系，本数据库的4个表之间的关系图。
2.2.3 数据入库
数据库设计完成以后，需要将各个高校的招生数据按学校、学院以及专业的层次进行分类入库。
3、界面设计
在Visual Studio 2008开发环境里新建网站，新建ASP.NET动态网页，采用HTML语言，内嵌JavaScript语言及其组件Ext-3.0.0进行界面设计。该系统界面设计主要包括三大部分：快速查询栏、导航栏和地图显示区域。
界面设计代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="mainPage.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="http://api.tianditu.com/js/maps.js"> </script>
<script type="text/javascript" src="ext-3.0.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-3.0.0/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="ext-3.0.0/resources/css/ext-all.css" />
<link rel ="Stylesheet" type="text/css" href="CSS/mainPage.css" />
<script type="text/javascript" src="JS/mainPage.js"></script>
<script type="text/javascript" src="JS/welcome.js"></script>
<script type="text/javascript" src="JS/clock.js"></script>
<script type ="text/javascript" >
</script>
</head>
<body onload="loadmap()">
<div id="container"
style="position:absolute;left:25%;right:0px;top:13%; bottom:0; cursor: pan;" >
</div>
<div id="navigation" style="border-style: groove; bottom: 432px;">
<ul id="list" style="width:154px">
<li><a href="#" id ="dixingtu" onclick="addTerrain()" title="地形图" >地形</a></li>
<li><a href="#" id="yingxiangtu" onclick="addImage()"title="影像图">影像</a></li>
<li><a href="#" id ="ditutu" style=" background-color:#4A93FF" onclick="del()"
title="地图" >地图</a></li>
</ul>
</div>
<div id="lnglat"
style="position:absolute; top: 97px; left: 630px; bottom:432px; width: 311px; z-index:1001;">
经度：<input id="Text1" type="text" style="width:70px; height: 18px; border-width:0; background-color:Transparent;"/>  纬度：<input
id="Text2" type="text" style="width:70px; height: 18px;border-width:0; background-color:Transparent;" />
</div>
<div id="warning"
style=" position:absolute; text-align:center; left:0;right:75%;top:8%;bottom:87%; background-color: #E6FE70;">
<font color="green" size="4"><b><p id="myclock" style="position:absolute; text-align:center; top: 5px; left: 4px; width: 329px; height: 19px;"></p></b></font>
<%--<marquee scrollamount="1" height="30" direction="up"><p><font color="red" size="5">欢迎莘莘学子报考西北师范大学<br><br>祝您心想事成</font></p></marquee>--%>
</div>
<div id="college_table" style="position:absolute; display:none; left:25%;right:0px;top:13%;bottom:0; padding:0px; border-style:groove; border-width:1; background-color: #66CCFF;">
<table id="ctable" border="1" style="list-style-type: lower-roman; font-size: large;">
<tr>
<td> <b><a href="http://www.nwnu.edu.cn" target="_blank" >西北师范大学</a></b></td>
<td> <a href="http://www.lzu.edu.cn" target="_blank" >兰州大学</a></td>
<td> <a href="http://www.lzjtu.cn" target="_blank" >兰州交通大学</a></td>
</tr>
<tr>
<td> <a href="http://www.gsut.edu.cn" target="_blank" >兰州理工大学</a></td>
<td> <a href="http://www.xbmu.edu.cn" target="_blank" >西北民族大学</a></td>
<td> <a href="http://www.gsau.edu.cn" target="_blank" >甘肃农业大学</a></td>
</tr>
<tr>
<td> <a href="http://www.lzcc.edu.cn" target="_blank" >兰州商学院</a></td>
<td> <a href="http://www.gsli.edu.cn" target="_blank" >甘肃政法学院</a></td>
<td> <a href="http://www.gszy.edu.cn" target="_blank" >甘肃中医学院</a></td>
</tr>
<tr>
<td> <a href="http://www.lzcc.edu.cn" target="_blank" >兰州商学院</a></td>
<td> <a href="http://www.hxu.edu.cn" target="_blank" >河西学院</a></td>
<td> <a href="http://www.ldxy.edu.cn" target="_blank" >陇东学院</a></td>
</tr>
<tr>
<td> <a href="http://www.lzcu.edu.cn/" target="_blank" >兰州城市学院</a></td>
<td> <a href="http://www.gnun.edu.cn" target="_blank" >甘肃民族师范学院</a></td>
<td> <a href="http://www.lzptc.edu.cn" target="_blank" >兰州工业学院</a></td>
</tr>
<tr>
<td> <a href="http://zxxy.nwnu.edu.cn" target="_blank" >西北师范大学知行学院</a></td>
<td> <a href="http://www.lzlqc.com" target="_blank" >兰州商学院陇桥学院</a></td>
<td> <a href="http://www.bowenedu.cn" target="_blank" >兰州交通大学博文学院</a></td>
</tr>
<tr>
<td> <a href="http://222.23.176.254" target="_blank" >兰州商学院长青学院</a></td>
<td> <a href="http://www.lzwyedu.com" target="_blank" >兰州外语职业学院</a></td>
<td> <a href="http://www.gsu.edu.cn" target="_blank" >甘肃联合大学</a></td>
</tr>
<tr>
<td> <a href="http://www.lutcte.cn/" target="_blank" >兰州理工大学技术工程学院</a></td>
<td> <a href="http://www.zymc.edu.cn" target="_blank" >张掖医学高等专科学校</a></td>
<td> <a href="http://www.plmc.edu.cn" target="_blank" >平凉医学高等专科学校</a></td>
</tr>
<tr>
<td> <a href="http://www.lntc.edu.cn" target="_blank" >陇南师范高等专科学校</a></td>
<td> <a href="http://www.dxatc.cn/" target="_blank" >定西师范高等专科学校</a></td>
<td> <a href="http://www.lzpcc.com.cn" target="_blank" >兰州石化职业技术学院</a></td>
</tr>
<tr>
<td> <a href="http://www.gscat.cn/" target="_blank" >甘肃农业职业技术学院</a></td>
<td> <a href="http://www.lzre.edu.cn" target="_blank" >兰州资源环境职业技术学院</a></td>
<td> <a href="http://www.lvu.edu.cn" target="_blank" >兰州职业技术学院</a></td>
</tr>
<tr>
<td> <a href="http://www.gsipc.gsedu.cn" target="_blank" >甘肃工业职业技术学院</a></td>
<td> <a href="http://www.gsfc.edu.cn" target="_blank" >甘肃林业职业技术学院</a></td>
<td> <a href="http://www.gcvtc.gsedu.cn/" target="_blank" >甘肃建筑职业技术学院</a></td>
</tr>
<tr>
<td> <a href="http://www.lzec.cn" target="_blank" >兰州教育学院</a></td>
<td> <a href="http://www.gsgtxy.com" target="_blank" >甘肃钢铁职业技术学院</a></td>
<td> <a href="http://www.gsjdxy.com" target="_blank" >甘肃机电职业技术学院</a></td>
</tr>
<tr>
<td> <a href="http://www.gsjtxy.edu.cn" target="_blank" >甘肃交通职业技术学院</a></td>
<td> <a href="http://www.jqzy.com" target="_blank" >酒泉职业技术学院</a></td>
<td> <a href="http://www.gsysyj.edu.cn" target="_blank" >甘肃有色冶金职业技术学院</a></td>
</tr>
<tr>
<td> <a href="http://www.bymu.cn" target="_blank" >白银矿冶职业技术学院</a></td>
<td> <a href="http://www.gs-police.com" target="_blank" >甘肃警察职业学院</a></td>
<td> <a href="http://www.wwoc.cn" target="_blank" >武威职业学院</a></td>
</tr>
</table>
</div>
<div id="head" style="background-position: center center; background-image: url('Images/title.jpg'); background-repeat: no-repeat; background-attachment: scroll;">
<ul style=" position:relative; top: 4px; right:-1213px; width:125px;">
<li style="float:right;margin:3px 3px 3px 3px; text-decoration: underline;"><a href="File/帮助文档.htm" target="_blank" style=" color:White" title="查看帮助">帮助</a></li>
<li style="float:right; margin:3px 3px 3px 3px; text-decoration: underline; color: #FFFFFF;"><a href="http://www.tianditu.cn/map/index.html" target="_blank" style=" color:White" title="进入天地图首页">关于天地图</a></li>
</ul>
</div>
<div id="table" style="background-color: #C5F3DF">
<div id="nwnu_introduce">
<p>西北师范大学概况：</p>
<p style="line-height: 23px; font-size: small; text-decoration: underline; text-align: justify;"> <a href="http://www.nwnu.edu.cn" target="_blank">西北师范大学</a>为甘肃省人民政府和教育部共同建设的重点大学、国家重点支持的西部地区十四所大学之一。前身为国立北平师范大学，发端于1902年建立的京师大学堂师范馆，1912年改为“国立北京高等师范学校”，1923年改为“国立北平师范大学”。1937年“七七”事变后，北平师范大学与同时西迁的国立北平大学、北洋工学院共同组成西北联合大学，北平师范大学整体改组为西北联大下设的教育学院，后改为师范学院。1939年西北联合大学师范学院独立设置，改称国立西北师范学院，1941年迁往兰州。抗日战争胜利后，恢复北平师范大学（现北京师范大学），部分师生继续留在西北师范学院。1958年前学校为教育部直属的全国6所重点高师院校之一，1958年划归甘肃省领导，改称甘肃师范大学。1981年复名为西北师范学院。1988年更名为西北师范大学。</p>
</div>
</div>
<div id="search"><br />  
<div id="menu1" style="background-image: url('Images/nwnu.jpg')"></div>
<div id="right" style="background-color: #3CB5B5; ">
<p><font size="3" color="white">学校名称：</font></p>
<select id="school" onchange="COLLEGE(school.value)" style="color: #0000FF; font-weight: bold; height: 20px; font-size: small;" ></select><br />
<p style="position:absolute; top: 53px; left: 0px; height: 17px; width: 153px;"><font size="3" color="white">学院设置：</font></p>
<select id="college" style="font-size: small; font-weight: bold;" ></select>
<input type="button" value="招生信息查询" title="点击查询" onclick="MAJOR(college.value)" onmouseover="this.style.backgroundColor='green'"
onmouseout="this.style.backgroundColor='#ffffff'"
style="position:absolute; top: 110px; left: 4px; width:153px; height: 30px; bottom: 10px; font-size: large; cursor: pointer;" />
<input type="button" value="学校地图定位" title="点击定位"
onclick="Locate(school.value)" onmouseover="this.style.backgroundColor='green'"
onmouseout="this.style.backgroundColor='#ffffff'"
style="position:absolute; top: 142px; left: 4px; width:153px; height: 30px; font-size: large; cursor: pointer;" />
</div>
</div>
<div id="tools"
style="background-repeat: no-repeat; background-position: left center; background-color: #C4FFBB; ">
<div id="city">
<ul style="width:184px">
<li><h6><font size="3" color="red">甘肃省 >></font></h6></li>
<li><h5><a href="#" onclick="getcities()"><font size="3" color="green">[选择城市]</font></a></h5></li>
</ul>
</div>
<div id="menu">
<ul id="menu_list">
<li><a href="#" style="background-color:#4A93FF;" id="wmap" onclick="displayDiv('1')">网站地图</a></li>
<li><a href="http://gaokao.gszs.cn/" target="_blank">成绩查询</a></li>
<li><a href="http://www.gszs.edu.cn/html/zsgg/" target="_blank" >招生公告</a></li>
<li><a href="http://gaokao.eol.cn/html/g/zhiyuan/" target="_blank">志愿指南</a></li>
<li><a href="http://www.gszs.edu.cn/html/ptgk/" target="_blank">省招办</a></li>
<li><a href="#" id="xuyuanqiang" onclick="displayDiv('0')">院校速递</a></li>
<li><a href="http://xy.ks5u.com/" target="_blank">许愿墙</a></li>
</ul>
</div>
<div id="Div1" title="测距"
style="background-position: center center;position:absolute; background-image: url('Images/biaochi.png'); width: 14px; background-repeat: no-repeat; height: 24px; background-attachment: scroll; cursor: pointer; top: 5px; left: 984px;"
onclick="measure()"/>
</div>
<form id="form1" runat="server"
style=" position:absolute; top: -41px; left: -328px; height: 20px; width: 203px;">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
</form>
</body>
</html>
JavaScript代码：
var map, control, zoom , scale, polyline,polygon, lineTool,lineTool2;
function Flag4(tag)
{
if (tag== 0) {
document.getElementById("ditutu").style.backgroundColor = "#4A93FF";
document.getElementById("dixingtu").style.backgroundColor = " white";
document.getElementById("yingxiangtu").style.backgroundColor = "white";
}
if (tag== 1) {
document.getElementById("ditutu").style.backgroundColor = "white";
document.getElementById("yingxiangtu").style.backgroundColor = "#4A93FF";
document.getElementById("dixingtu").style.backgroundColor = "white";
}
if (tag== 2) {
document.getElementById("ditutu").style.backgroundColor = "white";
document.getElementById("yingxiangtu").style.backgroundColor = "white";
document.getElementById("dixingtu").style.backgroundColor = "#4A93FF";
}
if (tag == 3) {
document.getElementById("wmap").style.backgroundColor = "#4A93FF";
document.getElementById("xuyuanqiang").style.backgroundColor = "Transparent";
}
if (tag == 4) {
document.getElementById("wmap").style.backgroundColor = "Transparent";
document.getElementById("xuyuanqiang").style.backgroundColor = "#4A93FF";
}
}
function loadmap()
{
map = new TMap("container");
zoom = 6;
map.centerAndZoom(new TLngLat(100.44846, 37.77779), zoom); //甘肃省中心点
//鼠标移动获取经纬度
TEvent.addListener(map, "mousemove", function(point) {
var lnglat = map.fromContainerPixelToLngLat(point);
document.getElementById("Text1").value = lnglat.getLng();
document.getElementById("Text2").value = lnglat.getLat();
});
//添加影像图
var config1 = {};
config1.opacity = 1;
config1.getTileUrl = function(x, y, z) {
var imageBaseURL1 = "http://t0.tianditu.cn/img_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + "&TILEMATRIX=" + z + "&TILEROW=" + y + "&TILECOL=" + x;
return imageBaseURL1;
}
lay1 = new TTileLayer(config1);
lay1.setGetTileUrl(config1.getTileUrl);
//map.addLayer(lay);在原图基础上添加影像图
//添加影像注记
var config2 = {};
//config2.opacity = 1;
config2.getTileUrl = function(x, y, z) {
var imageBaseURL2 = "http://t0.tianditu.com/cia_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + "&TILEMATRIX=" + z + "&TILEROW=" + y + "&TILECOL=" + x;
return imageBaseURL2;
}
lay2 = new TTileLayer(config2);
lay2.setGetTileUrl(config2.getTileUrl);
//添加地形图
var config3 = {};
config3.opacity = 1;
config3.getTileUrl = function(x, y, z) {
var imageBaseURL3 = "http://t0.tianditu.com/ter_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ter&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + "&TILEMATRIX=" + z + "&TILEROW=" + y + "&TILECOL=" + x;
return imageBaseURL3;
}
lay3 = new TTileLayer(config3);
lay3.setGetTileUrl(config3.getTileUrl);
//添加地形图注记
var config4 = {};
config4.opacity = 1;
config4.getTileUrl = function(x, y, z) {
var imageBaseURL4 = "http://t0.tianditu.com/cta_w/wmts?" + "SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cta&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" + "&TILEMATRIX=" + z + "&TILEROW=" + y + "&TILECOL=" + x;
return imageBaseURL4;
}
lay4 = new TTileLayer(config4);
lay4.setGetTileUrl(config4.getTileUrl);
var moveconfig = {
type: "TMAP_NAVIGATION_CONTROL_LARGE", //缩放平移的显示类型
anchor: "TMAP_ANCHOR_TOP_LEFT", //缩放平移控件显示的位置
offset: [0, 0], //缩放平移控件的偏移值
showZoomInfo: true //是否显示级别提示信息，true表示显示，false表示隐藏。
};
control = new TNavigationControl(moveconfig);
map.addControl(control);
scale = new TScaleControl();
map.addControl(scale);
map.enableHandleMouseScroll();
map.enableDoubleClickZoom();
var Eyeconfig = {
anchor: "TMAP_ANCHOR_BOTTOM_RIGHT", //设置鹰眼位置,"TMAP_ANCHOR_TOP_LEFT"表示左上，"TMAP_ANCHOR_TOP_RIGHT"表示右上，"TMAP_ANCHOR_BOTTOM_LEFT"表示左下，"TMAP_ANCHOR_BOTTOM_RIGHT"表示右下，"TMAP_ANCHOR_LEFT"表示左边，"TMAP_ANCHOR_TOP"表示上边，"TMAP_ANCHOR_RIGHT"表示右边，"TMAP_ANCHOR_BOTTOM"表示下边，"TMAP_ANCHOR_OFFSET"表示自定义位置,默认值为"TMAP_ANCHOR_BOTTOM_RIGHT"
size: new TSize(180, 120), //鹰眼显示的大小
isOpen: true //鹰眼是否打开，true表示打开，false表示关闭，默认为关闭
};
var overviewMap = new TOverviewMapControl(Eyeconfig);
map.addControl(overviewMap);
var menu = new TContextMenu();
var txtMenuItem = [
{
text: '放大',
callback: function() { map.zoomIn() }
},
{
text: '缩小',
callback: function() { map.zoomOut() }
},
{
text: '放置到最大级',
callback: function() { map.setZoom(18) }
},
{
text: '查看全省',
callback: function() { map.centerAndZoom(new TLngLat(100.44846, 37.77779), 6) }
},
{
text: '获取中心点坐标',
callback: function() { Ext.MessageBox.alert("提示：","中心点经度：" + map.getCenter().getLng() + ",纬度：" + map.getCenter().getLat()); }
},
{
text: '获取当前缩放级别',
callback: function() { Ext.MessageBox.alert("提示：", "缩放级别：" + map.getZoom()); }
},
{
text: '获得右键点击处坐标',
callback: function(lnglat) {
Ext.MessageBox.alert("提示：", "经度：" + lnglat.getLng() + "，纬度：" + lnglat.getLat());
}
}
];
for (var i = 0; i < txtMenuItem.length; i++)
{
var options = new TMenuItemOptions();
options.width = 100;
menu.addItem(new TMenuItem(txtMenuItem[i].text, txtMenuItem[i].callback, options));
if (i == 1 || i == 3) {
menu.addSeparator();
}
}
map.addContextMenu(menu);
tick();//时钟
init();//添加所有学校
COLLEGE('西北师范大学');
}
//添加影像
function addImage() {
del();
map.addLayer(lay1);
map.addLayer(lay2);
Flag4('1');
}
//移除影像、地形，显示地图
function del() {
map.removeLayer(lay1, false); //false表示还可以再次添加
map.removeLayer(lay2, false);
map.removeLayer(lay3, false);
map.removeLayer(lay4, false);
Flag4('0');
}
//添加地形
function addTerrain() {
var z;
if (z = map.getZoom() > 14) {
alert("地形图无法显示，请减小缩放级别！");
return;
} else {
del();
map.addLayer(lay3);
map.addLayer(lay4);
Flag4('2');
}
}
//测距
function measure() {
if (document.getElementById("container").style.display == "none") {
Ext.MessageBox.alert("提示", "请先点击导航栏中的“网站地图”！");
return;
}
else {
var measureconfig = {
strokeColor: "blue", //折线颜色
strokeWeight: "5px", //折线的宽度，以像素为单位
strokeOpacity: 0.5, //折线的透明度，取值范围0 - 1
strokeStyle: "solid" //折线的样式，solid或dashed
};
lineTool = new TPolylineTool(map, measureconfig);
TEvent.bind(lineTool, "draw", lineTool, onDrawLine);
lineTool.open();
return;
}
}
function onDrawLine(bounds, line) {
lineTool.close();
}
function init()
{
var S = new WebService();
S.GetSchool(getschool);
}
function getschool(e) {
var LNG, LAT;
var s;
s = eval('(' + e + ')');
LNG = parseFloat(s[0].lnglat[0]);
LAT = parseFloat(s[0].lnglat[1]);
var lnglats = new Array();
var names = new Array();
var URLs = new Array();
var INFO = new Array();
var infoWin;
document.getElementById("school").options.length = 0;
for (var i = 0; i < s.length; i++)
{
var lat, lng;
lng = parseFloat(s[i].lnglat[0]);
lat = parseFloat(s[i].lnglat[1]);
lnglats[i] = new TLngLat(lng, lat);
names[i] = String(s[i].sname);
URLs[i] = String(s[i].url);
INFO[i] = String(s[i].info);
document.getElementById("school").options.add(new Option(names[i], names[i]));
}
for (var i = 0; i < lnglats.length; i++)
{
(
function(n) {
var marker = new TMarker(lnglats[n]);
map.addOverLay(marker);
TEvent.addListener(marker, 'click', function() {
var truthBeTold = window.confirm("请你选择：点击“确定”进行地图定位，点击“取消”进入学校主页")
if (truthBeTold) Locate(s[n].sname);
else window.open(URLs[n]);
});
TEvent.addListener(marker, 'click', function() {
Locate(s[n].sname); //点击进行学校地图定位
});
TEvent.addListener(marker, 'mouseover', function() {
infoWin = marker.openInfoWinHtml("这里是“" + names[n] + "”," + INFO[n] + "，请点击！");
//infoWin.setTitle("提示");
//infoWin.setLabel('<a href="http://www.baidu.com" target="_blank">URLs[n]</a>');
//infoWin.closeInfoWindowWithMouse(); //该方法不太灵活，自编关闭函数
});
TEvent.addListener(marker, 'mouseout', function() {
infoWin.closeInfoWindow();
});
}
)(i);
}
}
//获得指定学校的所有学院
var cnames = new Array();
var lnglat2 = new Array();
var urls = new Array();
function COLLEGE(NAME) {
if (NAME == "") return;
var C = new WebService();
C.GetCollege(NAME, back);
}
function back(e)
{
var s=e;
if (s == "]")
{
document.getElementById("college").options.length = 0;
document.getElementById("college").options.add(new Option("<--暂无数据-->", "<--暂无数据-->"));
return;
}
else {
document.getElementById("college").options.length = 0;
s = eval('(' + e + ')');
for (var i = 0; i < s.length; i++) {
var lat, lng;
lng = parseFloat(s[i].lnglat[0]);
lat = parseFloat(s[i].lnglat[1]);
lnglat2[i] = new TLngLat(lng, lat);
cnames[i] = String(s[i].cname);
urls[i] = String(s[i].url);
document.getElementById("college").options.add(new Option(cnames[i], cnames[i]));
}
for (var k = 0; k < lnglat2.length; k++) {
(
function(n) {
var marker = new TMarker(lnglat2[n]);
map.addOverLay(marker);
TEvent.addListener(marker, 'mouseover', function() {
infoWin = marker.openInfoWinHtml("这里是西北师范大学“" + cnames[n] + "”" + "，请点击进入学院主页！");
});
TEvent.addListener(marker, 'mouseout', function() {
infoWin.closeInfoWindow();
});
TEvent.addListener(marker, 'click', function() {
window.open(s[n].url);
});
}
)(k);
}
}
}
获得西北师范大学的所有学院，用来初始化
//function NWNU_COLLEGE()
//{
// COLLEGE('西北师范大学');
//}
var Mnames = new Array();
function MAJOR(NAME) {
if (NAME == "<--暂无数据-->")
{
Ext.MessageBox.alert("提示", "学院信息读取失败，系统维护中。。。");
return;
} else {
var M = new WebService();
M.GetMajor(NAME, callback5);
}
}
function callback5(e)
{
if (e == "]")
{
Ext.MessageBox.alert("提示", "专业信息读取失败，系统维护中。。。");
return;
} else
{
s = eval('(' + e + ')');
var A = new Array();
document.getElementById("table").innerHTML = "";
for (var i = 0; i < s.length; i++) {
A[i] = new Array();
A[i][0] = s[i].MName;
A[i][1] = s[i].MNum;
A[i][2] = s[i].MScore;
}
var gstore = new Ext.data.ArrayStore({
fields:
[
{ name: 'V0', type: 'string' },
{ name: 'V1', type: 'string' },
{ name: 'V2', type: 'string' }
],
data: A
});
var column = new Ext.grid.ColumnModel([
{
header: '专业名称',
dataIndex: 'V0',
sortable: true,
editor: new Ext.form.TextField()
},
{
header: '历年招生人数(2012年)',
dataIndex: 'V1',
sortable: true,
editor: new Ext.form.TextField()
},
{
header: '历年控制分数线',
dataIndex: 'V2',
sortable: true,
editor: new Ext.form.TextField()
}
])
var grid = new Ext.grid.EditorGridPanel({
frame: true,
renderTo: "table",
title: "专业设置及历年招生情况一览表",
height: 400,
width: 342,
cm: column,
ds: gstore
})
var bbar = new Ext.PagingToolbar({
pageSize: 25,
store: gstore,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
items: [
'-', {
pressed: true,
enableToggle: true,
text: 'Show Preview',
cls: 'x-btn-text-icon details',
toggleHandler: function(btn, pressed) {
var view = grid.getView();
view.showPreview = pressed;
view.refresh();
}
}]
})
}
}
function Locate(name) {
if (name == "") return;
var L = new WebService();
L.GetLocate(name,getlocate);
}
function getlocate(e)
{
var s;
s = eval('(' + e + ')');
var lng = parseFloat(s[0].lnglat[0]);
var lat = parseFloat(s[0].lnglat[1]);
map.centerAndZoom(new TLngLat(lng,lat),17);
}
Ext.onReady();
function getcities() {
if (document.getElementById("container").style.display == "none") {
Ext.MessageBox.alert("提示", "请先点击导航栏中的“网站地图”！");
return;
}
else {
var win = new Ext.Window({ html: '<select id="cities" onchange="locateCity(cities.value)"></select>' });
win.title = "选择市";
win.x = 345;
win.y = 90;
win.width = 200;
win.show();
var w = new WebService();
w.City(call);
}
}
function call(e) {
var s;
s = eval('(' + e + ')');
document.getElementById("cities").options.length = 0;
var st = new Array();
document.getElementById("cities").options.add(new Option("请选择城市", "请选择城市"));
for (var i = 0; i < s.length; i++)
{
st[i] = String(s[i].name);
document.getElementById("cities").options.add(new Option(st[i], st[i]));
}
}
function locateCity(name) {
var w = new WebService();
w.LCity(name, callme);
}
function callme(e) {
var s;
s = eval('(' + e + ')');
if (s[0].NOTES == 'no')
Ext.MessageBox.alert("提示", "该城市内没有高校分布！");
map.centerAndZoom(new TLngLat(s[0].lnglat[0],s[0].lnglat[1]), 12);
}
function displayDiv(flag)
{
if (flag == 0) {
document.getElementById("college_table").style.display = "block";
document.getElementById("container").style.display = "none";
document.getElementById("navigation").style.display = "none";
document.getElementById("lnglat").style.display = "none";
Flag4('4');
}
if (flag == 1) {
document.getElementById("college_table").style.display = "none";
document.getElementById("container").style.display = "block";
document.getElementById("navigation").style.display = "block";
document.getElementById("lnglat").style.display = "block";
Flag4('3');
}
}
function warn() {
Ext.MessageBox.alert("提示", "系统暂未开放，敬请关注！"); //我不会停止程序
return;
}
4、调用天地图服务
（1）获取API
调用天地图服务要借助天地图提供的JavaScript Web API，使用之前需要通过<script>标签将其引用到页面中。
<script type="text/javascript" src="http://api.tianditu.com/js/maps.js"> </script> （2）添加鹰眼图控件
在鹰眼图上可以像从空中俯视一样查看地图显示区域中所显示的地图在整个图中的位置，为地图定位与平移提供方便。
（3）添加缩放平移控件
通过缩放平移控件可快速地将地图定位到国、省、市、街级别，也可方便地实现地图的上下左右平移。
（4）创建右键下拉菜单
该下拉菜单实现的功能有：放大、缩小、放大到最大级别、查看全省、获取中心点坐标、获取当前缩放级别和获取右键点击处坐标。
5、调用自定义WEB服务
利用JavaScript语言，编写函数调用WebService，实现浏览器端间接对数据库数据的访问。
<%@ WebService Language="C#" CodeBehind="~/App_Code/WebService.cs" Class="WebService" %>
6、网站发布
利用Internet信息服务（IIS）进行网站发布。发布完成以后可以通过在浏览器中输入地址来使用本系统。
7、系统运行与维护
7.1 系统运行
系统运行是指用户通过浏览器对本系统进行具体的应用，为了保证系统运行的流畅。
7.2 系统维护
系统维护就是保证系统整体及系统中的各个要素随着环境的变化始终处于最新的、正确的工作状态。具体包括WEB服务更新和数据更新两个方面。
7.2.1 WEB服务更新
根据功能的增删重新自定义WEB服务或者从Internet上获取新的相关资源。
7.2.2 数据更新
需要适时的根据省内高考动态、招生政策以及各个高校、学院、专业的招生变动情况对数据库做相应的更新。
刘一哥GIS：专注测绘地理信息教育，探索地理奥秘，分享GIS价值！
扫一扫
8083
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
