openlayers加google地图，绘制vector，会飘。

1. 如果用第三版的google地图，就会飘。

要解决这个问题，用openlayers2.10，并且用第二版的地图，然后加上  'sphericalMercator': true,如下

<link rel="stylesheet" href="../js/OpenLayersV2.10/theme/default/google.css" type="text/css" /> 
<script src="../js/OpenLayersV2.10/lib/OpenLayers.js" type="text/javascript"></script>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false;key=ABQIAAAAtxcgp24XL91ez-DJ2oOnzhTI6IOEiMOxoChLuR9N7Agb-yPflBT3IzJ_HnK2GGgFCtydUeqzloosEw"type="text/javascript"></script>

   gmap = new OpenLayers.Layer.Google(
                   xuhy.Map.MapName_Road, // the default
                   {
                       'sphericalMercator': true,
                       numZoomLevels: 20
                       , isBaseLayer: true
                    }
               );

就不会飘了，tmd。

参照一位达人的帖：http://www.wei1224hf.com.cn/forum.php?mod=viewthread&tid=144&page=1

不过这样设置以后，鹰眼的图就显示不正确，只有把  'sphericalMercator': true, 去掉才行，看来还需要设置。

另外，用openlayers2.10 可以在地图的div里面放一个div，用于调用mapper来显示热区，不会被覆盖，用2.11不行。

2. 记录

ol用2.10，google用v2版，option中这样设置

 var options = {
                controls: [
                 new OpenLayers.Control.Navigation(),
                new OpenLayers.Control.MousePosition({ formatOutput: MousePositionFormatOutput }),
                new OpenLayers.Control.LayerSwitcher()
                , new OpenLayers.Control.PanZoomBar()//
               , new OpenLayers.Control.OverviewMap({ maximized: true })
               , new OpenLayers.Control.ScaleLine({ topOutUnits: "公里", topInUnits: "米", bottomOutUnits: "米", bottomInUnits: "尺" })
                ]
                //,allOverlays: true
                   , projection: new OpenLayers.Projection("EPSG:4326")//900913
                   , displayProjection: new OpenLayers.Projection("EPSG:4326")
                   , units: "m"
                   , maxResolution: 156543.034
                   , maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34)//20037508.34
            };

 gmap = new OpenLayers.Layer.Google(
                   xuhy.Map.MapName_Road, // the default
                   {
                   'sphericalMercator': true,
                   numZoomLevels: 20
                       , isBaseLayer: true
               }
               );
                map.addLayer(gmap);

 hotspot = new OpenLayers.Layer.Vector("Lines", {
                    strategies: [new OpenLayers.Strategy.Fixed()],
                    protocol: new OpenLayers.Protocol.HTTP({
                        url: "../data/test.json",
                        format: new OpenLayers.Format.GeoJSON()
                    })
                    , styleMap: styles
                    // ,maxExtent: new OpenLayers.Bounds(1549471.9221, 6403610.94, 1550001.32545, 6404015.8)
                });


                map.addLayer(hotspot);

test.json中的内容如下

{
    "type": "FeatureCollection",
    "features": [
        {"type":"Feature", "id":"OpenLayers.Feature.Vector_1489", "properties":{"Title":"tianfu"}, "geometry":{"type":"Polygon", "coordinates":[[[11.0878902207, 45.1602390564],[14.931640625, 40.9228515625],[0.8251953125, 41.0986328125],[7.63671875, 48.96484375],[11.0878902207, 45.1602390564]]]}},
        {"type":"Feature", "id":"OpenLayers.Feature.Vector_1668", "properties":{"Title":"春熙路"}, "geometry":{"type":"Polygon", "coordinates":[[[112.78125, 34.0390625], [112.078125, 44.8046875], [122.65625, 44.6640625], [122.09375, 34.2265625],[112.78125, 34.0390625]]]}},
        {"type":"Feature", "id":"OpenLayers.Feature.Vector_1668", "properties":{"Title":"五丁路"}, "geometry":{"type":"Polygon", "coordinates":[[[104.058, 30.6827], [104.058, 30.683], [104.0587, 30.6831], [104.0587, 30.6828],[104.058, 30.6827]]]}}
    ]
}

地图如果添加一个点，需要转换投影

 var newlonlat = (new OpenLayers.LonLat(104.058, 30.6827))
.transform(new OpenLayers.Projection("EPSG:4326"), map
.getProjectionObject());
                map.setCenter(newlonlat, 16); //  104.058, 30.6827

这样坐标会一致。

因为都用4326投影，不过这样的话，鹰眼会有问题。