Flickr API on Story maps

NicoleDe_La_Feld — Fri, 21 Feb 2014 09:15:33 GMT

Hi, I am integrating Flickr API to my MapTour Story map.
I found this example here and I managed to see all photos on the map.
The problem is that I can't open Popups to see details for Photos as they do. I click and nothing happens. Why that?
The only difference in my code is the creation of the map.
Here is the code for the map:

function loadWebMap(webmapIdOrJSON) {  console.log("maptour.core.Core - loadWebMap - webmapId:", webmapIdOrJSON);      arcgisUtils.createMap(webmapIdOrJSON, "mainMap", {   mapOptions: {    slider: true,    autoResize: false,    // Force the web map extent to the world to get all data from the FS    extent : new Extent({     xmax: 180,     xmin: -180,     ymax: 90,     ymin: -90,     spatialReference: {      wkid:4326     }    }),    showAttribution: true   },   ignorePopups: true,   bingMapsKey: commonConfig.bingMapsKey  }).then(   lang.hitch(this, function(response){    webMapInitCallback(response);   }),   lang.hitch(this, function(){    initError("createMap");   })  );   }

here is the callback for the map:

function webMapInitCallback(response) {  console.log("maptour.core.Core - webMapInitCallback");      if( configOptions.authorizedOwners && configOptions.authorizedOwners.length > 0 && configOptions.authorizedOwners[0] ) {   var ownerFound = false;        if( response.itemInfo.item.owner )     ownerFound = $.inArray(response.itemInfo.item.owner, configOptions.authorizedOwners) != -1;        if (!ownerFound) {    initError("invalidConfigOwner");    return;   }  }      app.map = response.map;  app.data.setWebMapItem(response.itemInfo);      app.map.disableKeyboardNavigation();   // Initialize header  // Title/subtitle are the first valid string from: index.html config object, web application data, web map data  var title = configOptions.title || WebApplicationData.getTitle() || response.itemInfo.item.title;  var subtitle = configOptions.subtitle || WebApplicationData.getSubtitle() || response.itemInfo.item.snippet;      applyUILayout(WebApplicationData.getLayout() || configOptions.layout);   var urlParams = Helper.getUrlParams();  var appColors = WebApplicationData.getColors();  var logoURL = WebApplicationData.getLogoURL() || APPCFG.HEADER_LOGO_URL;  var logoTarget = (logoURL == APPCFG.HEADER_LOGO_URL) ? APPCFG.HEADER_LOGO_TARGET : WebApplicationData.getLogoTarget();      app.header.init(   ! app.isInBuilderMode && (APPCFG.EMBED || urlParams.embed || urlParams.embed === ''),   title,   subtitle,   appColors[0],   logoURL,   logoTarget,   ! app.isInBuilderMode && (    (! isProd() && Helper.getAppID(isProd()))    || isProd() && app.data.userIsAppOwner()),   WebApplicationData.getHeaderLinkText() === undefined ? APPCFG.HEADER_LINK_TEXT : WebApplicationData.getHeaderLinkText(),   WebApplicationData.getHeaderLinkURL() === undefined ? APPCFG.HEADER_LINK_URL : WebApplicationData.getHeaderLinkURL(),   WebApplicationData.getSocial()  );  document.title = title ? $('<div>' + title + '</div>').text() : 'Map Tour';      _mainView.webmapLoaded();  //------------------here is were I call the function for Flickr----------------------  dojo.connect(app.map,"onLoad",loadPhotos("Lakes")); }

And here is the code for Flickr:

window.loadPhotos = function loadPhotos(key) {         var flickrPhotos = esri.request({           url: "http://api.flickr.com/services/feeds/geo",           content:{               format:"json",               tagmode: "any",               tags: key           },           callbackParamName: "jsoncallback"         });         flickrPhotos.then(addPhotos);      };        function addPhotos(data){              app.map.graphics.clear();       var symbol = new esri.symbol.PictureMarkerSymbol("http://dl.dropbox.com/u/52777651/flickr.png", 24, 24);         var template = new PopupTemplate ({            title: "{title}",            description:"{description}"         });          dojo.forEach(data.items, function(item){            var loc = new esri.geometry.Point(item.longitude, item.latitude);            app.map.graphics.add(new esri.Graphic(loc, symbol, item, template));                                });  }

Re: Flickr API on Story maps

NicoleDe_La_Feld — Sun, 12 Dec 2021 16:23:53 GMT

I did it!

Here was the problem:

arcgisUtils.createMap(webmapIdOrJSON, "mainMap", {
  mapOptions: {
   slider: true,
   autoResize: false,
   // Force the web map extent to the world to get all data from the FS
   extent : new Extent({
    xmax: 180,
    xmin: -180,
    ymax: 90,
    ymin: -90,
    spatialReference: {
     wkid:4326
    }
   }),
   showAttribution: true
  },
  ignorePopups: true,
  bingMapsKey: commonConfig.bingMapsKey
 }).then(
  lang.hitch(this, function(response){
   webMapInitCallback(response);
  }),
  lang.hitch(this, function(){
   initError("createMap");
  })
 );

topic Flickr API on Story maps in ArcGIS JavaScript Maps SDK Questions

Flickr API on Story maps

Re: Flickr API on Story maps