Le portail francophone de la géomatique

abdoudiouck · Mon 09 September 2013 17:12

Bonjour
J'ai appelé un TMS à partir de Leaflet avec une projection cc 3948 et ça marche très bien

Voici mon problème
J'essaye de consommer du TMS en 2154 mais j ai des problèmes de superpositions liés à la projection
Est ce que vous avez déjà rencontrer ce problème et qu'elles sont les solutions qui peuvent résoudre ce problème.

Code:

 var options = {};
    options.continuousWorld = true;
    options.markerZoomAnimation = false;
    options.inertia = false;
    var map = L.map('map', options);
    
    // register the custom projection with Proj4JS
    Proj4js.defs['EPSG:2154'] = "+proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs";

    // create Transformation
    var transformation = new L.Transformation(1, -1318451.0, -1, 7198441.0);
    
    // set the CRS within Leaflet
    map.options.crs = L.CRS.proj4js("EPSG:2154", undefined, transformation);
    
    // resolutions
    var res = [53.97500000000001,6.987500000000004,16.192500000000003,8.096250000000001,6.746875000000001,4.048125000000001,2.6987500000000004,2.0240625000000003,1.3493750000000002,0.9445625000000001,0.6746875000000001,0.5397500000000001,0.4048125000000001,0.26987500000000003,0.13493750000000002];
    map.options.crs.scale = function (zoom) {
        return 1 / res[zoom];
    };
    
    var layerOptions = {};
    layerOptions.minZoom = 0;
    //layerOptions.maxZoom = res.length - 1;
    layerOptions.detectRetina = true;
    // if not set to true, will only load positive tiles
    layerOptions.continuousWorld = true;
    var tileLayer = new L.TileLayer('http://www.geo.rennesmetropole.fr/tms/4566/PVI_2154/{z}/{x}/{y}.png', layerOptions);
    // alter getTileUrl because Y axis is inverted (TMS profile is locale)
    tileLayer.getTileUrl = function (tilePoint, zoom) {
        console.log(tilePoint);
        var toRet;
        toRet = L.Util.template(this._url, L.Util.extend({
            "z":this._getZoomForUrl(),
            x:tilePoint.x,
            //y: Math.pow(2,zoom) - tilePoint.y -1
            y:-tilePoint.y - 1
        }, this._urlParams));
        return toRet;
    }
    map.addLayer(tileLayer);
    map.setView([48.1, -1.67], 2);
    
    var marker=new L.Marker(new L.LatLng(48.11, -1.67), {
      title: 'Je suis a Renes'
    });
    map.addLayer(marker);

Dernière modification par abdoudiouck (Mon 09 September 2013 17:17)

Fichier(s) joint(s) :
Pour accéder aux fichiers vous devez vous inscrire.

abdoudiouck · Thu 12 September 2013 10:16

Problème résolu : défaut de résolution et zoom trop éloigné
Pour je le laisse qu'en même pour les autres

Code:

<html>
<head> 
   
<script src="http://leaflet.cloudmade.com/dist/leaflet.js"></script>

<link rel="stylesheet" href="http://muurain.net/maps/lib/leaflet/leaflet.css" />
    <script src="http://muurain.net/maps/lib/leaflet/leaflet-src.js"></script>
    
   <script src="http://thematicmapping.org/playground/terrain/map/lib/proj4js-compressed.js"></script>
    <script src="http://thematicmapping.org/playground/terrain/map/lib/proj4leaflet.js"></script>

 
</div>
    <style>
html, body {
  height: 100%;
  padding: 0;
  margin: 0;
}

#map {
  position: absolute;
  width: 100%;
  height: 100%;
}
    </style>
    
  </head>
  <body>
 <div id='map'>
    
    <script>

   var options = {};
options.continuousWorld = true;
options.markerZoomAnimation = false;
options.inertia = false;
var map = L.map('map', options);

// register the custom projection with Proj4JS
Proj4js.defs['EPSG:2154'] = "+proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs";

// create Transformation
var transformation = new L.Transformation(1, -319831.53125, -1, 6757812.0);


// set the CRS within Leaflet
map.options.crs = L.CRS.proj4js("EPSG:2154", undefined, transformation);


// resolutions

var res = [156543.033928,78271.516964,39135.758482,19567.879241,9783.939621,4891.96981,2445.984905,1222.992453,611.496226,305.748113,152.874057,76.437028,38.218514,19.109257,9.554629,4.777314,2.388657,1.194329];
map.options.crs.scale = function (zoom) {
    return 1 / res[zoom];
};


var layerOptions = {};
layerOptions.minZoom = 0;
//layerOptions.maxZoom = res.length - 1;
layerOptions.detectRetina = true;
// if not set to true, will only load positive tiles
layerOptions.continuousWorld = true;
var tileLayer = new L.TileLayer('http://votre_tms_en_2154/{z}/{x}/{y}.png', layerOptions);
// alter getTileUrl because Y axis is inverted (TMS profile is locale)
tileLayer.getTileUrl = function (tilePoint, zoom) {
    console.log(tilePoint);
    var toRet;
    toRet = L.Util.template(this._url, L.Util.extend({
        "z":this._getZoomForUrl(),
        x:tilePoint.x,
        //y: Math.pow(2,zoom) - tilePoint.y -1
        y:-tilePoint.y - 1
    }, this._urlParams));
    return toRet;
}
map.addLayer(tileLayer);
map.setView([48.1, -1.67], 12);


var marker=new L.Marker(new L.LatLng(48.11, -1.67), {
  title: 'Je suis a Rennes'
});
map.addLayer(marker);

 

    </script> 
    
  </body>
  </html>

Communauté	Ressources	L'emploi	Le marché	L'association	Fils RSS
Forum Blogs Wiki Planet Sites amis	Agenda Biblio Fiches AMO-CNIG Paris PCGIS Téléchargements	Offres d'emploi Banque de CV Formations Démarche Métiers	Geo-Entreprises Geo-Communiqué Appels d'offres	L'association Qui sommes-nous ? Nous aider Bienfaiteurs Partenaires Historique Statuts	Tout le site Job Géomatique Services GeoBlogs ...	Faire un don Mentions légales

Le portail francophone de la géomatique

Annonce

#1 Mon 09 September 2013 17:12

Leaflet Reprojection TMS

Code:

#2 Thu 12 September 2013 10:16

Re: Leaflet Reprojection TMS

Code:

Pied de page des forums