我需要一些帮助。我对Geoserver和WMS的概念很陌生，我正在寻找非常基本的帮助。我已经下载并安装Geoserver，设置图层等（包括sld），但是，我不知道如何从这里获取这些信息到我的网站。正如我刚才提到的，我对此并不了解，并且不知道我在做什么，我尝试在网上寻找一步一步的帮助，但大多数情况下，只有当您将shapefile上传并存储后，才会错过如何操作或执行什么操作GeoServer的。Geoserver和WMS
任何帮助或指向信息的正确方向将不胜感激。
感谢
史蒂夫
利用Geoserver可以运行使用其自己的Web服务器（码头），或作为 “的.war档案” 为Tomcat。也就是说，要将其部署到Web服务器上，必须在托管网站的实际机器上安装该软件（常用的方法是在Web服务器运行tomcat的情况下部署.war归档文件）。
地理服务器的工作是根据WMS协议提供的规范呈现地图图块。要将这些图块包含在您的实际网站中并将它们显示为地图，您需要一个客户端应用程序，如OpenLayers，它可以处理整个用户的交互。
http://docs.geoserver.org/stable/en/user/installation/war.html
我同意转租。点击Geoserver Web Interface（左下角）中的“预览”按钮即可轻松启动。在那里你可以用openlayers预览一个图层。一旦你看到你的图层，看看页面的HTML + JS代码。你可以开始复制&从那里粘贴...
我创建了一个测试网页，然后调用我在该测试页上使用的图层。
基地=新OpenLayers.Layer.WMS（ “CMA信息 - 街道”， “http://test.com/geoserver/test/gwc/service/wms”， {层： “Base_test”，透明：真，格式为： “图像/ GIF”，缓冲液：0} 瓷砖：真 }
);
Base.isBaseLayer = true;
Base.setOpacity(1);
Base.setVisibility(true);
Base.displayOutsideMaxExtent = 0;
map.addLayers([Base]);
//map.setOptions(zoomLevel = 19);
当您添加形状文件到GeoServer的 系统会提示您选择一个工作场所来存放它
之后，去层 并单击添加新的层 选择您已经添加了数据 地点和指定SRS，e.g EPSG：4326
计算边界盒
，然后单击发布。
然后去图层预览 找到层您刚刚发布 和clicke OPenlayer
所以，当你配置利用Geoserver它的数据层（大多数图像的地图）是服了你使用什么所谓的URL端点。这是应用程序请求图像（拼贴）并为您创建地图的链接。这将是这样，无论你是否使用KML，Postgis数据库的Shapefile。服务器负责处理它，并通过该端点提供可视信息。
对于网络来说，最流行的是OpenLayers，女巫是一个Javascript库，可以使用简单的HTML作为环境来管理您的硬件过程。
我发现他们一起工作的一个很好的例子是here。
注意我hightlighting波纹管行：
var ccounties = new OpenLayers.Layer.WMS(
"Counties of Colorado - Untiled",
"http://thisawsomesite.com:8080/geoserver/wms",
{
width: '426',
srs: 'EPSG:4269',
layers: 'geosolutions:Counties',
height: '512',
styles: '',
format:'image/png'**
},
{singleTile: true, ratio: 1}
);
map.addLayer(ccounties);
http://thisawsomesite.com:8080/geoserver/wms - >这是GeoServer的服务器，这将使你的瓷砖的URL。 WMS是将数据转换为这些图像的服务。
layers：'geosolutions：Counties'， - >这会通过请求通知geoserver您希望来自“geosolutions”工作区的“Counties”图层。很简单，不是吗？
**样式：'' - >这里您通知我创建的样式的名称。
format：'image/png' - >这是一个图像格式（image/png或image/jpeg是最常用的，但还有更多）。请记住，jpeg通常较小，但png是您需要透明度/不透明度设置的选项。
srs是投影。我不记得在这里需要。如果这是遗留的，则应该进行默认地图投影。
如果您不确定如何创建OpenLayers应用程序，Geoserver会为您提供一个您拥有的图层的示例。转到层预览，在左侧菜单中，然后单击“OpenLayers”以查看一个简单示例。您会注意到有多个选项可以在该链接旁边的菜单中检索信息。
其它链接你会发现有用：
dev.openlayers.org/releases/OpenLayers-2.13.1/examples/getfeatureinfo-control.html dev.openlayers.org/releases/OpenLayers-2.13.1/examples/ dev.openlayers.org/apidocs/files/OpenLayers-js.html
我希望这是有帮助的。 See'ya
您现在可能已经建立了您需要添加一些OpenLayers/JavaScript代码到您想要您的地图的HTML页面。以下是一个HTML页面，其中包含一些基本的OpenLayers代码，用于向该页面添加地图。
查看/使用的位是，然后是从标签到OpenLayers/JavaScript。您需要将URL替换为您的Geoserver以及工作空间和图层名称。 bounds和maxResolution设置为英格兰和威尔士，投影设置为英国国家网格，因此您可能需要将这些设置更改为您感兴趣的区域。
如果你不熟悉JavaScript，那么一个好的开始是：http://www.w3schools.com/js/default.asp，以及OpenLayers文档。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<meta name="Description" content="Central-Geo">
<title>Map Test Page</title>
<style type="text/css" media="screen">
html, body, div, header, footer, aside, nav, article, section { margin: 0; padding: 0; }
header, footer, aside, nav, article, section { display: block; }
body { color: #333; font: 12px Helvetica, Arial, sans-serif; line-height: 18px; }
h2 { color: #333; }
a { color: #337810; }
p { margin: 0 0 18px; }
#container { width: 760px; margin: 0 auto;}
/* Header */
header { background: #006666; border-bottom: 2px solid #aaa; }
header h1 { color: #fff; margin: 0 0 3px; padding: 24px 18px 0; }
header p { color: #ccc; font-size: 11px; font-weight: bold; padding: 0 18px; }
/* Content Style */
nav { border-bottom: 1px solid #ccc; margin-right: 18px; }
nav ul { padding: 0 18px 9px; }
#extra { margin-left: 18px; }
#extra small { font-size: 11px; line-height: 18px; }
#content { border-bottom: 1px solid #ccc; margin-left: 18px; }
#content p, #extra p { padding-right: 18px; }
/* Content Positioning and Size */
nav { float: right; width: 175px; }
#content { float: left; width: 540px; }
#extra { float: left; width: 540px; } /* Footer */
footer { background: #666; border-bottom: 2px solid #aaa; clear: left; width: 100%; }
footer a { color: #fff; }
footer p { color: #ccc; margin: 0; padding: 0 18px 10px; }
footer ul { border-bottom: 1px solid #999; list-style: none; margin: 0 18px 6px; padding: 10px 0 6px; }
footer li { display: inline; font-size: 11px; font-weight: bold; padding-right: 5px; }
.map { height: 400px; width: 100%: margin: 0; padding: 0}
</style>
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div id="container">
<header>
<h1>Test Map Page heading</h1>
<p class="description">A test page for a map</p>
</header>
<div id="wrapper">
<section id="content">
<h2>Map Heading Goes Here</h2>
<div id="map" class="map">
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript">
var bounds = new OpenLayers.Bounds(
92599.19919326127, 1484.4293913718284,
695626.1392662271, 670208.9526868482
);
var options = {
maxExtent: bounds,
maxResolution: 1700,
projection: "EPSG:27700",
};
var map = new OpenLayers.Map('map', options);
var wms = new OpenLayers.Layer.WMS(
"Geoserver layers ", "http://urltoyourgeoserver/geoserver/yourworkspace/wms",
{'layers': 'yourlayer',
styles: '',
format:'image/png'});
map.addLayer(wms);
map.zoomToMaxExtent();
</script>
</div>
</div>
<nav>
<h2>Navigation Here</h2>
<ul>
<li><a href="">Navigation 1</a></li>
<li><a href="">Navigation 2</a></li>
<li><a href="">Navigation 3</a></li>
<li><a href="">Navigation 4</a></li>
<li><a href="">Navigation 5</a></li>
<li><a href="">Navigation 6</a></li>
</ul>
</nav>
<section id="extra">
<h2>Extra Stuff Goes Here</h2>
<p>Sometimes this would be called a <em>sidebar</em>, but it doesn't always have to be on the side to be called a <em>sidebar</em>. Sidebars can be on tops of things, below things, but they are usually beside things – hence it being a called a sidebar.</p>
<p><small>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</small></p>
</section>
<footer>
<ul>
<li><a href="">Navigation 1</a></li>
<li><a href="">Navigation 2</a></li>
<li><a href="">Navigation 3</a></li>
<li><a href="">Navigation 4</a></li>
<li><a href="">Navigation 5</a></li>
<li><a href="">Navigation 6</a></li>
</ul>
<p>Footer stuff goes here. Copyright, disclaimers – stuff like that.</p>
</footer>
</div>