Remove Result Graphic following Search - ArcGIS API for JS v4.16

[PaulMcCord]

I'm using the Search widget to allow users to search for parcel addresses. The Search process is working properly except it places a blue graphic on the map even though I'm specifying that I don't want a graphic. I'm assigning my own symbology to the selected feature (the orange border in the below image), and I don't want the additional blue graphic that is being forced on the selected feature.

Here is my code for the search process:

//Create search tool to search addresses
    const searchTool = new Search({
        view: myView,
        sources: [
            {
                layer: parcelLyr,
                searchFields: ["propstreet"],
                displayField: "propstreet",
                name: "LayerSearchSource",
                placeholder: "example: 500 Griswold",
                suggestionsEnabled: true,
                //autoNavigate: true,
                resultGraphicEnabled: false
            }
            
        ],
        container: addressSearchBar,
        includeDefaultSources: false,
        resultGraphicEnabled: false
    })

    searchTool.on("select-result", function(event){
        console.log("location was chosen ", event)
        long = event.result.feature.geometry.centroid.longitude + 0.003
        lat = event.result.feature.geometry.centroid.latitude
        myView.center = [long, lat];
        myView.zoom = 16
        console.log("geometry: ", event.result.feature.geometry)
        selectedParcel = event.result.feature
        createHighlightedParcel();
    })‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I create my own symbology in the createHighlightedParcel() function at the end. My understanding is that setting resultGraphicEnabled to false should remove the result graphic. Am I wrong about this? Is there another way to prevent the result graphic?

Thank you

[RobertScheitlin__GISP]

Paul,

   The search widgets graphic is orange when the 

resultGraphicEnabled: true

So the cyan color you are seeing is from the popup selection.

[PaulMcCord]

Thanks Robert. I'm not sure if I understood your response. I set the popupEnabled option to 'false', but I'm still seeing the cyan symbology when the Search widget finishes. Is there another option I need to set?

[RobertScheitlin__GISP]

Paul,

  It is something in your code base, because when I set the resultGraphicEnablerd to false in the sample that allows for searching a polygon it does not have a cyan or orange graphic in the map (as expected). So that is why I thought that some where in your code you are using the popup (which applies a cyan fill to the selected graphic).

[PaulMcCord]

The strange thing is that when I revert back to ArcGIS API for JS v 4.11, the cyan feature isn't added. As soon as I move to 4.12 or more recent, it's added and I can't get it to go away.

Is there something I can do with the resultGraphic parameter or do you have any examples of using the resultGrahic in the Search tool? At this point, I'm willing to just style it in a way that it is hidden from view. The documentation for Search says this about the resultGraphic, but I can't find any examples online of how to set this up:

The graphic used to highlight the resulting feature or location.

A graphic will be placed in the View's graphics for layer views that do not support the highlight method.

[RobertScheitlin__GISP]

Paul,

   Have you tried view.graphics.removeAll()?

[PaulMcCord]

view.graphics.removeAll() doesn't remove it from the map view. When I console.log view.graphics.length, there are no graphics even before I try to remove any graphics. I'm at a loss as to why this graphic is appearing and how to remove it.

[RobertScheitlin__GISP]

Paul,

   Have you tried to see if the Seach widgets resultGraphic is a graphic or is it null?

[PaulMcCord]

Here's my process that runs after the Search tool executes. I put this process together to center the Map View on the result.

searchTool.on("select-result", function(event){
        console.log("location was chosen ", event)
        long = event.result.feature.geometry.centroid.longitude + 0.003
        lat = event.result.feature.geometry.centroid.latitude
        myView.center = [long, lat];
        myView.zoom = 16
        selectedParcel = event.result.feature
        createHighlightedParcel();

        //Opens Parcel Info Panel and places results in panel
        if ($("#parcelInfoPanel").css("visibility") === "hidden"){
            console.log("in the show pacel info panel function")
            showParcelInfoPanel();  //Reveals panel with parcel information
        }
        console.log(selectedParcel)
        populateParcelPanel(selectedParcel);  //Grabs parcel information from parcel features for the parcel panel
    })‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I'm grabbing the result of the search in the second line.

Then, when I unpack that object it the console, by clicking on target, then resultGraphic, the value of resultGraphic is an object. Here is a screenshot of my console:

[RobertScheitlin__GISP]

Then try

resultGraphic.layer.removeAll();