Menu Sidebar

ArcGIS JavaScript API Camera Helper

In a custom web map app, when creating your initial view, you usually start with the x/y (latitude/longitude) and an initial zoom level. When creating 3D web map apps that’s a bit harder, because you have to worry about the camera tilt and heading too. To make this process easier, I recently shared a little tool …

The ArcGIS JS API Camera Helper is a simple app that allows you to zoom to the exact location and camera tilt/angle that you’d like your 3D app to start with, then you can copy/paste the “camera” settings into your own JavaScript app, or generate a Codepen sample and start coding right from there.

This was inspired by David Spriggs’s js-extent-helper (which I believe was inspired by a Flex version of the similar idea before that).

Please try it out and let me know what you think! The code is posted on Github.

PS – for 2D “Extents”, check out ArcGIS JavaScript API Extent Helper (also on GitHub)

Top 5 Interesting Basemaps of 2019

5. Charted Territory

This basemap takes its inspiration from a printed atlas plate and pull-down scholastic classroom maps. (more details)

Avo Patlong took this basemap and modified it into a “1950s styled” version.

4. Western Map

Elizabeth Sutherland at the Western University of Canada created this map in the style of the WU school colors. (more details)

3. Seasons

Andrew Skinner and the Esri Basemaps team put together a series of four basemaps, each one representing one of the seasons of the year. It has minimal labels and is designed to draw attention to your thematic content.

2. Pop Art

This basemap celebrates the “pop art” movement from the 1950s-1960s. (more details)

1. Breath of the World

Jonah Adkins created a vector basemap replicating the style of the Nintendo video game The Legend of Zelda: Breath of the Wild. (more details / item page)

Honorable Mentions

I wanted to list a few more basemaps here that I found notable:

  • Newspaper – This basemap, designed by Esri, has been around for a few years but I still enjoy the newsprint look and feel.
  • Primary Colors – I created this map for the January Codepen challenge – it focuses on three primary colors – blue, red, yellow.
  • A Children’s Map – Created by Andrew Skinner, focuses on simple, childhood themes.

Do you have an idea for a basemap of your own? Create your own in the ArcGIS Vector Tile Style Editor. (Step by step guide can be found here.) If you do, please post the link in the comments below!

Three Tips to Reduce Personal Data Tracking in 2019

1. Switch to Firefox

  • Why: You’re probably using Chrome right now. Google is the maintainer and distributor of Chrome, and have recently been making some decisions with the browser that are not in favor of privacy. Firefox has been making performance strides over the past few years and is basically as speedy as Chrome now, and is a much more privacy-respecting browser.
  • How: Download and install the desktop browser. Don’t forget to set it as your default browser. Go into Options > “Privacy and Security” and enable “Block Trackers: Always”, “Block Third Party Cookies: All”, “Send Do Not Track: Always.” Use Firefox Sync to sync your bookmarks and other settings securely.
  • Bonus: Install Firefox and/or Firefox Focus on your phone.

2. Switch to DuckDuckGo

  • Why: Google tracks every search and uses it to target advertising. If you’re logged into your Google (Gmail) account, they will associate your searching patterns with your email patterns to build a powerfully accurate and personal profile on you. DuckDuckGo is almost as good as Google in terms of search results, and does not collect or share your personal information.
  • How: Go into your web browser (Firefox, Chrome, etc.) settings and change your default search provider to DuckDuckGo.

3. Block Facebook at the DNS level

  • Why: Facebook tracks you across the internet using embedded “like” buttons that websites voluntarily place on their sites. Whether you’re logged in or not, they can track you as you browse the internet without your consent.
  • How: Add these entries to your hosts file. Instructions are OS dependent, and are at the top of the file.

St. Louis Imagery – 1990 to Now

What kind of changes to the built environment happened in your city within the past 25 years? Looking at and comparing aerial imagery can be an informative and compelling way to investigate changes. In St. Louis, many large building developments have happened over the years including:

… and much more. Luckily for the St. Louis region, the MSDIS maintains imagery services across different years. I recently found one of their imagery services from 1990 and put it into an application to compare it to more recent (I think ~2015) imagery. Check it out:

I’ve added a few preset locations to the application to some heavily changed, interesting areas. What areas of interest do you have? Let me know in the comments below.

Getting the Microsoft US Building Footprints into ArcGIS Pro

Update: there’s now an easier way to get this data into ArcGIS Pro. Please see the script that is linked in Arthur’s comment here.

Last week, Microsoft Released 125 million Building Footprints in the US as Open Data. This is a pretty exciting release of open geospatial data.

If you go to the data download page and grab one of the state json files, if you try to load this into ArcGIS Pro with the JSON to Features tool, it’s currently failing for me. I’m not totally sure why it’s failing — maybe because of the format or size of the JSON file. To get around this issue, let’s convert the GeoJSON file to Esri JSON features before importing.

To do this conversion, we’ll use the arcgis-to-geojson-utils tool.

Prerequisite: NodeJS installed.

  1. Create a new folder
  2. In that new folder, save one of the JSON files from the data source. I recommend a small file like Washington DC for your first run. (** more on that below)
  3. In that new folder, open a terminal and run: npm init … and answer all the questions
  4. Then run: npm install --save @esri/arcgis-to-geojson-utils
  5. Create a new file: index.js and put in the following script:

… replacing “FILENAME.json” on line 4 with the name of your input file that you downloaded above.

Finally, in your terminal run: node index.js. This will save a file called “out.json” that you can then input into the JSON to Features tool in ArcGIS Pro to get access to this data in Pro.

Note (**) that this script will only work for smaller sized files. The large state files that are greater than 200MB, you may need to split those up and run them separately, or write a script that loops through the JSON one line at a time. If you do this and want to share, please post in the comments below.

Older Posts

Gavin Rehkemper

JavaScript, WordPress, and GeoDev