---

For the Lesson 7 assignment, I chose the Alternative Fuel Stations scenario because it used the same data I used for my assignment in Lesson 1. In the first assignment, we had to develop a map without programming, and I thought it would be an interesting exercise to compare that method with this lesson’s method of displaying the same data.

This map displays the Alternative Fuel Stations feature layer by Esri and uses a set of custom icons provided for the assignment. Upon loading the page, users are prompted to enter a state abbreviation, which is used to create a definitionExpression for loading the feature layer. After the feature layer is loaded, a legend is generated for the layer. Since there are so many types of fuel, I decided to add a button so users can filter the results using Esri’s sample code on filtering features by attribute as a guide. I also used the example from the documentation on the feature layer queryExtent() method to zoom the map to the user’s chosen state. Since the legend takes up so much space on small screens, I added it to an Expand widget using the example from the documentation. The popups for the feature layer are already very well-styled and organized, so I did not make changes.

While my Lesson 1 and 7 maps use the same data, the first one displays only the electric chargers, while this one displays all of the available fuel types in the feature layer. In lesson 1, I used Esri’s Experience Builder, which can quickly create a polished-looking web map app, but I was left dissatisfied with the limited control. Building this map with Javascript takes more time, but I had far more freedom. I can see a time and a place for both approaches, but I have found that I prefer the control I have using Javascript to custom-tailor map features.