[OpenLayers-Users] Displaying EPSG:3021-locations on EPSG:900913

Wed Nov 23 04:46:06 EST 2011

In Sweden we are using RT90 (http://spatialreference.org/ref/epsg/3021/).
I’ve been working on a app that displays EPSG:3021-coords upon Google Maps
(EPSG:900913). (I got help by Erik Hazzard, the author of the book
Openalyers 2.10).

It’s almost working, but there is still one thing that’s kind of odd which
neither he nor I understand.

See Code below

<!DOCTYPE html>

<html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0,
maximum-scale=1.0, user-scalable=0">

    <meta name="apple-mobile-web-app-capable" content="yes">

        <link rel="stylesheet" href="
http://openlayers.org/dev/theme/default/style.css" type="text/css">

        <link rel="stylesheet" href="
http://openlayers.org/dev/examples/style.css" type="text/css">

        <style>

           .olControlMousePosition {

                background:rgba(255,255,255,.9) !important;

                border:1px solid rgba(0,0,0,.4) !important;

                bottom:150px !important;

                font-size:1em !important;

                font-weight:bold !important;

                padding:2px !important;

                position:absolute !important;

                right:2px !important;

                width:100px !important;

            }

        </style>

    </head>

    <body>

    <div id="map" style='height:500px;width:500px;'></div>

    <div id='point_display'></div>

<script src="http://openlayers.org/dev/OpenLayers.js"></script>

 <script src='proj4js.js'></script>

<script src="http://maps.googleapis.com/maps/api/js?v=3.5&amp;sensor=false
"></script>

    <script src="EPSG3021.js"></script>

    <script>

        var map = new OpenLayers.Map({

            div: "map",

            projection: new OpenLayers.Projection('EPSG:900913'),

            displayProjection: new OpenLayers.Projection('EPSG:3021')

        });

//*********************************

       var google_hybrid = new OpenLayers.Layer.Google(

                "Google Hybrid",

                {sphericalMercator: true,type:
google.maps.MapTypeId.HYBRID, numZoomLevels: 22}

            );

      var google_physical = new OpenLayers.Layer.Google(

                "Google Physical",

                {sphericalMercator: true,type:
google.maps.MapTypeId.TERRAIN, numZoomLevels: 22}

            );

      var google_satellite = new OpenLayers.Layer.Google(

                "Google Satellite",

                {sphericalMercator: true,type:
google.maps.MapTypeId.SATELLITE, numZoomLevels: 22}

            );

       var google_streets = new OpenLayers.Layer.Google(

                "Google Streets",

                {sphericalMercator: true,numZoomLevels: 22}

);

//******************************

       var vector_layer = new OpenLayers.Layer.Vector(

            'Vector Layer',

            {

                strategies: [new OpenLayers.Strategy.Fixed()],

                projection: new OpenLayers.Projection('EPSG:3021'),

                protocol: new OpenLayers.Protocol.HTTP({

                    url: "data_in_3021.json",

                    format: new OpenLayers.Format.GeoJSON({

                    })

                })

        });

        vector_layer.events.register('featureselected', this,
function(feature){

            var feature_html = '';

            var feature_copy = feature.feature.clone();

            var feature_reprojected =  feature_copy.geometry.transform(

                new OpenLayers.Projection('EPSG:900913'),

                new OpenLayers.Projection('EPSG:3021'));

            feature_html += "Lon: " + feature_reprojected.x

                + " | Lat: " + feature_reprojected.y;

            feature_html += " | Antal: " +
feature_copy.attributes.observations_count;

            feature_html += "<br />";

            document.getElementById('point_display').innerHTML +=
feature_html;

        });

        vector_layer.events.register('featureunselected', this,
function(feature){

            document.getElementById('point_display').innerHTML = '';

        });

        map.addLayers([

        google_hybrid,
google_physical, google_satellite, google_streets, vector_layer

        ]);

        //-------------------------------

        //Controls

        //-------------------------------

        var overview_map = new OpenLayers.Control.OverviewMap(

            { autoPan: true, size: new OpenLayers.Size(150,100) }

        );

        var select_features_control = new OpenLayers.Control.SelectFeature(

            vector_layer,{

                clickout: true,

                toggle: false,

                multiple: true,

                hover: false,

                box: true

        });

        map.addControls([

            new OpenLayers.Control.MousePosition(),

            new OpenLayers.Control.LayerSwitcher(),

            overview_map,

            select_features_control

        ]);

        overview_map.maximizeControl();

        select_features_control.activate();

        if(!map.getCenter()){

            map.setCenter(

                new OpenLayers.LonLat(1738182, 9069017),

                6);

        }

    </script>

    </body>

</html>

The JSON-file contains:

{"type": "FeatureCollection", "features": [

                             {"type":"Feature",

    "geometry":{"type":"Point",

    "coordinates":[1710943, 7456832]},

    "properties":{"observations_count": 1 }}

]}

This geolocation, 1710943, 7456832 is a well known roundabout in my
hometown and when the marker hits the map it’s placed some 400 m Northbound
and 200 meters Eastbound from where it should be. Looking at the map.

When I move the mouse over the actual marker it displays the correct
locations as above.

If I move the mouse to where it should be, it displays the wrong
lon-lat-coordinates.

I used to work with ARC-GIS before and this gives me thoughts about the
layers not being properly rectified to each other

I’d appreciate it a lot if somebody could give me a hint on where to look
and what to correct.

Best regards

Roger Waara

Sweden

-- 

=========================
Roger Waara
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.osgeo.org/pipermail/openlayers-users/attachments/20111123/0a5bac51/attachment-0001.html