Question

我正在尝试添加一个小部件，以便在ArcGIS Crowdsource Story应用程序中进行搜索。我已附上以下代码。我无法让搜索栏显示或工作。我需要能够在应用程序中搜索业务。

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><meta name="fragment" content="!"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><meta name="viewport" content="width=device-width,initial-scale=1"><link type="image/ico" rel="shortcut icon" href="resources/images/favicon.ico"><link type="image/ico" rel="icon" href="resources/images/favicon.ico">
 
 <script>
	require([
        "esri/map", "esri/dijit/Search", "esri/layers/FeatureLayer",  "esri/InfoTemplate", "dojo/domReady!"
      ], function (Map, Search, FeatureLayer,InfoTemplate) {
      var map = new Map("map", {
        basemap: "gray",
        center: [-82.93, 42.5], // lon, lat
        zoom: 10
      });

      var search = new Search({
        sources: [{
          featureLayer: new FeatureLayer("http://services1.arcgis.com/T10PoAuLqJahkg0K/arcgis/rest/services/choctawNationSmallBusinessDevelopment/FeatureServer/0", {
            outFields: ["*"],
            infoTemplate: new InfoTemplate("Parcels", "Name: ${Name}</br>Location Name: ${LocationName}")
          }),
          outFields: ["LocationName","Name"],
          displayField: "Name",
          suggestionTemplate: "${LocationName}: ${Name}",
          name: "Name",
          placeholder: "example: Shawn Smith",
          enableSuggestions: true
      }],
        map: map
      }, "search");


      search.startup();
    });
  </script>
  <!--
    To correctly reference your Story Maps Crowdsource App in search engine:
     - create and fill out extensively an ArcGIS Online item that link to your final application
     - edit the following six tags. For more information, see the following blog post:
      (https://developerscorner.storymaps.arcgis.com/grow-your-story-maps-audience-with-open-graph-tags-b7639cb65d5c)
  -->
  <title>ChahtaPreneur</title>
  <meta name="description" content="">

  <!-- Social Sharing -->
  <meta property="og:type" content="article"/>
  <meta property="og:title" content=""/>
  <meta property="og:description" content=""/>
  <meta property="og:image" content=""/>
  <!-- END Social Sharing -->
  
  

  <script type="text/javascript">
		//-------------------------------------------------------------------------------------------
		//     Application configuration (ignored on ArcGIS Online and Portal)
		//-------------------------------------------------------------------------------------------
		var configOptions = {
			// Enter an application ID created through the Crowdsource builder
			appid: "2686c1003e374021a799020925e606cc",
			// Optionally to be able to use the appid URL parameter, configure here the list of application author
			//  whose application are allowed to be viewed by this Crowdsource deployment
			// This is the Portal username of the Crowdsource owner (e.g. ["user1"] or ["user1", "user2"])
			authorizedOwners: ["*"],
      // Optionally to secure Crowdsource's access, use an OAuth application ID (example: 6gyOg377fLUhUk6f)
      oAuthAppId: ""
		};
		// Optionally sharing, proxy URLs, Bing Maps key, Geometry and Geocode service's URLs can be configured in app/config.js. This is only required
		//   when the webmap is not hosted on ArcGIS Online or a Portal for ArcGIS instance and the application isn't deployed as /home/StoryMapCrowdsource/ or /apps/StoryMapCrowdsource/.
	</script>
	
	

	<!--[if IE 9]>
  <script type="text/javascript">
    alert('This app requires a modern browsers to run properly. Please update your browser then visit this page again.');
    window.location = "http://browsehappy.com/";
  </script>
  <![endif]--><!--[if lt IE 9]>
  <script type="text/javascript">
    alert('This app requires a modern browsers to run properly. Please update your browser then visit this page again.');
    window.location = "http://browsehappy.com/";
  </script>
  <![endif]--></head><body class="calcite">
  <style>
    #header class { background-color: #444;}
  </style>
  
  <div id="app"></div><div id="loadingOverlay"><div id="loadingIndicator" class="loadingIndicator"><img src="resources/images/loader-light.gif"></div></div><div id="search"></div><!-- Loading --><style>body,html{margin:0;padding:0}#loadingOverlay{position:absolute;top:0;width:100%;height:100%;background-color:#E5E5E5;-webkit-box-shadow:inset 0 0 82px 19px rgba(0,0,0,.3);-moz-box-shadow:inset 0 0 82px 19px rgba(0,0,0,.3);box-shadow:inset 0 0 82px 19px rgba(0,0,0,.3)}
	#search {
      display: block;
      position: absolute;
      z-index: 2;
      top: 40px;
      left: 40px;
    }
#loadingIndicator{position:fixed;margin:-50px 0 0 -50px;top:50%;left:50%;text-align:center;z-index:900}#loadingIndicator img{position:relative;height:60px;width:60px;margin:20px}</style>
		
  
  
</div><script type="text/javascript">var app={version:"0.2.0",pathJSAPI:"//js.arcgis.com/3.18/"};</script><script type="text/javascript" src="app/main-config.min.js"></script>

Answer 1

你有任何错误吗？

在about片段中，错误＆＃34; ReferenceError：require未定义＆＃34;发生了。这是因为在将esri api添加到应用程序之前添加了脚本。

尝试在

之后移动代码

<script type="text/javascript">var app={version:"0.2.0",pathJSAPI:"//js.arcgis.com/3.18/"};</script><script type="text/javascript" src="app/main-config.min.js"></script>

将搜索小部件添加到ArcGIS Crowdsource Story App

1 个答案: