Export to PDF print dijit fails when printing with CSV layer on map

JordanPorter — Mon, 19 May 2014 14:54:19 GMT

Hi,

i am attempting to print a map with a csv layer with custom unique value renderer (picture marker symbols)

when i have this layer in the map, the print dijit fails, in Chrome logging

SyntaxError: Unexpected token <    at Object.b.fromJson (http://js.arcgis.com/3.9/init.js:226:310)

When i remove the CSV layer, it prints out fine.

here is the code in its entirety.

     
     

     CSVpath = "http://astro.ngacres.com/htmlemails/master/master/lburbank.csv";
 
 
 
     
     request(CSVpath).then(function(data){
                     lines = data.split(/\r?\n/);
                 }); 
     
     
     
                    var popup = new Popup({
                        popupWindow: true
                    }, domConstruct.create("div"));
                    
     
     var csvTemplate = new PopupTemplate({
                     title: "{name}",  //wrap field names in {}
                        fieldInfos: [
                                     
          {
                                         fieldName: "address",   //acutal field name in the file
                                         visible: true,
                                         label: "Address: "      //what shows in the popup box
                                                                            
                                        },
          {
                                         fieldName: "city",
                                         visible: true,
                                         label: "City: "
                                                                            
                                        },
          {
                                         fieldName: "state",
                                         visible: true,
                                         label: "State: "
                                                                            
                                        },
          {
                                         fieldName: "zipcode",
                                         visible: true,
                                         label: "Zip Code: "
                                                                            
                                        },
          {
                                         fieldName: "county",
                                         visible: true,
                                         label: "County: "
                                                                            
                                        },
          {
                                         fieldName: "psf",
                                         visible: true,
                                         label: "Price per Square Foot: "
                                                                            
                                        },
          {
                                         fieldName: "acres",
                                         visible: true,
                                         label: "Acreage: "
                                                                            
                                        },
          {
                                         fieldName: "parcel_id",
                                         visible: true,
                                         label: "Parcel Number: "
                                                                            
                                        }
                                    ]
                                                                        
                    });
     
     
     
     map = new Map("mapDiv", {
                        basemap: "hybrid",
                        center: [-111.98868856152143, 40.76044344742585], // long, lat
                        zoom: 14, //the smaller the number, the farther it zooms out
                        infoWindow: popup, //reference to the popup object we made
                        logo: false, //hide esri logo
                        minZoom: 3 ,//farthest we can zoom out
                        wrapAround180: true, //continuous scrolling
                        slider: true
                    });
                    map.attribution.destroy()  
     
     
     
                    
                    csv = new CSVLayer(CSVpath, {
                        copyright: "Acres Companies",
      id: "CSV"
                    });
     
     csv.setInfoTemplate(csvTemplate);
     
     
     
     var i = 1;
     var orderNums = []
     while(i<100){
      orderNums.push(i)
      i++
     }
     
     
     
     map.on("load", addRenderRules); //When the map is done loading, add some rendering rules to the CSV Layer with a function called 'addRenderRules'

           function addRenderRules() {
             var defaultSymbol = null; //if there is a feature that doesnt match the 'Order' rules, it will not draw
             
   
             //create renderer and rules
             var renderer = new UniqueValueRenderer(defaultSymbol, "order"); //Create the renderer based on the 'Order' field
     //add symbol for each value 1-99
     for (var n=0;n<orderNums.length;n++){
      renderer.addValue(orderNums, new PictureMarkerSymbol('http://astro.ngacres.com/htmlemails/interactive/images/'+orderNums+'.png', 25, 25)) //variable URL to icon images, width, height
     };
     
             csv.setRenderer(renderer); //apply the render rules to the CSV layer
             
           }
     
     
                    
                    
                    //ESRI roads layer
                    var Transportation = new Tiled("http://services.arcgisonline.com/arcgis/rest/services/Reference/World_Transportation/MapServer",{
                                                                 id: "Roads"
                                                                });
     var items = []; //placeholder to count the items added to the legend
     
     //once the layers has been added, build the legend by referencing the CSV file
     map.on("layers-add-result",function(){
      
      var headers = lines[0].split(',');
      var otherData = lines.splice(1);
     
      array.map(headers, function(header){   ///get the header fields from the CSV File
       return {
        field: header,
        name: header
       };
      });
     
     
     
      array.map(otherData, function(line){  //Match the subsequent fields to their headers
       var cells = line.split(','), obj = {};
       array.forEach(cells, function(cell, idx){
        obj[headers[idx]] = cell;
       });
       
       if (obj.name !== undefined) { //All valid data added one by one to the legend
        items.push(obj.order)
        document.getElementById("legendDiv").innerHTML += "<img src=http://astro.ngacres.com/htmlemails/interactive/images/" + obj.order + ".png style='width:20px;height:20px;vertical-align:middle'> " + "<a href='javascript: void(0)' id='button"+obj.order+"'>" + obj.name + "</a><br/>"
        
       }
       return obj
      });
      
      array.forEach(items, function(id){  //Click on legend to pan to feature
       document.getElementById('button' + id).onclick = function(me){
        var buttonID = me.srcElement.id.replace(/[A-Za-z]/g,"");
        array.forEach(map.getLayer("CSV").graphics, function(item){
         if (item.attributes.order === buttonID){
          map.centerAt([item.attributes.longitude,item.attributes.latitude]);
         }
        })
        
       };
      })
      
     })               
                   
       
        
                    printer = new Print({
                        map: map,
                        templates: [{
                            label: "Letter Portrait",
                            format: "PDF",
                            layout: "Letter ANSI A Portrait",
                            preserveScale: false,
                            exportOptions: {
                                dpi: 300
                            },
                            showAttribution: false
                        }, {
                            label: "Letter Landscape",
                            format: "PDF",
                            layout: "Letter ANSI A Landscape",
                            preserveScale: false,
                            exportOptions: {
                                dpi: 300
                            },
                            showAttribution: false
                        }],
                        url: "http://maphics:6080/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task"
                    }, dom.byId("printButton"));
                    printer.startup();
                    
                    map.addLayers([csv,Transportation]);  //add the layers to the map
     
                    
                });
                
                
            });

How can i get the print dijit working with my CSV layer in the map?
Any help would be much appreciated!!!

Re: Export to PDF print dijit fails when printing with CSV layer on map

JordanPorter — Mon, 19 May 2014 16:36:46 GMT

Also, when i just have the CSV layer symbolized with, lets say, a circle graphic, (not a PNG image) it prints to PDF fine. So i am assuming there is some issue happening with it being symbolized with an Image. Any ideas?

topic Re: Export to PDF print dijit fails when printing with CSV layer on map in ArcGIS JavaScript Maps SDK Questions

Export to PDF print dijit fails when printing with CSV layer on map

Re: Export to PDF print dijit fails when printing with CSV layer on map