How I can display icon from GeoRSS?

Antonn_a · ‎09-03-2013

Hello!

I read, that in GeoRSS file format maybe tag "<icon>", example:

<item>
       <pubDate>Tue Aug 27 12:28:43 UTC 2013</pubDate>
       <title>Organization Name</title>
       <description>Products, service etc.</description>
       <icon>http://icons.iconarchive.com/icons/icons-land/transport/48/TruckMountedCrane-icon.png</icon>
       <link>Feed URL</link>
       <geo:lat>0.812089</geo:lat>
       <geo:long>0.576816</geo:long>
     </item>

How I can display icons from GeoRSS file into ArcGIS web maps?
I use next Javascript+HTML code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title></title>

<link rel="stylesheet" href="http://js.arcgis.com/3.6/js/dojo/dijit/themes/tundra/tundra.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.6/js/esri/css/esri.css">
<style>
  html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
  #map { height: 100%; margin: 0; padding: 0; }
  #meta {
    position: absolute;
    left: 20px;
    bottom: 20px;
    width: 20em;
    height: 5em;
    z-index: 40;
    background: #fff;
    color: #777;
    padding: 5px;
    border: 2px solid #666;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px; 
    font-family: arial;
    font-size: 0.9em;
  }
  #meta h3 {
    color: #666;
    font-size: 1.1em;
    padding: 0px;
    margin: 0px;
    display: inline-block;
  }
  #loading { 
    float: right;
  }
</style>

<script src="http://js.arcgis.com/3.6/"></script>
<script>
  var map;
  require([
    "esri/map", "esri/layers/GeoRSSLayer", "esri/InfoTemplate",
    "dojo/parser", "dojo/_base/array", "dojo/dom-style", 
    "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
  ], function(
    Map, GeoRSSLayer, InfoTemplate,
    parser, arrayUtils, domStyle
  ) {
    map = new esri.Map("map",{ 
      basemap: "streets", 
      center: [0.617761, 0.755773],
      zoom: 12
    });

    // create layout dijits
    parser.parse();

    var georssUrl = "add.xml";
    // other examples of GeoRSS feeds:
    // var georssUrl = "http://geocommons.com/overlays/188692.atom"; // U.S. Breweries in 2009 http://geocommons.com/overlays/188692
    // var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926
    var georss = new GeoRSSLayer(georssUrl); 
    georss.on("load", function() {
      domStyle.set("loading", "display", "none");
      // create an info template
      var template = new InfoTemplate("${name}", "${description}");
      // set the info template for the feature layers that make up the GeoRSS layer
      // the GeoRSS layer contains one feature layer for each geometry type
      var layers = georss.getFeatureLayers();
      arrayUtils.forEach(layers, function(l) {
        l.setInfoTemplate(template);
      });
    });
    map.addLayer(georss);
  });
</script>
</head>

<body class="tundra">
<div data-dojo-type="dijit/layout/BorderContainer" 
     data-dojo-props="design:'headline',gutters:false" 
     style="width: 100%; height: 100%; margin: 0;">
  <div id="map" 
       data-dojo-type="dijit/layout/ContentPane" 
       data-dojo-props="region:'center'"> 
    <div id="meta">
      <span id="loading"><img src="http://dl.dropbox.com/u/2654618/loading_black.gif" /></span>
      <h3>Display GeoRSS on a map</h3>
      <br>
      The map displays a simple GeoRSS file with points, lines and polygons. 
    <div>
  </div>
</div>
</body>
</html>

But on the webpage I see only standart green RSS icons, but not icons from GeoRSS file.
Please help me, suggest something to add in Javascript code, to icons will be showing.

DariusMott · ‎09-03-2013

Try defining a PictureMarkerSymbol and a SimpleRenderer just before you step through the arrayUtils.

var picRenderer = new PictureMarkerSymbol(${icon}, 16, 16);
var georssRenderer = new SimpleRenderer(picRenderer);
arrayUtils.forEach(layers, function(l) {
        l.setInfoTemplate(template);
        l.setRenderer(georssRenderer)
      });

Antonn_a · ‎09-03-2013

Unfortunately, does not work, that's part of the script, as I did the replacement. Correct it? But with this code at the entire map is not displayed.

    var georssUrl = "add.xml";
    // other examples of GeoRSS feeds:
    // var georssUrl = "http://geocommons.com/overlays/188692.atom"; // U.S. Breweries in 2009 http://geocommons.com/overlays/188692
    // var georssUrl = "http://geocommons.com/overlays/116926.atom"; // S.F. and East Bay Breweries http://geocommons.com/overlays/116926
    var georss = new GeoRSSLayer(georssUrl); 
    georss.on("load", function() {
      domStyle.set("loading", "display", "none");
      // create an info template
      var template = new InfoTemplate("${name}", "${description}");
      // set the info template for the feature layers that make up the GeoRSS layer
      // the GeoRSS layer contains one feature layer for each geometry type
      var layers = georss.getFeatureLayers();
var picRenderer = new PictureMarkerSymbol(${icon}, 16, 16);
 var georssRenderer = new SimpleRenderer(picRenderer); 
 arrayUtils.forEach(layers, function(l) {
 l.setInfoTemplate(template);
 l.setRenderer(georssRenderer)
 });
    });
    map.addLayer(georss);
  });
</script>
</head>

DariusMott · ‎09-05-2013

I think there may be an error in the code I posted for you to try... I forgot to add the " " around the ${icon}.

So, try changing that line to this:

var picRenderer = new PictureMarkerSymbol("${icon}", 16, 16);

Antonn_a · ‎09-05-2013

Okay, I added " ", web maps is loading. But all icons from .xml (GeoRSS) on the map not display. Also without tag "<icon>" is not display. I.e. the map is empty. Just web maps without GeoRSS information. What do? Maybe exist another JavaScript code for custom icons on the ArcGIS map?

Antonn_a · ‎09-09-2013

Okay, I added " ", web maps is loading. But all icons from .xml (GeoRSS) on the map not display. Also without tag "<icon>" is not display. I.e. the map is empty. Just web maps without GeoRSS information. What do? Maybe exist another JavaScript code for custom icons on the ArcGIS map?

Nobody knows?