Geoserver and WMS

I need help. I am new to the Geoserver and WMS concepts and I am looking for very basic help. I downloaded and installed Geoserver, configured layers, etc. (Including sld), however, I have no idea how to get this information from here on my website. As I already mentioned, I am new to this and have no idea what I'm doing, I tried searching the Internet for step-by-step help, but I most likely missed how and what to do as soon as you downloaded and saved your Geoserver shapefiles.

Any help or guidance in the right direction of information would be most appreciated.

thank

Steve

+3
source share
6 answers

Geoserver - (), ".war-" Tomcat. , -, , ( - .war, - tomcat).

, , WMS. - , , OpenLayers, .

http://docs.geoserver.org/stable/en/user/installation/war.html

http://geoserver.org/display/GEOSDOC/OpenLayers

+4

. , " " - Geoserver ( ). openlayers. , HTML + JS . ...

+2

, , OpenLayers/javascript HTML, , . ​​HTML- OpenLayers, .

/ - , OpenLayers/javascript . URL- Geoserver, . 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 &ndash; 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 &ndash; stuff like that.</p>
    </footer>
</div>

+1

-, , .

Base = OpenLayers.Layer.WMS( "CMA Info - Streets",                " http://test.com/geoserver/test/gwc/service/wms",               {layers: "Base_test", transparent: true, format: "image/gif", buffer: 0}                   : true               }

        );
        Base.isBaseLayer = true;
        Base.setOpacity(1);
        Base.setVisibility(true);
        Base.displayOutsideMaxExtent = 0;
        map.addLayers([Base]);
        //map.setOptions(zoomLevel = 19);
0

.

Layer .    ,    SRS, EPSG: 4326

"".

, OPenlayer

0

, Geoserver, ( ) URL. , () . , , KML, Shapefiles Postgis. .

OpenLayers, - Javascript, , HTML .

, , .

, :

 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 → URL- , . WMS - , .

layer: 'geosolutions: Counties', → , , "" "geosolutions". , ?

** styles: '' → , .

format: 'image/png' → ( /png image/jpeg, ). , jpeg , png - , /.

srs - . , . , .

, OpenLayers, Geoserver . Layer Preview, "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

Hope this was helpful. See'ya

0
source

Source: https://habr.com/ru/post/1757859/


All Articles