POST
|
Hey Everyone, I have hit a road block when trying to use the Dojo Loader instead of require.js to build a backbone.marionette map application. I have looked through the forums, and used this (https://github.com/odoe/ags30sample) as an example. This issue I am running into seems to be the way the scripts are loading. 90% of the time, the app fails to start with the following error: ReferenceError: Backbone is not defined TypeError: Backbone.Marionette is undefined The strange thing is, that sometimes the app does start. I can watch the http requests in fiddler, and they are being accessed in the correct order and loaded at the correct time. I was hoping you all could take a look, and explain if I am missing something. Any help would be greatly appreciated. I am new to modular and amd design, but have completed a few non map applications using require.js backbone and marionette index.html <script type="text/javascript" src="http://js.arcgis.com/3.8/"></script> <script type='text/javascript' src='./Client/js/app_config.js'></script> app_config.js (function () { require({ async: true, parseOnLoad: true, aliases: [["text", "dojo/text"]], packages: [ { name: "jquery", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js/vendor", main: "jquery" }, { name: "bootstrap", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js/vendor", main: "bootstrap.min" }, { name: "underscore", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js/vendor", main: "underscore" }, { name: "backbone", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js/vendor", main: "backbone" }, { name: "marionette", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js/vendor", main: "backbone.marionette" }, { name: "app", location: location.pathname.replace(/\/[^/]+$/, "") + "/Client/js" } ] }); define.amd.jQuery = true; require(['jquery', 'app/app_main'], function ($, MapManager) { $(document).ready(function () { alert("here"); MapManager.start(); }); }); }).call(this); app_main.js define(["jquery", "underscore", "backbone", "marionette"], function ($, _, Backbone, Marionette) { var MapManager = new Backbone.Marionette.Application(); MapManager.addRegions({ headerRegion: "#header-region", mainRegion: "#map-container", }); //After the Main application has started, startup the application views MapManager.on("initialize:after", function () { console.log("Marionette App started"); }); return MapManager; });
... View more
02-07-2014
06:14 AM
|
0
|
0
|
1199
|
POST
|
Ok guys, just in case anyone else ever has this problem, here is how I solved it. 1.) I attached an onUpdaetEnd event to my cached map layer. dojo.connect(map, "onUpdateEnd", addDynamicLayers); 2.) I created a function that checked if this was the initial application load, then added the dynamic maps on top function addDynamicLayers() { if (isFirstRun) { map.addLayers([dynamicMapServiceLayer, poiMapServiceLayer]); isFirstRun = false; } } Previously I added all layers at the same time in my init function as follows. map.addLayers([cachedMapServiceLayer, dynamicMapServiceLayer, poiMapServiceLayer]); Because I was resizing the map after the dynamic layers were already added, it caused them to make unnecessary calls back to the server for the same image at load time. So basically I just decided to add the dynamic layers after the cached map was fully updated and drawn. This prevented them from re-requesting images. I hope that makes sense. Thanks Eddie
... View more
10-10-2013
04:48 AM
|
0
|
0
|
298
|
POST
|
I have narrowed the issue down to my custom resize map function. Because I am developing for mobile, I am resizing the map div after I determine device and screen size. I then call map.resize(); map.reposition(); to resize and position the map. This is where the multiple calls occur. The question I have now is, how do I determine when these two methods are finished? I tried adding a callback function to the resize map function that contains these two function calls, but that does not work. Is there an event or callback available for these functions? If not, how do I determine when the map is finished being resized and positioned. Thanks Eddie
... View more
10-09-2013
08:02 AM
|
0
|
0
|
298
|
POST
|
Hey all, I have been tracking an issue at initial application load. When I add my dynamic map layer, it is making the exact same image call to the server twice consecutively. This only happens on the initial load of the map, when the layer is added. After that, the map calls are made as expected, which would be one image call per pan or zoom. Has anyone experienced this? Does anyone know what could trigger another map image request, not including a pan and zoom action. I have attached a screenshot of the request happening real time in fiddler. I will past the full urls of the requests below as well. I would appreciate any assistance in tracking down what exactly is happening. Thanks Eddie 51 200 HTTP vzwmaptest.verizonwireless.com /ArcGIS/rest/services/VZW_MOBILE_COV/MapServer/export?dpi=96&transparent=true&format=PNG8&layers=show%3A20&bbox=-14782321.297432182%2C2739888.6794155603%2C-6436620.801145716%2C6956766.655851042&bboxSR=102100&imageSR=102100&size=853%2C431&f=image 23,971 max-age=86400 image/png firefox:6304 52 200 HTTP vzwmaptest.verizonwireless.com /ArcGIS/rest/services/VZW_MOBILE_COV/MapServer/export?dpi=96&transparent=true&format=PNG8&layers=show%3A20&bbox=-14782321.297432182%2C2739888.6794155594%2C-6436620.801145716%2C6956766.655851042&bboxSR=102100&imageSR=102100&size=853%2C431&f=image 23,971 max-age=86400 image/png firefox:6304
... View more
10-09-2013
04:49 AM
|
0
|
2
|
548
|
POST
|
hey guys, I did find my issue. I had an event attached to orientationchanged that was messing up the method that Jeff provided in his example. All is working fine now. I appreciate your patience and help. I changed the resize function up a bit with the same affect. function resizeMap() { if ($('#map-page:visible').length) { $('#map').height($(window).height() - $('#header').height()); map.resize(); map.reposition(); } } Thanks again Eddie
... View more
05-23-2013
05:26 AM
|
0
|
0
|
707
|
POST
|
Thanks for taking a look at this. I used your exact code, only with the compact framework, and am getting the same svg error. Could it be because I have a esri.Graphic on the map at the time the page changes. I have a mapped point with a Mobile Popup info template attached to it. I am trying to edit your example to include a mapped point. Unfortunately, I don't really understand how to include esri.symbol.PictureMarkerSymbol in the manner you are doing it. I will work on it and try to get an example working. Thanks again. Note: One quick addition. I attached this event to your map dojo.connect(map, "onResize", resizeTest); and had it alert the width and height on resize. Your map does not alert a width and height on your non map page. If I attach the same event to my map object, the onRisize event does fire and re-size the map to 0 0, regardless if I have the autoResize: false property set. I am using a different api then you though. I'm using esricompact 3.3, if that makes a difference
... View more
05-22-2013
09:15 AM
|
0
|
0
|
707
|
POST
|
Its going to be tough to post the exact example, because I am using a jquery mobile to do a page transition for mobile popup. So I had to make a minor modification to PopupMobile.js I did get the autoResize property to work. I believe it was a caching issue. Unfortunately even when autoResize is set to false, the map fails when it is hidden, the window is resized, and I browse back to the map. I am using the following: //map setup map = new esri.Map("map", { infoWindow: popup, zoom: zoomLevel, slider: true, sliderPosition: "bottom-left", extent: initExtent, autoResize: false }) //using bind maps bingMapServiceLayer = new esri.virtualearth.VETiledLayer({ bingMapsKey: bingMapKey, // trial (90 days) from https://www.bingmapsportal.com mapStyle: esri.virtualearth.VETiledLayer.MAP_STYLE_ROAD // can also use MAP_STYLE_AERIAL & MAP_STYLE_AERIAL_WITH_LABELS }); //I resize the map on initial load and on orientation change when visible with this function resizeMap() { $('#map').height($(window).height() - $('[data-role=header]').height()); map.resize(); } //The map fails when I return to the page with this in the console Unexpected value NaN parsing x attribute. Unexpected value NaN parsing y attribute. Unexpected value matrix(1.00000000,0.00000000,0.00000000,1.00000000,NaN,NaN) parsing transform attribute. Am I missing a step. Perhaps there is a better way to to resize that I am not using. Again, I appreciate all the help guys. I'm new to the map world
... View more
05-22-2013
02:54 AM
|
0
|
0
|
707
|
POST
|
Hey guys, I hate to drag this thread up from the dead, but I cannot get this solution to work. I was hoping someone could provide me with greater detail. The first thing I did was try to set autoResize to false, which does not seem to do anything at all. The map still re-sizes regardless of the setting. Does anyone happen to have a full example, or is anyone able to better explain this to me? Any help would be greatly appreciated. Thanks Eddie
... View more
05-21-2013
10:42 AM
|
0
|
0
|
731
|
POST
|
Ok that makes sense to me. I'll adjust as needed. Thanks for the quick reply. I appreciate the help.
... View more
04-25-2013
07:14 AM
|
0
|
0
|
498
|
POST
|
Using the 3.3 compact javascript library, I have had an issue using center and zoom when my basemap is dynamic. When it is cached, it seems to work correctly. Has anyone seen this before? var symbol = new esri.symbol.PictureMarkerSymbol('css/images/Pin.png', 32, 32); var point = esri.geometry.geographicToWebMercator(new esri.geometry.Point(attributes.long, attributes.lat)); var graphic = new esri.Graphic(point, symbol, attributes, infoTemplate); //Add to map and zoom map.graphics.add(graphic); map.centerAndZoom(point, 9); map.infoWindow.setFeatures([graphic]);
... View more
04-25-2013
06:28 AM
|
0
|
3
|
928
|
POST
|
Solved by adding this line at the bottom of the function: map.infoWindow.setFeatures([graphic]); Just in case anyone else has a similar problem
... View more
04-01-2013
08:06 AM
|
0
|
0
|
218
|
POST
|
Anyone? I have checked the examples and read the api. This seems like it should work. If I am missing something, can anyone let me know what it is. If there is a better way to do this, I am open to suggestions as well.
... View more
04-01-2013
05:01 AM
|
0
|
0
|
218
|
POST
|
Hi everyone. I am new to this, and have found most of it pretty straight forward, but am having a problem with this bit. I am using my own geocode process to map addresses. Once mapped, I am adding the graphic, and then centering and zooming. All of this works great. The issue I am having is displaying my point information with Popup Mobile. I have been successful using the infoWindow, and the Popup, but not popup mobile. Here is a snippet of my code. Hopefully you all can point me in the right direction. //Plot the point and center and zoom to location function MapAddress(data) { //Map Symobol pin map.graphics.clear(); var symbol = new esri.symbol.PictureMarkerSymbol('themes/images/Pin.png', 32, 32); //Popup template var attributes = { addressLine: data.GeoCodeResults[0].addressLine, city: data.GeoCodeResults[0].city + ", " + data.GeoCodeResults[0].state + " " + data.GeoCodeResults[0].zip, long: data.GeoCodeResults[0].location.longitude, lat: data.GeoCodeResults[0].location.latitude, matchMsg: data.GeoCodeResults[0].matchMsg }; //Using This for infoWindow var infoTemplate = new esri.InfoTemplate("Mapped Address", "Address: ${addressLine}<br />City, State: ${city} ${state} ${zip}<br />Longitude: ${long}<br />Latitude: ${lat}<br />Match Message: ${matchMsg}"); /* Regular Popup - This works when using esri.dijit.Popup var infoTemplate = new esri.dijit.PopupTemplate({ title: "Mapped Address", fieldInfos: [ { fieldName: "addressLine", visible: true, label: "Address:" }, { fieldName: "city", visible: true, label: "City, State:" }, { fieldName: "long", visible: true, label: "Longitude:" }, { fieldName: "lat", visible: true, label: "Latitude:" }, { fieldName: "matchMsg", visible: true, label: "Match:" } ], showAttachments: false });*/ //Build point to map point = esri.geometry.geographicToWebMercator(new esri.geometry.Point(data.GeoCodeResults[0].location.longitude, data.GeoCodeResults[0].location.latitude)); var graphic = new esri.Graphic(point, symbol, attributes, infoTemplate); //Add to map and zoom map.graphics.add(graphic); map.centerAndZoom(point, 12); }
... View more
03-28-2013
04:39 AM
|
0
|
2
|
534
|
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:24 AM
|