Add Marker to Search Result

[JessicaGormont]

Since the search result window gets in the way on our map (and in our case is redundant due to how we label our features), we have removed it. However, we would like to add a marker symbol or highlight the point we have searched so the end user can easily identify it on the map. Is there a way to add this function?

Note: I am not a programmer, so please be as basic in your answer as possible. If I need to add custom code (and you know that code), please provide it in your response and tell me where I'm supposed to add it. Thank you so much!!!

[RobertScheitlin__GISP · Accepted solution]

Jessica,

  Open the [install dir]\server\apps\[app #]\widgets\Search\Widget.js file find the _convertConfig function and add lines 3 and 15, and don't forget to add the comma on line 14:

_convertConfig: function(config) {
        var sourceDefs = array.map(config.sources, lang.hitch(this, function(source) {
          var pms = new PictureMarkerSymbol('https://js.arcgis.com/3.15/esri/dijit/images/Directions/greenPoint.png',21,29);
          var def = new Deferred();
          if (source && source.url && source.type === 'locator') {
            def.resolve({
              locator: new Locator(source.url || ""),
              outFields: ["*"],
              singleLineFieldName: source.singleLineFieldName || "",
              name: jimuUtils.stripHTML(source.name || ""),
              placeholder: jimuUtils.stripHTML(source.placeholder || ""),
              countryCode: source.countryCode || "",
              maxResults: source.maxResults || 6,
              useMapExtent: !!source.searchInCurrentMapExtent,
              highlightSymbol: pms
            });
          } else if (source && source.url && source.type === 'query') {

Next at the beginning of the Widget.js file make these changes line 22 and 27:

define([
    'dojo/_base/declare',
    'dojo/_base/lang',
    'dojo/_base/array',
    'dojo/_base/html',
    'dojo/when',
    'dojo/on',
    'dojo/aspect',
    'dojo/query',
    'dojo/keys',
    'dojo/Deferred',
    'dojo/promise/all',
    'jimu/BaseWidget',
    'jimu/LayerInfos/LayerInfos',
    'jimu/utils',
    'esri/dijit/Search',
    'esri/tasks/locator',
    'esri/layers/FeatureLayer',
    'esri/InfoTemplate',
    'esri/lang',
    './utils',
    'esri/symbols/PictureMarkerSymbol',
    'dojo/NodeList-dom'
  ],
  function(declare, lang, array, html, when, on, aspect, query, keys, Deferred, all,
    BaseWidget, LayerInfos, jimuUtils, Search, Locator,
    FeatureLayer, InfoTemplate, esriLang, utils, PictureMarkerSymbol) {

Around line 66 find and make these changes line 25:

LayerInfos.getInstance(this.map, this.map.itemInfo)
          .then(lang.hitch(this, function(layerInfosObj) {
            this.layerInfosObj = layerInfosObj;
            utils.setMap(this.map);
            utils.setLayerInfosObj(this.layerInfosObj);
            utils.setAppConfig(this.appConfig);
            when(utils.getConfigInfo(this.config)).then(lang.hitch(this, function(config) {
              return all(this._convertConfig(config)).then(function(searchSouces) {
                return array.filter(searchSouces, function(source) {
                  return source;
                });
              });
            })).then(lang.hitch(this, function(searchSouces) {
              if (!this.domNode) {
                return;
              }
              this.searchDijit = new Search({
                activeSourceIndex: searchSouces.length === 1 ? 0 : 'all',
                allPlaceholder: jimuUtils.stripHTML(esriLang.isDefined(this.config.allPlaceholder) ?
                  this.config.allPlaceholder : ""),
                autoSelect: true,
                enableButtonMode: false,
                enableLabel: false,
                enableInfoWindow: true,
                enableHighlight: true,
                showInfoWindowOnSelect: esriLang.isDefined(this.config.showInfoWindowOnSelect) ?
                  !!this.config.showInfoWindowOnSelect : true,
                map: this.map,
                sources: searchSouces,
                theme: 'arcgisSearch'
              });

Hopefully this is clear enough.

[RobertScheitlin__GISP]

Jessica Gormont​ Did this work for you?

[JessicaGormont]

Robert Scheitlin, GISP​ - Sorry, I was in training all day yesterday. This code worked great! Thank you so much for making your response so easy to follow.