Display Image from SQL in popup

[JohnPreston]

Hi I'm trying to display an image in a popup similar to the example https://developers.arcgis.com/javascript/jssamples/layers_point_clustering.html except the images are retrieved through a handler from SQL server.

Here is code to get date for template, can I use a URL to get image? (see bold/underline)

  photoInfo.data = arrayUtils.map(obj, function (p) {
                      photocnt += 1;
                      var rec = p.split(";");
                      var latlng = new Point(parseFloat(rec[2]), parseFloat(rec[3]), wgs);
                      var webMercator = webMercatorUtils.geographicToWebMercator(latlng);
                      var attributes = {
                          "ID": rec[0],
                          "MaintDate": rec[1],
                          "FacilityType": rec[4],
                         "Image": "GetImageHandler.ashx?signid=" + rec[0]
                      };
                      return {
                          "x": webMercator.x,
                          "y": webMercator.y,
                          "attributes": attributes
                      };
                  });


Here is popup template...

var popupTemplate = PopupTemplate({
                      "title": "",
                      "fieldInfos": [{
                          "fieldName": "ID",
                          visible: true
                      }, {
                          "fieldName": "MaintDate",
                          "label": "Date",
                          visible: true
                      }, {
                          "fieldName": "FacilityType",
                          "label": "Facility",
                          visible: true
                      }],
                      "mediaInfos": [{
                          "title": "",
                          "caption": "",
                          "type": "image",
                          "value": {
                              "sourceURL": "{Image}"
                          }
                      }]


                  });

[JohnPreston · Accepted solution]

I got it...

photoInfo.data = arrayUtils.map(obj, function (p) {
                      photocnt += 1;
                      var rec = p.split(";");
                      var latlng = new Point(parseFloat(rec[2]), parseFloat(rec[3]), wgs);
                      var webMercator = webMercatorUtils.geographicToWebMercator(latlng);
                      var attributes = {
                          "ID": rec[0],
                          "MaintDate": rec[1],
                          "FacilityType": rec[4]
                      };
                      return {
                          "x": webMercator.x,
                          "y": webMercator.y,
                          "attributes": attributes
                      };
                  });


                  // popupTemplate to work with attributes specific to this dataset
                  var popupTemplate = PopupTemplate({
                      "title": "",
                      "fieldInfos": [{
                          "fieldName": "ID",
                          visible: true
                      }, {
                          "fieldName": "MaintDate",
                          "label": "Date",
                          visible: true
                      }, {
                          "fieldName": "FacilityType",
                          "label": "Facility",
                          visible: true
                      }],
                      "mediaInfos": [{
                          "title": "",
                          "caption": "",
                          "type": "image",
                          "value": {
                              "sourceURL": "SWUGetImageHandler.ashx?maintid=" + '{ID}'
                          }
                      }]
                  });