0

Suppose I have an online store in San Francisco, California. Most of my customers are from the Bay Area, but I do have some customers from the rest of the U.S.

For my analytics platform, I want to build a map that initially shows my customers in the Bay Area (one dot for each customer at their residential address). Then it will gradually and continuously zoom out to show all the customers in the entire U.S.

When it has completely zoomed out, the center of the map should be the center of the U.S. (usually thought to be in Kansas).

What software can I use for this?

I don't mind coding something up from scratch (e.g. from Javascript) if there isn't anything prebuilt in other software packages e.g. ArcGIS.

closed as too broad by PolyGeo Jul 31 at 19:49

Please edit the question to limit it to a specific problem with enough detail to identify an adequate answer. Avoid asking multiple distinct questions at once. See the How to Ask page for help clarifying this question. If this question can be reworded to fit the rules in the help center, please edit the question.

  • I'd probably use JS for this. Apparently Leaflet has a 'flyTo' method which can animate both pan and zoom, as per this answer on SO. Not tried it myself though. – Steven Kay Jul 31 at 19:31
  • To make this not be asking the community to develop you a list of candidate software you could instead describe the functionality that you seek (which you have) and ask what that functionality is called. Armed with that you can search for software that supports it. – PolyGeo Jul 31 at 19:51
  • Leaflet JavaScript library (leafletjs.com) is definitely the simplest way to go and it covers all your described needs too. – TomazicM Jul 31 at 19:53
1

I would guess that almost all mature JS mapping libraries have this capability. In the case of the ArcGIS API for JavaScript I would take a look at the MapView class and the goTo() method.

If you check their examples you will see that its pretty straightforward and does exactly what you are asking for.

var pt = new Point({
  latitude: 49,
  longitude: -126
});

var opts = {
  duration: 5000  // Duration of animation will be 5 seconds
};

// go to point at LOD 15 with custom duration
view.goTo({
  target: pt,
  zoom: 15
}, opts);

// go to the given point
view.goTo(pt);

Take a look at the documentation because there are several options you can configure.

Not the answer you're looking for? Browse other questions tagged or ask your own question.