Bonjour à tous,
J'avais réalisé il y a 6 mois environ un brouillon d'article sur mon blog Wordpress où j'avais mis une carte en utilisant l'API Géoportail (en utilisant le plugin "Raw html").
Bon, c'était le bonheur ! J'avais ce que je voulais : Une carte dynamique parfaite.
Je reviens récemment sur mon brouillon, en vue d'appliquer le procédé sur des articles publiés de mon blog, et oh surprise ! L'affichage ne se fait plus correctement : La carte apparait striée de bandes blanches verticales.
A noter que je n'ai RIEN changé dans le code ! A noter aussi que le code, testé "hors Wordpress" en localhost, fonctionne toujours parfaitement !
Ce n'est donc pas un problème de code html ni javascript ... Je précise aussi que mon Wordpress a assez de mémoire : Mémoire utilisée 42.95 MB, Mémoire limite : 128 MB
Si quelqu'un a une idée ?
PS : J'ai aussi essayé, du coup, d'utiliser le (médiocre) plugin "Geoportail Shortcode" : Même résultat : mêmes bandes blanches verticales !
======================
[raw]
<!DOCTYPE html>
<html>
<head>
<title>Essai 02</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css"><!--/*--><![CDATA[/*><!--*/
div#viewerContainer {
width:600px;
height:400px
}
h1 {
font-size:25px;
font-weight:bold;
font-family: sans-serif;
}
/*]]>*/--></style>
</head>
<body>
<h1 id="title">Essai 02</h1>
<div id="viewerContainer"></div>
<script type="text/javascript"><!--//--><![CDATA[//><!--
/**
* Property: iViewer
* {<Geoportal.InterfaceViewer>} The Geoportal API viewer interface.
*/
iViewer= null;
/**
* Function: init
* Load the map. Called when "onload" event is fired.
*/
function init() {
iViewer= Geoportal.load(
// map's div id - identifiant de la div de la carte :
"viewerContainer",
// API's keys - clefs API :
["ma clé A JOUR de license gratuite pour l'API Geoportail"],
{
// center in WGS84G - centre en WGS84G
lon:6.800681349904434,
lat:45.521178078454874
},
// zoom level (0-20) - niveau de zooms (0 à 20) :
14,
{ // various options :
loadTheme: function() {
Geoportal.Util.setTheme("geoportal3");
Geoportal.Util.loadCSS("http://api.ign.fr/geoportail/api/js/2.0.3/theme/geoportal3/style.css","__GeoportalBlackCss__","");
if (OpenLayers.Util.alphaHack()) {
Geoportal.Util.loadCSS("http://api.ign.fr/geoportail/api/js/2.0.3/theme/geoportal3/ie6-style.css","__IE6GeoportalBlackCss__","");
}
},
// viewer default controls options overloads :
componentsOptions:{},
// Geoportal's layers to load (when none, all contracts' layers are loaded) :
layers:["GEOGRAPHICALGRIDSYSTEMS.MAPS:WMTS","CADASTRALPARCELS.PARCELS:WMTS","ORTHOIMAGERY.ORTHOPHOTOS:WMTS"],
// Geoportal's layers options :
layersOptions:{"GEOGRAPHICALGRIDSYSTEMS.MAPS:WMTS":{"opacity":0.3,"visibility":true},"CADASTRALPARCELS.PARCELS:WMTS":{"opacity":1,"visibility":false},"ORTHOIMAGERY.ORTHOPHOTOS:WMTS":{"opacity":1,"visibility":true}},
overlays:{},
// callback to use before returning (after centering) :
onView:function() {viewer=iViewer.getViewer();
//Ajout du contrôle d'impression
var nv= viewer.getMap().getControlsByClass("Geoportal.Control.NavToolbar")[0];
nv.addControls([new Geoportal.Control.PrintMap()]);
var measurebar= new Geoportal.Control.MeasureToolbar({
div: OpenLayers.Util.getElement(tbx.id+"_measure"),
displaySystemviewer.getMap().getProjection().getProjName()=="longlat"?"geographic":"metric"),
targetElement: OpenLayers.Util.getElement(tbx.id+"_meares")
});
viewer.getMap().addControl(measurebar);
viewer.getMap().getControlsByClass("Geoportal.Control.MeasureToolbar")[0].controls[2].deactivate;
viewer.getMap().getControlsByClass("Geoportal.Control.MeasureToolbar")[0].controls[2].div.style.display="none";
},
// class of viewer to use :
viewerClass:"Geoportal.Viewer.Default"
}
);
}
window.onload= init;
//--><!]]></script>
<script type="text/javascript" charset="utf-8" src="http://api.ign.fr/geoportail/api/js/latest/GeoportalExtended.js"><!--//--><![CDATA[//><!--
//--><!]]></script>
</body>
</html>
[/raw]
=======================================
J'avais réalisé il y a 6 mois environ un brouillon d'article sur mon blog Wordpress où j'avais mis une carte en utilisant l'API Géoportail (en utilisant le plugin "Raw html").
Bon, c'était le bonheur ! J'avais ce que je voulais : Une carte dynamique parfaite.
Je reviens récemment sur mon brouillon, en vue d'appliquer le procédé sur des articles publiés de mon blog, et oh surprise ! L'affichage ne se fait plus correctement : La carte apparait striée de bandes blanches verticales.
A noter que je n'ai RIEN changé dans le code ! A noter aussi que le code, testé "hors Wordpress" en localhost, fonctionne toujours parfaitement !
Ce n'est donc pas un problème de code html ni javascript ... Je précise aussi que mon Wordpress a assez de mémoire : Mémoire utilisée 42.95 MB, Mémoire limite : 128 MB
Si quelqu'un a une idée ?
PS : J'ai aussi essayé, du coup, d'utiliser le (médiocre) plugin "Geoportail Shortcode" : Même résultat : mêmes bandes blanches verticales !
======================
[raw]
<!DOCTYPE html>
<html>
<head>
<title>Essai 02</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css"><!--/*--><![CDATA[/*><!--*/
div#viewerContainer {
width:600px;
height:400px
}
h1 {
font-size:25px;
font-weight:bold;
font-family: sans-serif;
}
/*]]>*/--></style>
</head>
<body>
<h1 id="title">Essai 02</h1>
<div id="viewerContainer"></div>
<script type="text/javascript"><!--//--><![CDATA[//><!--
/**
* Property: iViewer
* {<Geoportal.InterfaceViewer>} The Geoportal API viewer interface.
*/
iViewer= null;
/**
* Function: init
* Load the map. Called when "onload" event is fired.
*/
function init() {
iViewer= Geoportal.load(
// map's div id - identifiant de la div de la carte :
"viewerContainer",
// API's keys - clefs API :
["ma clé A JOUR de license gratuite pour l'API Geoportail"],
{
// center in WGS84G - centre en WGS84G
lon:6.800681349904434,
lat:45.521178078454874
},
// zoom level (0-20) - niveau de zooms (0 à 20) :
14,
{ // various options :
loadTheme: function() {
Geoportal.Util.setTheme("geoportal3");
Geoportal.Util.loadCSS("http://api.ign.fr/geoportail/api/js/2.0.3/theme/geoportal3/style.css","__GeoportalBlackCss__","");
if (OpenLayers.Util.alphaHack()) {
Geoportal.Util.loadCSS("http://api.ign.fr/geoportail/api/js/2.0.3/theme/geoportal3/ie6-style.css","__IE6GeoportalBlackCss__","");
}
},
// viewer default controls options overloads :
componentsOptions:{},
// Geoportal's layers to load (when none, all contracts' layers are loaded) :
layers:["GEOGRAPHICALGRIDSYSTEMS.MAPS:WMTS","CADASTRALPARCELS.PARCELS:WMTS","ORTHOIMAGERY.ORTHOPHOTOS:WMTS"],
// Geoportal's layers options :
layersOptions:{"GEOGRAPHICALGRIDSYSTEMS.MAPS:WMTS":{"opacity":0.3,"visibility":true},"CADASTRALPARCELS.PARCELS:WMTS":{"opacity":1,"visibility":false},"ORTHOIMAGERY.ORTHOPHOTOS:WMTS":{"opacity":1,"visibility":true}},
overlays:{},
// callback to use before returning (after centering) :
onView:function() {viewer=iViewer.getViewer();
//Ajout du contrôle d'impression
var nv= viewer.getMap().getControlsByClass("Geoportal.Control.NavToolbar")[0];
nv.addControls([new Geoportal.Control.PrintMap()]);
var measurebar= new Geoportal.Control.MeasureToolbar({
div: OpenLayers.Util.getElement(tbx.id+"_measure"),
displaySystemviewer.getMap().getProjection().getProjName()=="longlat"?"geographic":"metric"),
targetElement: OpenLayers.Util.getElement(tbx.id+"_meares")
});
viewer.getMap().addControl(measurebar);
viewer.getMap().getControlsByClass("Geoportal.Control.MeasureToolbar")[0].controls[2].deactivate;
viewer.getMap().getControlsByClass("Geoportal.Control.MeasureToolbar")[0].controls[2].div.style.display="none";
},
// class of viewer to use :
viewerClass:"Geoportal.Viewer.Default"
}
);
}
window.onload= init;
//--><!]]></script>
<script type="text/javascript" charset="utf-8" src="http://api.ign.fr/geoportail/api/js/latest/GeoportalExtended.js"><!--//--><![CDATA[//><!--
//--><!]]></script>
</body>
</html>
[/raw]
=======================================
