[OpenLayers-Users] Problem while adding a vector layer

Thu Apr 8 03:38:52 EDT 2010

I am doing a project using Openlayers API with Google Maps as my base layer.
I got a problem while adding a  vector layer(kml layer) or even just a
linestring on google maps(base layer on openlayers API). The vector layer is
not fixed with the map and moving while I am panning the map. I have tried
different combinations but couldn't end up with a proper solution.

This is my code for drawing a line:

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <style type="text/css">
        #map {
            width: 762px;
            height: 825px;
            border: 1px solid black;
        }
    </style>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script
src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAIeWnOWItAsdtOsR3kxiUQhTwM0brOpm-All5BF6PoaKBxRWWERSQAgEHUq2jStqEx-kpNgzntg87iw"></script>

    <script type="text/javascript">
         var result_style = OpenLayers.Util.applyDefaults({
             strokeWidth: 7,
             strokeColor: "#ff0000",
             fillOpacity: 0
         }, OpenLayers.Feature.Vector.style['default']);

        function init() {
            var map = new OpenLayers.Map('map');
			var google = new OpenLayers.Layer.Google( "Google", { type: G_NORMAL_MAP}
);
            var highlight = new OpenLayers.Layer.Vector("highlight", {style:
result_style});
			map.addLayers([google, highlight]);
            var parser = new OpenLayers.Format.WKT();
            var wkt = "LINESTRING(-73.9444 40.75921,-73.96892 40.76396)";
            var feature = parser.read(wkt);
            highlight.addFeatures([feature]);
            map.zoomToExtent(new
OpenLayers.Bounds(-74.0472500,40.6795100,-73.9071900,40.8820000));
        }
    </script>
  </head>
  <body onload="init()">
    <div id="map"></div>
  </body>
</html>

code for adding a kml layer on google maps: 

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <style type="text/css">
        #map {
            width: 762px;
            height: 825px;
            border: 1px solid black;
        }
    </style>
    <script src="http://openlayers.org/api/OpenLayers.js"></script>
    <script
src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAIeWnOWItAsdtOsR3kxiUQhTwM0brOpm-All5BF6PoaKBxRWWERSQAgEHUq2jStqEx-kpNgzntg87iw"></script>

    <script type="text/javascript">         
function init() {
var map = new OpenLayers.Map(document.getElementById("map"));
OpenLayers.ProxyHost="/proxy/?url=";
map = new OpenLayers.Map('map');
google = new OpenLayers.Layer.Google("Google Streets", // the default
     {numZoomLevels: 20}
     );
map.addLayer(google);
map.setCenter(new OpenLayers.LonLat(83.30454509,17.72457397), 13);
mylayer = new OpenLayers.Layer.Markers("samplekml");
map.addLayer(mylayer);
             mylayer = new OpenLayers.Layer.GML("KML", "sample.kml",
               {                
                format: OpenLayers.Format.KML,                
                formatOptions: {
                  extractStyles: true,                  
                  extractAttributes: true,
                  maxDepth: 4
                }
               })        
        map.addLayer(mylayer);

        }

    </script>
  </head>
  <body onload="init()">
    <div id="map"></div>
  </body>
</html>

Can anyone help me out with this. I guess thats not gonna be a big problem
for experienced users or developers.
-- 
View this message in context: http://n2.nabble.com/Problem-while-adding-a-vector-layer-tp4869632p4869632.html
Sent from the OpenLayers Users mailing list archive at Nabble.com.