AnsweredAssumed Answered

What's the best way to incorporate featureLayers and infoWindow tags in my printout?

Question asked by schlot on Jul 25, 2014

There's not much discussion I can find about this, but I assume since featureLayer is renderer more on the client, it's not included when you use printTask for an ExportWebMapTask?  It also sounds like I'm not going to be able to print the infoWindow tag if there is one either.  Has anyone come up with a solution they're happy with?  I have something, but I'm not very satisfied with it. 

 

I have created a graphicsLayer, thinking I could add some graphics and a textSymbol containing what's in the inforWindow.  I'm also adding my featureLayer as an ArcGISDynamicMapServiceLayer just long enough to have something to print.  I captured the clicked point on the map.infoWindow.show event so I have a place to add a text symbol.

 

function submitMapPrint() {
    var printTitle = registry.byId("txtTitle").get("value");
     if (printTitle.length < 1) {
        printTitle = "Sample FeatureLayer Print";
     }   
    var printParams = new PrintParameters();
    printParams.map = map;
    dom.byId("printStatus").innerHTML ="Generating ..." ;
  //  status.innerHTML = "Generating ...";
    var e = registry.byId("templateSelect");
    var choice = e.value;
    printTemplate = templates[0];
      switch (e.value){
          case "Portrait":
          printTemplate  = templates[1];
          break;
          case "Landscape":  
          printTemplate  = templates[0];     
          break;
          default:
          printTemplate  = templates[0];
      }  
    printParams.template = printTemplate;
    printTemplate.layoutOptions.titleText = printTitle;  
       showLoading();
    createPrintGraphics();

    on(map, 'layers-add-result', function (){
             showLoading();
     pointLayer.clearSelection();
    var printTask = new PrintTask(printServiceUrl);
    printTask.on('complete', printTaskHandler);
    printTask.execute(printParams);
    printTask.on('error', function (err){
      console.log("error in printTask: " + err.error);
      dom.byId("printStatus").innerHTML ="Error generating printout, try again." ;
    });

    });

}
function printTaskHandler(results) {
  var d = new Date();
        var dateTime =  d.getTime(); 
        var outputUrl = results.result.url + '?time=' + dateTime;  
        dom.byId("printStatus").innerHTML = "";       
        var select = registry.byId("templateSelect");
        var selectOptions = select.getOptions();
        select.set("value", "Choose Print Format");    
        removePrintGraphics();
          hideLoading();
         window.open(outputUrl,"_blank");
}
function createPrintGraphics(){
  popup.clearFeatures();
  map.infoWindow.hide();
   var len = pointLayer.url.length -2;
     var pointUrl = pointLayer.url.substr(0, len);
     printLayer = new ArcGISDynamicMapServiceLayer(pointUrl, {
           id: "printLayer"       
       });

       var font = new Font(
            "11pt",
            Font.STYLE_NORMAL, 
            Font.VARIANT_NORMAL,
            "Helvetica"
          );  
       var text = br2nl(printTag);   
        var textSymbol = new TextSymbol(
          text,
          font,
          new Color("#00000")
        );
    var pt = clickPt.offset(1000, 10000);
    printTextLayer.add(new Graphic(pt, textSymbol));
    var printGraphic = new Graphic(clickPt, symbol);
    printTextLayer.add(printGraphic);
    map.addLayers([printLayer]);

}
function removePrintGraphics() {
  printTextLayer.clear();
map.removeLayer(printLayer);
}
function br2nl(str) {
  var newStr = str.replace(/<br\s*\/?>/mg,"\n");
   // return str.replace(/<br\s*\/?>/mg,"\n");
   newStr = newStr.replace(/<\s*\/?br>/mg, "\n") 
   newStr = newStr.replace(/<b\s*\/?>/mg,"");
   newStr = newStr.replace(/<\s*\/?b>/mg, "") 

    return newStr;
}
//functions for managing the status icon
    function showLoading() {
      domUtils.show(loading);
      map.disableMapNavigation();
      map.hideZoomSlider();
    }

    function hideLoading(error) {
      domUtils.hide(loading);
      map.enableMapNavigation();
      map.showZoomSlider();
    }


This gives me a piece of text on my map, which looks pretty klunky compared to a formatted infoWindow.  Of course I'm now missing my nice pin markersymbols too, since the map service has a plain red circle originally.  Am I missing something obvious?  Is there a better way to do this?

Outcomes