Smart 3D City Web Apps with the

ArcGIS API for JavaScriptPascal Mueller, Michael Van den Bergh

Agenda

• Introduction to Smart 3D Cities – Pascal

• 3D JavaScript API Highlights – Pascal

• An Urban Planning Web App – Michael

- Filtering

- Edge Rendering

- “Polygon” Drawing Tool

• Conclusion & Outlook - Michael

Motivation & Application

Smart 3D Cities

What is a Smart City?

30,800 Cities & Local Governments

32,000 Businesses

11,500 States & Regional Agencies

12,600 NGOs

8,500 Utilities

11,000 Colleges & Universities

1,200 National Government Agencies

OrganizationsOur User Base

Traffic

CaliforniaCaltrans

Public Transit

Washington

Real-Time Parking Availability

Alabama

Traffic Management

Germany

Parking Capacity

North DakotaFargo

UndergroundNetwork Planning

Singapore Land Authority

Monitoring

Urban Heat Islands

Minneapolis

311 Dashboard

MassachusettsBoston

Citizen Problem Reporting

United KingdomSymology Ltd.

Pittsburgh

Income and % Minority

Senior Populations

Traffic and Air

Pollution

Poverty

Urban Observatory

7

Population Modeling

OaklandNic Jay Mapping

Understanding

Kirkland, WA

Walkability Score

Walk to Bus Service

Michigan

UKEGIS

Transit Stop Walk Times

San Francisco Planning

BostonThe Trust for Public Land

New Jersey

Green Infrastructure

Abu Dhabi, UAE

Land Use Planning

Miami-Dade

Urban Design

Gothenburg Sweden

Comprehensive Planning

KoreaKICT

District Revitalization

Oshkosh, WisconsinHouseal Lavinge Associates

Development Review

City Visualization

HelsingborgSweden

Hong Kong

Planning

n-Sphere AGSwitzerland

Noise Simulation

Sensitive Habitats

CaliforniaLos Angeles World Airports

Growth Capacity & Transit Planning

San Francisco

Historical Viewer

VirginiaBlue Raster

“Let’s Plan Together”

New ZealandFar North District Council

My Place Portal

IllinoisAurora

Outreach & Engagement

Public Service Information

China

Transit Corridors

Finland

Smart City Dashboard

Dubai

Take Away Messages

• Smart cities are implementing GIS-based solutions for

both smarter maintenance and smarter development

• Smart cities are going 3D, especially for

planning and engagement

3D web API is required

Relevant 3D Features

ArcGIS API for JavaScript 4.x

City of Helsinki

City of Zurich

Smart Mapping

C-through

City of Zurich

Filtering & Querying

Skyscraper Explorer

Overlays & Labeling

Mobile Support

Edge Rendering

Take Away Messages

• ArcGIS API for JavaScript 4.x integrates very well with

existing GIS, especially Pro

• ArcGIS API for JavaScript 4.7 is snappy fast, supports

mobile, and looks beautiful

3D web API for planning & engagement apps