I am trying to display a feature layer thumbnail in a <div id="quickLook"></div>. On click or next feature button click I want to display each layer feature thumbnail. The path for the thumbnail is in a GeoJSON Attribute named thumbnail. I am hitting a wall trying to figure out how to accomplish that. My first attempt bellow was not successful:

function createForestLayer(graphics) {
        if (graphics) {
          wgs84Graphics = graphics;
        } else {
          graphics = wgs84Graphics;
        // display projected graphics as a FeatureLayer
        countriesLayer = new FeatureLayer({
          title: "esri",
          source: graphics,
          objectIdField: "OBJECTID",
          fields: myFields,

          renderer: myRenderer,

          popupTemplate: myPopup,

          template: createTemplate


function createTemplate(){
const myFeatureTemplate = new FeatureTemplates({

container: "quickLook",
layers: countriesLayer,
filterFunction: createItem

function createItem(){
const myTemplate = new TemplateItem({
layer: countriesLayer,
template: myFeatureTemplate,
thumbnail: {
contentType: "png",
imageData: "./data/satellite.png",
height: 300,
width: 300

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.