mbarto
commented
6 years ago Hi @danabit , can you please attach an example of HTML including the embedded MS2 map?
Closed danabit closed 4 years ago
mbarto
commented
6 years ago Hi @danabit , can you please attach an example of HTML including the embedded MS2 map?
danabit
commented
6 years ago <html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Page with MapStore API</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway" type='text/css'>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.2/leaflet.draw.css" />
<link rel="shortcut icon" type="image/png" href="https://cdn.jslibs.mapstore2.geo-solutions.it/leaflet/favicon.ico" />
<script src="https://maps.google.com/maps/api/js?v=3"></script>
<!--script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.10/proj4.js"></script-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.1/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.2/leaflet.draw.js"></script>
<style>
#container {
position: absolute;
top: 100px;
left: 100px;
right: 100px;
bottom: 100px;
}
#mapstore2-embedded, #map, .fill {
width: 100%;
height: 100%;
}
</style>
</head>
<body onload="init()">
<div id="container" class="ms2"></div>
<script id="ms2-api" src="http://localhost:8081/dist/ms2-api.js"></script>
<script type="text/javascript">
function init() {
MapStore2.create('container',{
configUrl: "http://localhost:8081/rest/geostore/data/65",
originalUrl: "http://localhost:8081/#/viewer/openlayers/65"
});
}
</script>
</body>
</html>
This is the code that i took here:
However, i think it is a problem with the oldest stable version of Mapstore2 (2018.02.00). Another problem that i met with this version is that i can't use Openlayers maptype in Embedded mode. In the older version (like 2018.01.00) Openlayers maptype worked perfectly using the right properties in html and the right inclusions (if you need i can write an example of an older html page that i made with Openlayers maptype and that it worked correctly, but i think that is another issue). If it can be helpful, i saw that default.css charged in this new version of Mapstore2 is not equal to the older default.css and i think that the Api is not equal too (I mean in the part of code used by the embedded mode).
danabit
commented
6 years ago Have you some solutions about the issue that I posted? However, with the previous version of Mapstore2 (2018.01.00) the problem doesn't appear, but I need the lastest version of the app. Another problem with 2018.01.00 version is that the code working just if I use the include of the needed files in first part of html page. If I use the requireJS in another file (js) the Map doesn't appear. I think that it is the same problem with timing of the calls of the files included. In my project I can't call the needed files in the html page.
mbarto
commented
6 years ago Hi. I reproduced your issue, but I have still not found a fix for it. We are working on it.
tdipisa
commented
4 years ago closed for inactivity.
Description
When it is the first time that we use Mapstore2 embedded in a html page (using Mapstore2 API), the "container" div where it should be the map, doesn't show the map correctly (it appears like an grey rectangle just for a second and after the conteiner become white). If we recharge the page the problem doesn't appear again. But if we clean the cache and we try to recharge the page the problem appears again. The problem appears also if we use a browser in Private Mode.
Browser Affected
[x] Chrome
[x] Firefox
[x] Internet Explorer
Steps to reproduce
Expected Result
Current Result