nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

HELP! SimpleFillSymbol and Search Widget modification

JamesFitzgerald

Hello,

I need direction. I want to modify Search using a suggestion template | ArcGIS API for JavaScript by incorporating the SimpleFillSymbol and SimpleLineSymbol. I feel I am close but still missing code. It will load but now the search box disappears. THANKS

var search = new Search({
        sources: [{          
                       
           featureLayer: new FeatureLayer("http://services.arcgis.com/HYLRafMc4Ux6DA8c/arcgis/rest/services/Parks_Search/FeatureServer/1", { 
             mode: FeatureLayer.MODE_ONDEMAND,           
             outFields: ["*"],                     
             infoTemplate: new InfoTemplate("Identify County Parks", 
             "Park Name: ${Name}</br>ParK Ownership: ${ParkType}</br>"), 
             
             sfs: new SimpleFillSymbol(SimpleFillSymbol.STYLE_Null, 
             new SimpleLineSymbol (SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0]), 2), 
             new Color([255,255,0,0,0.5]))           
          }),
                    
      }],
        map: map
      },  "search");

      search.startup();
      
      }); 
      map.addLayer(featureLayer);

Encuentra más publicaciones etiquetadas con

Accepted answers

rscheitlin

James,

There is no simpleFill option for the Search widget constructor... Are you looking for the "highlightSymbol"?

All comments

JamesFitzgerald

Hey again,

enableHighlight worked! It definitely took way too long seek help from GeoNet! Very easy!

James

JamesFitzgerald

Thanks, I am new to arcGIS API for JavaScript. I am beginning to understand.

Thanks again!

rscheitlin

James,

There is no simpleFill option for the Search widget constructor... Are you looking for the "highlightSymbol"?

JamesFitzgerald

Hey,

It loaded correctly but seemed to skip the simpleFill. Do I need to set it? Add it to featureLayer? Not sure. Thank You for your help!

var search = new Search({
        sources: [{  
           simpleFill: new SimpleFillSymbol(SimpleFillSymbol.STYLE_Null, 
             new SimpleLineSymbol (SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0]), 2), 
             new Color([255,255,0,0,0.5])),  
                    
                       
           featureLayer: new FeatureLayer("http://services.arcgis.com/HYLRafMc4Ux6DA8c/arcgis/rest/services/Parks_Search/FeatureServer/1", { 
             mode: FeatureLayer.MODE_ONDEMAND,           
             outFields: ["*"],                     
             infoTemplate: new InfoTemplate("Identify County Parks", 
             "Park Name: ${Name}</br>ParK Ownership: ${ParkType}</br>"),             
                      
          }),
                    
      }],
        map: map
      },  "search");

      search.startup();
      
      }); 
      map.addLayer(featureLayer);

rscheitlin

James,

you are missing your require and var for "esri/Color"

JamesFitzgerald

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />

  <title>Search with Suggestion Template</title>
    <link rel="stylesheet" href="http://js.arcgis.com/3.14/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
    <script src="http://js.arcgis.com/3.14/"></script>
  
  <style>
    html,
    body,
    #map {
      height: 100%;
      width: 100%;
      margin: 0;
      padding: 0;
      
    }

    #search {
      display: block;
      position: absolute;
      z-index: 2;
      top: 20px;
      left: 74px;
      
    }
   </style>
   
     
  <script>     
   require(["esri/map","esri/geometry/Extent", "esri/layers/ArcGISTiledMapServiceLayer", "esri/dijit/Search",  "esri/layers/FeatureLayer",  
           "esri/InfoTemplate","esri/symbols/SimpleFillSymbol","esri/symbols/SimpleLineSymbol", "dojo/domReady!"], 
   function (Map, Extent,ArcGISTiledMapServiceLayer, Search,    FeatureLayer, InfoTemplate, SimpleFillSymbol, SimpleLineSymbol) {
      
      var map = new Map("map", {
        extent: new Extent({xmin: -9464867.586310409, ymin: 3988479.973394642, xmax: -9359211.763174301, ymax: 4048458.624373842,spatialReference: {wkid: 102100}})                
      });
      var basemap = new ArcGISTiledMapServiceLayer("http://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer");
        map.addLayer(basemap);
      
      var featureLayerParks = new FeatureLayer("http://services.arcgis.com/HYLRafMc4Ux6DA8c/arcgis/rest/services/Parks_Search/FeatureServer/1", {
         mode: FeatureLayer.MODE_ONDEMAND,
         opacity:.5,
         visible: FeatureLayer.isVisibleAtMapScale=true
         
        
      });
      
      map.addLayer(featureLayerParks);
      
      var search = new Search({
        sources: [{  
           sfs: new SimpleFillSymbol(SimpleFillSymbol.STYLE_Null, 
             new SimpleLineSymbol (SimpleLineSymbol.STYLE_SOLID, new Color([255,0,0]), 2), 
             new Color([255,255,0,0,0.5])),         
                       
           featureLayer: new FeatureLayer("http://services.arcgis.com/HYLRafMc4Ux6DA8c/arcgis/rest/services/Parks_Search/FeatureServer/1", { 
             mode: FeatureLayer.MODE_ONDEMAND,           
             outFields: ["*"],                     
             infoTemplate: new InfoTemplate("Identify County Parks", 
             "Park Name: ${Name}</br>ParK Ownership: ${ParkType}</br>"), 
             
                       
          }),
                    
      }],
        map: map
      },  "search");

      search.startup();
      
      }); 
      map.addLayer(featureLayer); 
              
   </script>
</head>

<body>
  <div id="search"></div>
  <div id="map"></div>
</body>

</html>

rscheitlin

James,

It sounds like you are having an issue with your requires and vars being out of order. Can you post your code?

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.