Working with CARTO VL

In a previous post we introduced CARTO VL (beta) a new Javascript library for making vector-based client-side visualizations. This new offering marks a significant advancement of in-browser functionality for Location Intelligence applications powered by CARTO.

Recently our company held a hackathon to test CARTO VL and the results are astounding. In the post we’ll take a look at some CARTO VL map submissions from our hackathon while highlighting feature advancements in each entry.

Seamless UX Experience

No matter how advanced the design Location Intelligence apps processing and rendering data through a server are at the whims of the server’s performance. While server-side and client-side rendering both have pros and cons when it comes to making digital maps client-side rendering enables greater user engagement. Instead of requesting a full page reload from the server each time a user changes the view CARTO VL uses JavaScript to load only the new view in the user’s web browser.

The Spanish night club map below submitted by our solutions engineers Elena Ernesto and Abel is a great example of this feature enhancement. Users can visualizes night club locations based on music type with the dataview panel on the right-hand side but when users select another type of music the only content change is the night club locations. Check it out:

Did I forget to mention that when users select a style that a sample of that music plays? CARTO VL also allowed the team to make night club markers styled to the audio file frequency for each music genre! The fluid UX experience can increase app engagement keeping users active for longer periods of time.

Advanced Styling

CARTO VL simplifies the process for vector visualizations using a new accessible styling language. Now with a quick visit to our Developer Center users can bring to life the static dynamic and data-driven components of their thematic maps with just a few lines of code.

In the submission below Jeff and Hannah styled foot traffic data around New York City using a color code to identify different types of business across the city and symbol size to show volume of traffic. The difference between the inner and outer ring styles represents the difference between unique and total visitors for each business which provides a snapshot into businesses with high volume of returning customers.

Finally in this submission from Cillias Ariana and Mariana 12 000 volcanoes and 11 000 eruptions from 1950 to the present are visualized. What’s amazing about this entry is that interactive features not only guide user engagement with the map but also allow users themselves to control the styling parameters with the panel on the right-hand side.

What’s next…

CARTO VL is currently in beta form and continues to grow with feedback from our community of users. Make sure to check out our Developer Center for more insights and updates on all things CARTO VL!