Marker with openlayers/geoserver ( help! )

Thảo luận trong 'Lập trình cho mã nguồn mở' bắt đầu bởi tvquang_dn, 2/3/12.

  1. tvquang_dn

    tvquang_dn New Member

    Tham gia ngày:
    12/2/12
    Bài viết:
    4
    Đã được thích:
    0
    Điểm thành tích:
    0
    Chào mọi người !
    Mình tên Quang. Mình muốn add một market lên webmap và mình viết code như bên dưới :
    -----------------------------------------------------------
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
    <html xmlns="Đăng kí hoặc đăng nhập để xem link">
    <head>

    <!-- Import OL CSS, auto import does not work with our minified OL.js build -->
    <link rel="stylesheet" type="text/css" href="Đăng kí hoặc đăng nhập để xem link"/>
    <!-- Basic CSS definitions -->
    <style type="text/css">
    /* General settings */
    body {
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: small;
    }

    /* The map and the location bar */
    #map {
    clear: both;
    position: relative;
    width: 1350px;
    height: 600px;
    border: 0px solid black;
    }

    </style>

    <!-- Import OpenLayers, reduced, wms read only version -->
    <script src="Đăng kí hoặc đăng nhập để xem link" type="text/javascript">
    </script>
    <script defer="defer" type="text/javascript">
    var map;
    var untiled;
    var tiled;
    var pureCoverage = false;


    // pink tile avoidance
    OpenLayers.IMAGE_RELOAD_ATTEMPTS = 5;
    // make OL compute scale according to WMS spec
    OpenLayers.DOTS_PER_INCH = 25.4 / 0.28;

    function init(){
    // if this is just a coverage or a group of them, disable a few items,
    // and default to jpeg format
    format = 'image/png';

    var bounds = new OpenLayers.Bounds(
    143.83482400000003, -43.648056,
    148.47914100000003, -39.573891
    );
    var options = {
    controls: [],
    maxExtent: bounds,
    maxResolution: 0.01814186328125,
    projection: "EPSG:4326",
    units: 'degrees'
    };
    map = new OpenLayers.Map('map', options);

    // setup tiled layer
    tiled = new OpenLayers.Layer.WMS(
    "Geoserver layers - Tiled", "Đăng kí hoặc đăng nhập để xem link",
    {
    LAYERS: 'tasmania',
    STYLES: '',
    format: format,
    tiled: true,
    tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
    },
    {
    buffer: 0,
    displayOutsideMaxExtent: true,
    isBaseLayer: true,
    yx : {'EPSG:4326' : true}
    }
    );

    map.addLayers([tiled]);

    // build up all controls
    map.addControl(new OpenLayers.Control.PanZoomBar({
    position: new OpenLayers.Pixel(2, 15)
    }));
    map.addControl(new OpenLayers.Control.Navigation());
    map.addControl(new OpenLayers.Control.Scale($('scale')));
    map.addControl(new OpenLayers.Control.MousePosition({element: $('location')}));
    map.zoomToExtent(bounds);

    //marker
    var markers = new OpenLayers.Layer.Markers( "Markers" );
    map.addLayer(markers);

    var size = new OpenLayers.Size(21,25);
    var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
    var icon = new OpenLayers.Icon('Đăng kí hoặc đăng nhập để xem link', size, offset);
    markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(146.83482400000003, -42.648056),icon));
    markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(146.47914100000003, -41.573891),icon.clone()));

    // support GetFeatureInfo
    map.events.register('click', map, function (e) {
    document.getElementById('nodelist').innerHTML = "Loading... please wait...";
    var params = {
    REQUEST: "GetFeatureInfo",
    EXCEPTIONS: "application/vnd.ogc.se_xml",
    BBOX: map.getExtent().toBBOX (),
    SERVICE: "WMS",
    INFO_FORMAT: 'text/html',
    QUERY_LAYERS: map.layers[0].params.LAYERS,
    FEATURE_COUNT: 50,
    Layers: 'tasmania',
    WIDTH: map.size.w,
    HEIGHT: map.size.h,
    format: format,
    styles: map.layers[0].params.STYLES,
    srs: map.layers[0].params.SRS};

    OpenLayers.loadURL("Đăng kí hoặc đăng nhập để xem link", params, this, setHTML, setHTML);
    OpenLayers.Event.stop(e);
    });
    }


    </script>
    </head>
    <body onload="init()">
    <h1 id="title">Markers Layer Example</h1>
    <div id="map">
    </div>

    </body>

    </html>
    ------------------------------------------------------------------------------------------
    Nhưng nó lại không hiện marker mà chỉ hiện trang webmap mà thôi. Mình không biết viết thiếu chỗ nào ? Có ai biết cách sửa không ? Giúp mình với. Đây là trang Webmap kết quả :
    Marker layer example 01.jpg
    Đăng kí hoặc đăng nhập để xem link
    Cám ơn mọi người rất nhiều !
     
    Last edited by a moderator: 2/3/12
    Tags:

Chia sẻ trang này

Share
Đang tải...