KnowledgeGraphLayer

// send a custom parameter to your special service
let layer = new MapImageLayer({
  url: serviceUrl,
  customParameters: {
    "key": "my-special-key"
  }
});

// the following effect will be applied to the layer at all scales
// brightness will be applied first, then hue-rotate followed by contrast
// changing order of the effects will change the final result
layer.effect = "brightness(5) hue-rotate(270deg) contrast(200%)";

// set a scale dependent bloom effect on the layer
layer.effect = [
  {
    scale: 36978595,
    value: "drop-shadow(3px, 3px, 4px)"
  },
  {
    scale: 18489297,
    value: "drop-shadow(2px, 2px, 3px)"
  },
  {
    scale: 4622324,
    value: "drop-shadow(1px, 1px, 2px)"
  }
];

// Once the layer loads, set the view's extent to the layer's full extent
layer.when(function(){
  view.extent = layer.fullExtent;
});

// constructing an inclusion list:
// The exact record ids of each of the records of a specific named type (entity type or relationship type)
// to include in the layer. In this case the layer will contain one record
const layerInclusionMemberDefinition = new Map();
layerInclusionMemberDefinition.set("{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}",{id:"{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}"})

 //The layerInclusionDefinition specifies whether to use all of the data in a named type or only the records
// specified in the 'members' list. In this case we only want the records specified.
const layerInclusionDefinition = {
  useAllData: false, //only include instances in the member list
  members: layerInclusionMemberDefinition
};

// The namedTypeDefinition is a map of the typeName of each type to be included.
// In this case we are only including the "Observation" entity type.
// The layerInclusionDefinition specifies exactly which "Observation" entities to include in the layer.
const namedTypeDefinition = new Map();
namedTypeDefinition.set("Observation", layerInclusionDefinition);

// Specify if a sublayer should be generated for all named types.
// If true, a sublayer will be created for all named types regardless of
// whether they have a list of instances to include or not.
// If there are no instances the sublayer will be empty. In this case we have set 'generateAllSubLayers' to false so the
// layer will only contain sublayers for the named types (entity types or relationship types) that are specified
// in the namedTypeDefinitions.
// Also defines the collection of named types to include in the layer.
const inclusionListDefinition = {
  generateAllSublayers: false, //only create sublayers for the named types in the namedTypeDefinition
  namedTypeDefinitions: namedTypeDefinition
}

//examples of the inclusionModeDefinition structure inside the KnowledgeGraphLayer

//the layer will only contain one sublayer (for 'supplier') and that sublayer will consist of one entity.
{
  generateAllSublayers: false,
  namedTypeDefinition:[{
    key: "supplier",
    value:{
      useAllData: false,
      members: [{
        key: "{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}",
        value: {
          id: "{1A4W8G4-W52G-W89G-1W5G-J1R4S8H52H4S}",
        }
      }]
    }
  }]
}

// this layer will contain a sublayer for all named types in the graph
// ('Observation', 'User', 'Species', "Observed", "Reviewed", "ObservedIn")
// but only the 'Observation' sublayer will contain data.
// The Observation sublayer will contain exactly one entity.
{
  generateAllSublayers: true,
  namedTypeDefinition:[{
    key: "Observation",
    value:{
      useAllData: false,
      members: [{
        key: "{32CBD5CB-EE31-4714-B14F-57BFE36AE094}",
        value: {
          id: "{32CBD5CB-EE31-4714-B14F-57BFE36AE094}",
        }
      }]
    }
  }]
}

// this layer will contain a sublayer for all named types in the graph
// ('Observation', 'User', 'Species', "Observed", "Reviewed", "ObservedIn")
// but only the 'Observation' sublayer will contain data.
// the 'Observation' sublayer will contain all instance of the Observation entity type
{
  generateAllSublayers: true,
  namedTypeDefinition:[{
    key: "Observation",
    value:{
      useAllData: true
    }
  }]
}

// A more complex example:
{
  //sublayers will only be created for the types listed
  generateAllSublayers: false,
  namedTypeDefinitions: {
    //include all `Species` entities that exist at the time the layer is created
    Species: {
      useAllData: true
    },
    //include all `User` entities that exist at the time the layer is created
    User: {
      useAllData: true
    },
    //include all only the specified `Observation` entities
    Observation: {
      useAllData:false,
      members: {
        "{941A7425-C45D-4940-A2E8-F3611973EC8A}": {
          id: "{941A7425-C45D-4940-A2E8-F3611973EC8A}"
        },
        "{94DC1D53-4043-4D0B-8CF7-18B690414118}": {
          id: "{94DC1D53-4043-4D0B-8CF7-18B690414118}"
        },
        //This entity has a fixed location so will remain in the same place regardless of the layout applied.
        //the other entities will move around it
        "{4E1D1ACE-6252-4BA4-B76E-CDEDFE9B0AB1}": {
          id: "{4E1D1ACE-6252-4BA4-B76E-CDEDFE9B0AB1}",
        },
        "{559312DF-893C-44E2-AD86-BAA73CD49719}": {
          id: "{559312DF-893C-44E2-AD86-BAA73CD49719}"
        },
        "{158A2D46-3EFF-4479-BC57-E6981FCB80B6}": {
          id: "{158A2D46-3EFF-4479-BC57-E6981FCB80B6}"
        },
        "{40AD70FC-CD7D-4928-B555-38EA49675944}": {
          id: "{40AD70FC-CD7D-4928-B555-38EA49675944}"
        },
        "{3A5B8F11-5971-4A46-99AC-F509CA59B517}": {
          id: "{3A5B8F11-5971-4A46-99AC-F509CA59B517}"
        }
      }
    },
    //include all `Observed` relationships that exist at the time the layer is created
    Observed: {
      useAllData: true
    },
    //include all `ObservedIn` relationships that exist at the time the layer is created
    ObservedIn: {
      useAllData: true
    }
  }
}

//to access individual sublayers to add or modify properties such as the renderer, popups and labels
KnowledgeGraphLayer.layers.items.forEach((sublayer)=>{
 sublayer.popupTemplate = new PopupTemplate({
  title: "{common_name}",
  content: [{
    type: "text",
    text: "Scientific Name: {name}"
  }]
 });
})

// The layer will not be visible when the view is zoomed in beyond a scale of 1:1,000
layer.maxScale = 1000;

// The layer's visibility is not restricted to a maximum scale.
layer.maxScale = 0;

// The layer will not be visible when the view is zoomed out beyond a scale of 1:3,000,000
layer.minScale = 3000000;

// The layer's visibility is not restricted to a minimum scale.
layer.minScale = 0;

// Makes the layer 50% transparent
layer.opacity = 0.5;

// While this example uses FeatureLayer, this same pattern can be
// used for other layers that may be loaded from portalItem ids.
const layer = new FeatureLayer({
  portalItem: {  // autocasts as new PortalItem()
    id: "caa9bd9da1f4487cb4989824053bb847"
  }  // the first layer in the service is returned
});

// Set hostname when using an on-premise portal (default is ArcGIS Online)
// esriConfig.portalUrl = "http://myHostName.esri.com/arcgis";

// While this example uses FeatureLayer, this same pattern can be
// used for SceneLayers.
const layer = new FeatureLayer({
  portalItem: {  // autocasts as new PortalItem()
    id: "8d26f04f31f642b6828b7023b84c2188"
  },
  // loads the third item in the given feature service
  layerId: 2
});

// Initialize GeoJSONLayer by referencing a portalItem id pointing to geojson file.
const layer = new GeoJSONLayer({
  portalItem: new PortalItem({
    id: "81e769cd7031482797e1b0768f23c7e1",
    // optionally define the portal, of the item.
    // if not specified, the default portal defined is used.
    // see https://developers.arcgis.com/javascript/latest/references/core/config/#portalUrl
    portal: new Portal({
      url: "https://jsapi.maps.arcgis.com/"
    })
  }
});

// This snippet loads a table hosted in ArcGIS Online.
const table = new FeatureLayer({
  portalItem: { // autocasts as esri/portal/PortalItem
    id: "123f4410054b43d7a0bacc1533ceb8dc"
  }
});

// Before adding the table to the map, it must first be loaded and confirm it is the right type.
table.load().then(() => {
  if (table.isTable) {
    map.tables.add(table);
  }
});

// While this example uses FeatureLayer, this same pattern can be
// used for other layers that may be loaded from portalItem ids.
const layer = new FeatureLayer({
  portalItem: { // autocasts as esri/portal/PortalItem
    id: "caa9bd9da1f4487cb4989824053bb847",
    // Set an API key to access a secure portal item configured with API key authentication.
    apiKey: "APIKEY"
  }
});

// the layer will be refreshed every minute.
layer.refreshInterval = 1;

// The layer is no longer visible in the view
layer.visible = false;

// Watch for changes in the layer's visibility
// and set the visibility of another layer when it changes
reactiveUtils.watch(
  () => layer.visible,
  (visible) => {
    if (visible) {
      anotherLayer.visible = true;
    } else {
      anotherLayer.visible = false;
    }
  }
);

// This snippet shows how to add a feature layer from an ArcGIS Server URL
// Get an ArcGIS Server URL from a custom function
const arcgisUrl = getLayerUrl();

Layer.fromArcGISServerUrl({
  url: arcgisUrl,
  properties: {
    // set any layer properties here
    popupTemplate: new PopupTemplate()
  }
}).then(function(layer){
  // add the layer to the map
  map.add(layer);
});

// This snippet shows how to add a table from an ArcGIS Server URL
// Get an ArcGIS Server URL from a custom function
const arcgisUrl = getLayerUrl();

Layer.fromArcGISServerUrl({
  url: arcgisUrl
}).then(function(layer){
  // Load the table before it can be used
  layer.load().then(function() {
    // Check that it is the right type
    if (layer.isTable) {
      // Add table to map's tables collection
      map.tables.add(layer);
    }
  });
});

// Create a layer from a specified portal item and add to the map
Layer.fromPortalItem({
  portalItem: {  // autocasts new PortalItem()
    id: "8444e275037549c1acab02d2626daaee"
  }
}).then(function(layer){
  // add the layer to the map
  map.add(layer);
});

// Create a table from a specified portal item and add it to the map's tables collection
Layer.fromPortalItem({
  portalItem: { // autocasts new PortalItem()
    id: "123f4410054b43d7a0bacc1533ceb8dc" // This is a hosted table stored in a feature service
  }
}).then(function(layer) {
  // Necessary to load the table in order for it to be read correctly
  layer.load().then(function() {
    // Confirm this reads as a table
    if (layer.isTable) {
      // Add the new table to the map's table collection
      map.tables.add(layer);
    }
  });
});

const initializeLayer = async() => {
  //fetch the knowledge graph
  knowledgeGraph = await KnowledgeGraphService.fetchKnowledgeGraph(url)
  //query the knowledge graph to get only the research grade observations
  observationList = await KnowledgeGraphService.executeQuery(knowledgeGraph, {
      openCypherQuery: `MATCH (o:Observation{quality_grade: "research"}) RETURN o LIMIT 10`
  })
  //Define an inclusion list
  let members = new Map();
  for (observation of observationList.resultRows){
      members.set(observation[0].id,{id:observation[0].id})
  }
  let namedTypes = new Map();
  namedTypes.set("Observation", { useAllData: false, members: members });
  const inclusionDef = {
      generateAllSublayers: false,
      namedTypeDefinitions: namedTypes
  }
  //create the layer
  const compositeLayer = new KnowledgeGraphLayer({
      url: url,
      inclusionModeDefinition: inclusionDef
  });
  map.add(compositeLayer);
  //add records to the layer
  await compositeLayer.addRecords([{id:"{001899F8-6A59-462A-8507-DD65D690AD48}", typeName:"Observation"}])
}
initializeLayer()

view.on("click", function(event){
  // event is the event handle returned after the event fires.
  console.log(event.mapPoint);
});

const initializeLayer = async() => {
  //fetch the knowledge graph
  knowledgeGraph = await KnowledgeGraphService.fetchKnowledgeGraph(url)
  //query the knowledge graph to get only the research grade observations
  observationList = await KnowledgeGraphService.executeQuery(knowledgeGraph, {
      openCypherQuery: `MATCH (o:Observation{quality_grade: "research"}) RETURN o LIMIT 10`
  })
  //Define an inclusion list. Records can only be removed from the knowledge graph layer
 // if they are explicitly included as members of a named type in the inclusionModeDefinition
  let members = new Map();
  for (observation of observationList.resultRows){
      members.set(observation[0].id,{id:observation[0].id})
  }
  let namedTypes = new Map();
  namedTypes.set("Observation", { useAllData: false, members: members });
  const inclusionDef = {
      generateAllSublayers: false,
      namedTypeDefinitions: namedTypes
  }
  //create the layer
  const compositeLayer = new KnowledgeGraphLayer({
      url: url,
      inclusionModeDefinition: inclusionDef
  });
  map.add(compositeLayer);
  //remove records from the inclusionModeDefinition
  await compositeLayer.removeRecords([{id:"{001899F8-6A59-462A-8507-DD65D690AD48}", typeName:"Observation"}])
}
initializeLayer()

// Although this example uses MapView, any class instance that is a promise may use when() in the same way
let view = new MapView();
view.when(function(){
  // This function will execute once the promise is resolved
}, function(error){
  // This function will execute if the promise is rejected due to an error
});