- {
- html.split(INJECTION_REG).map((content, index) => {
- if (!content) {
- return null;
- }
- if (Demos[content]) {
- return (
-
- {this.props.renderDemo(content)}
-
- );
- }
- return (
-
- {content.split(INSERT_REG).map((__html, i) => {
- if (!__html) {
- return null;
- }
- if (Demos[__html]) {
- return (
-
- {this.props.renderDemo(__html, true)}
-
- );
- }
- return (
-
- );
- })}
-
- );
- })
- }
-
+
+
Welcome to the visualization tutorials!
+
+
+ In the following pages, we're going to learn how to use 3 of Uber's open source visualization libraries: React Map GL, Deck GL and React Vis. All of these libraries have a different function and work in the React ecosystem. We're going to build an app using each library separately.
+
+
+
+ React Map GL is a React wrapper on Mapbox: it allows you to render and interact with Mapbox maps in React applications.
+ Deck GL is an interface to use WebGL in React. With DeckGL, users build layers of visualized elements that they can superimpose. DeckGL works especially well with React Map GL, but is not limited to maps.
+ React Vis is Uber's charting library. It provides an abstraction to create, interact and style a variety of charts.
+ For the purpose of this tutorial, we're going to use a dataset of taxi pickups and dropoffs in New York, where this information is public.
+
+
+