[OpenLayers-Users] How to all a polyline on openlayers

Sat Sep 8 19:02:59 PDT 2012

I have succefully add some marker on opnelayers.
But I want to add  a polyline on it.

How to cope with?

I have a html file and try to add a polyline , but not succeful. anyone
could have a look?
below is my html file:
-------------------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
  <head>
    <title>India Mapserver</title>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script type="text/javascript">

        var map,baseLayer;
        var lat;
           var lng;
        var pointslng = [];
        var pointslat = [];
        var objNodeList;
        var Node;
var format;

        try //Internet Explorer
  {
  xdoc=new ActiveXObject("Microsoft.XMLDOM");
  }
catch(e)
  {
  try //Firefox, Mozilla, Opera, etc.
    {
    xdoc=document.implementation.createDocument("","",null);
    }
  catch(e) {alert(e.message)}
  }
try
  {
  xdoc.async=false;
  xdoc.load("getDeviceInfo.php.xml");
  }
catch(e) {alert(e.message)}

 nodes = xdoc.documentElement.childNodes;
  objNodeList = xdoc.getElementsByTagName("marker");
  for ( var i=0; i<objNodeList.length; i++)
{

Node =objNodeList[i];
  for (var k=0; k< Node.attributes.length; k++)
   {
     if(Node.attributes[k].nodeName == "lng")
      lng = Node.attributes[k].nodeValue;
     if(Node.attributes[k].nodeName == "lat")
      lat = Node.attributes[k].nodeValue;
   }
  pointslng.push(  lng ) ;
  pointslat.push(  lat ) ;
}

    function init() {

    // The overlay layer for our marker, with a simple diamond as symbol
    var overlay = new OpenLayers.Layer.Vector('Overlay', {
        styleMap: new OpenLayers.StyleMap({
            externalGraphic: 'marker.png',
            graphicWidth: 20, graphicHeight: 24, graphicYOffset: -24,
            title: '${tooltip}'
        })
    });

   for (var l=0; l< pointslng.length; l++)
    {
    // The location of our marker and popup. We usually think in geographic
    // coordinates ('EPSG:4326'), but the map is projected ('EPSG:3857').
    var myLocation = new OpenLayers.Geometry.Point(
pointslng[l],pointslat[l])
        .transform('EPSG:4326', 'EPSG:3857');

    // We add the marker with a tooltip text to the overlay
    overlay.addFeatures([
        new OpenLayers.Feature.Vector(myLocation, {tooltip: 'OpenLayers'})
    ]);
    }

    var style = new OpenLayers.Style({
           strokeWidth: "${strokeWidth}"
      }, {
        context:{
            strokeWidth:function(feature) {
             return feature.attributes.strokeWidth;
                       }
                }
        }
   );

   var points_ = new Array(
       new OpenLayers.Geometry.Point(77.08,28.74),
       new OpenLayers.Geometry.Point(79.08,28.94)
   );

   var line = new OpenLayers.Geometry.LineString(points_);
   var feat = new OpenLayers.Feature.Vector(line,null,style);
   feat.attributes.strokeWidth = 5;

  var vectors = new OpenLayers.Layer.Vector("Vector",{maxResolution:
156543.0339});
  vectors.addFeatures([feat]);

    // A popup with some information about our location
    var popup = new OpenLayers.Popup.FramedCloud("Popup",
        myLocation.getBounds().getCenterLonLat(), null,
        '<a target="_blank" href="http://openlayers.org/">We</a> ' +
        'could be here.<br>Or elsewhere.', null,
        true // <-- true if we want a close (X) button, false otherwise
    );

           map = new OpenLayers.Map({
div:"map",projection:"EPSG:3857",
layers:[ new OpenLayers.Layer.MapServer("OSM
map","/cgi-bin/mapserv?",{map:"/home/jack/osm-demo/basemaps/osm-google.map",layers:"all",map_image_type:"png"},{singleTile:true,ratio:1.0})],

center:myLocation.getBounds().getCenterLonLat(),zoom:5});
map.addLayer(overlay);
map.addLayer(vectors);

map.addPopup(popup);
}

    </script>

    <style>
    @media screen
    {
       #map{width: 800px; height:400px; border: 2px solid black;}

    }
    </style>
  </head>
  <body onload="init()">
     <h3>India Mapserver</h3>
     <div id="map"></div>
   </body>
</html>
-------------------------------------------------------------------------------------------------------

I use vectors layer to store the polyline.

Tks.

-- 
Yang Li
GIS Developer
P.R.China
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/openlayers-users/attachments/20120909/db2f1079/attachment.html>