Print output differences- 3.X vs 4.X
As I keep working on migrating my 3.X app to 4.X, I keep hitting issues. Now, it's print output. The same basic code block, adjusted for 4.X differences, produces a vastly different output. The final part of a custom report generating tool is to produce a JPEG map and insert it into a HTML report output. The output from 3.X produces this:
The 4.X API output results in this:
It's almost as if there's a "reference scale" setting that I haven't adjusted but, from looking over the API reference, I can't see any. Is there one? There really isn't much to the code side of things so I'm kinda flummoxed but this.
FWIW, the relevant 3.X code:
tractsShown = theTractLayer.visible;
bgsShown = theBlockgroupLayer.visible;
//Switch the labelling class for Tracts/Block Groups temporarily for proper print sizes
theTractLayer.setLabelingInfo([ app.tractPrintClass ]);
theBlockgroupLayer.setLabelingInfo([ app.bgPrintClass ]);
if (!tractsShown) {
theTractLayer.setVisibility(true);
}
if (!bgsShown) {
theBlockgroupLayer.setVisibility(true);
}
if (highlightGeom != null) {
highlightSymbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_FORWARD_DIAGONAL,
new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
new Color([255,255,0.1]), 4),new Color([255,255,0,0.1]));
highlightGraphic = new Graphic(highlightGeom, highlightSymbol,null,null);
app.map.graphics.add(highlightGraphic);
}
pTemplate = new PrintTemplate();
pTemplate.exportOptions = {
width: 600,
height: 400,
dpi: 150
};
pTemplate.format = "jpg";
pTemplate.layout = "MAP_ONLY";
pTemplate.preserveScale = false;
pTemplate.showAttribution = false;
var params = new PrintParameters();
params.map = app.map;
params.async = false;
params.template = pTemplate;
jpgMapDiv = theDocument.getElementById("jpegMap");
thePrintTask = new PrintTask(url);
window.setTimeout(function() {
thePrintTask.execute(params, function(result) {
jpgMapDiv.innerHTML = "<img src=\"" + result.url + "\" style=\"border:2px solid black;left:25%\"\>";
var oldExtent = app.preRptExtent;
app.map.setExtent(curExtent);
//Restore the screen-centric label sizes for Tracts/Block Groups
theTractLayer.setLabelingInfo([ app.tractScreenClass ]);
theBlockgroupLayer.setLabelingInfo([ app.bgScreenClass ]);
if (highlightGeom != null) {
app.map.graphics.remove(highlightGraphic);
highlightGraphic = null;
highlightGeometry = null;
}
}, function(err) {
//Print task failed
app.map.graphics.remove(highlightGraphic);
theTractLayer.setLabelingInfo([ app.tractScreenClass ]);
theBlockgroupLayer.setLabelingInfo([ app.bgScreenClass ]);
highlightGraphic = null;
highlightGeometry = null;
});
//Reset the current viewing status of the census tract / blockgroup layers
if (!tractsShown) {
theTractLayer.setVisibility(false);
}
if (!bgsShown) {
theBlockgroupLayer.setVisibility(false);
}
},1000);
And the rewritten 4.X-
var theTractLayer = app.map.findLayerById("censusTracts");
var tractsShown = theTractLayer.visible;
var theBlockgroupLayer = app.map.findLayerById("censusBlockGroups");
var bgsShown = theBlockgroupLayer.visible;
//Switch the labelling class for Tracts/Block Groups temporarily for proper print sizes
theTractLayer.labelingInfo = [ app.tractPrintClass ];
theBlockgroupLayer.labelingInfo = [ app.bgPrintClass ];
if (!tractsShown) {
theTractLayer.visible = true;
}
if (!bgsShown) {
theBlockgroupLayer.visible = true;
}
if (app.highlightGeom != null) {
var highlightSymbol = new SimpleFillSymbol({
color: new Color([255,255,0,1]),
outline: new SimpleLineSymbol({
cap: "round",
color: new Color([255,255,0,1]),
join: "round",
miterLimit: 1,
style: "solid",
width: 2
}),
style: "forward-diagonal"
});
var highlightGraphic = new Graphic({geometry: app.highlightGeom, symbol: highlightSymbol});
app.theView.graphics.add(highlightGraphic);
}
var pTemplate = new PrintTemplate();
pTemplate.exportOptions = {
width: 600,
height: 400,
dpi: 300
};
pTemplate.format = "jpg";
pTemplate.layout = "map-only";
pTemplate.scalePreserved = false;
pTemplate.attributionVisible = false;
var params = new PrintParameters();
params.view = app.theView;
params.template = pTemplate;
var jpgMapDiv = theDocument.getElementById("jpegMap");
var oldExtent = app.preRptExtent;
//app.theView.goTo(app.curExtent);
print.execute(app.printUrl, params).then(function(printResult) {
jpgMapDiv.innerHTML = "<img src=\"" + printResult.url + "\" style=\"border:2px solid black;left:25%\"\>";
//Restore the screen-centric label sizes for Tracts/Block Groups
theTractLayer.labelingInfo = [ app.tractScreenClass ];
theBlockgroupLayer.labelingInfo = [ app.bgScreenClass ];
if (app.highlightGeom != null) {
app.theView.graphics.remove(highlightGraphic);
highlightGraphic = null;
app.highlightGeom = null;
app.theView.goTo(oldExtent);
}
}).catch(function(printError) {
//Print task failed
app.theView.graphics.remove(highlightGraphic);
theTractLayer.labelingInfo = [ app.tractScreenClass ];
theBlockgroupLayer.labelingInfo = [ app.bgScreenClass ];
highlightGraphic = null;
app.highlightGeom = null;
app.theView.goTo(oldExtent);
});
Hey Joel, I have been playing with that setting but I don't think that's the way to go. The physical dimensions of the JPEG map export are different than the mapView's extent on screen so if you try to use scalePreserved (in concert with outScale), the resulting JPEG map won't accurately show the feature with the buffer I apply to it. Example-
I was getting inconsistent print map extents, which was super frustrating. I finally re-read the API docs and the goTo() method returns a promise so I think my code was behaving more async than sync. I added a when() after using goTo and wrapped the map export process inside that function at the map extents are behaving more like I would expect.
The thing I really want to resolve is the symbology and labels which get blown up out of proportion. Again, the print output is similar to what you experience inside desktop if you alter the Reference Scale property of the Data Frame. It's just that the layer & label symbology is not correctly scaling with map scale.
Export output vs onscreen map example-
