ArcGIS Web Samples

A collection of interactive web mapping samples built using the ArcGIS Maps SDK for JavaScript.

Overview

This repository contains various web mapping examples that demonstrate different ArcGIS JavaScript API features and functionality. Each sample is designed to be self-contained and easy to understand, making it an excellent resource for developers new to ArcGIS web development.

Available Samples

1. Animate-layer-view-effect

• Visualizes 2008 election results with interactive animations
• Demonstrates feature effects and layer view animations
• Includes hover tooltips with dynamic bar charts
• Shows how to implement smooth animations using requestAnimationFrame

2. Clustering

• Implements advanced clustering of power plant locations
• Shows capacity-based clustering and labeling
• Demonstrates size-based visualization using feature layer renderer
• Includes interactive slider for capacity filtering
• Features smart capacity formatting (k, M units)

3. Basemap-gallery-component

• Implements a basemap gallery interface
• Allows users to switch between different basemap styles
• Shows how to create reusable components

4. Basemaps-and-projections

• Demonstrates working with various map projections
• Shows how to handle different coordinate systems
• Includes multiple basemap examples

5. Editor-component

• Implements feature editing capabilities
• Shows how to use the ArcGIS Editor widget
• Demonstrates feature layer management

6. Editor-3d-component

• Implements 3D feature editing capabilities
• Shows how to use the ArcGIS 3D Editor widget
• Demonstrates 3D feature layer management

7. Elevation-profile-component

• Creates elevation profile visualizations
• Shows terrain analysis capabilities
• Implements interactive elevation profiles

8. Weather-component

• Implements weather data visualization
• Shows how to work with weather layers
• Demonstrates interactive weather data display

9. Dot-density

• Implements dot density visualization
• Shows how to create dot density maps
• Demonstrates statistical visualization techniques

Prerequisites

To run any of these samples, you'll need:

• Node.js installed on your system

Getting Started

1. Choose a sample directory you want to explore
2. Follow the specific setup instructions in each sample's README.md
3. Run the development server using npm
4. Open your browser to view the sample

Development Setup

Each sample uses Vite as its build tool. To set up a new project:

npm create vite@latest

Contributing

Feel free to submit issues and enhancement requests!