Veuillez me pardonner si c'est très simple, mais je ne suis pas en mesure de trouver le travail pour résoudre le problème. J'essaie d'ouvrir la carte ESRI dans un modal bootstrap. Sur la première fois il ne charge pas la carte (dans la console je vois l'erreur "require is not defined") mais la deuxième fois cela fonctionne très bien. Si j'ouvre la carte dans une fenêtre séparée, cela fonctionne aussi bien à chaque fois.Bootstrap modal require n'est pas défini pour la carte du serveur ArcGIS
Mon vue partielle ressemble suivant:
@{
<link rel="stylesheet" href="https://js.arcgis.com/3.21/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.21/esri/css/esri.css">
<script src="https://js.arcgis.com/3.21/"></script>
<script>
var map;
require([
"esri/map",
"dojo/parser",
"dojo/domReady!"
],
function (
Map,
parser
)
{
parser.parse();
map = new Map("map", {
basemap: "streets",
center: [5.79, 50.97], // lon, lat
zoom: 16,
slider: false
});
});
</script>
}
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h4>DrawProjectLocation</h4>
</div>
<div class="modal-body">
<div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%; height:100%;">
<div id="map" class="roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
</div>
<div id="footer" class="roundedCorners" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'">
<div id="editorDiv"></div>
</div>
</div>
</div>
<div class="modal-footer">
<span id="info" style="position:absolute; left:15px; bottom:15px; color:#000; z-index:100"></span>
<button type="submit" class="btn btn-success" id="submitButton">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
J'ai essayé d'inclure require.js à mon avis partiel, mais il n'a pas aidé. Quelqu'un peut-il me dire ce qui ne va pas ici? Merci!!
Une idée gars: O –
On dirait que votre script 'require' vient après le script ci-dessus dans le code HTML. Vérifiez la source de la page et assurez-vous qu'elle vient avant ce code, ou enveloppez le code ci-dessus dans un événement onload (ou similaire) –