collection VS react-google-charts

I took the official dataset () from MoMA and visualized the artists who have at least one drawing in the museum's collection and lived in 20 century.

The X axis represents the year of birth, Y — lifespan, size — count of works, color — gender.

() https://github.com/MuseumofModernArt/collection/tree/master

Portico takes published museum collection data and turns it into a virtual gallery/viewing room dynamically. This example is the first few items from the published MOMA collection ((https://github.com/MuseumofModernArt/collection).

The collection includes two datasets - ‘Artist’ and ‘Artwork’ available in both CSV and JSON formats. The data can either be forked or downloaded directly from the GitHub page. However, the dataset has incomplete information and should only be used for research purposes. That is why it’s the perfect candidate as it resembles a real-world scenario where data is often missing.

On GitHub, MoMA publishes and periodically updates a public dataset which contains ~140,000 records, representing all of the works that have been accessioned into MoMA’s collection and cataloged in our database. It includes basic metadata for each work (e.g., title, artist, date made, medium, dimensions, and date of acquisition). This dataset is placed in the public domain using a CC0 License (so we're free to use it in this tutorial) and available in CSV and JSON formats.

Website: react-google-charts GitHub page

Install react-google-charts by using the following command:

In this lesson, we'll show how to realize an analytic dashboard from backend to front-end. We used MongoDB aggregation framework to make our task easier. In front-end, we used MDB Dashboard, React google charts package and HOC (High Order Components), a reusable layout component for our dashboard pages. 👉 https://youtu.be/HIWt4m8M3GQ 👉 Project link: https://github.com/emmannweb/eshopappltd.git 👉 https://www.npmjs.com/package/react-google-charts

The react-google-charts package is a modern, well-maintained, thin, typed, React wrapper for Google Charts that makes it super easy for developers to use React with Google Charts:

I like React Google Charts and React Charts Both are open source with MIT license.

react-google-charts - React-google-charts React component.

Now it's time to develop a front-end application telling the story behind the MoMA artworks collection with charts and other types of data visualizations. For simplicity, let's build it with pure JavaScript and without any frameworks (however, unofficial packages are available on NPM for React, Angular, and Vue as well as TypeScript definitions in the DefinitelyTyped repository).

Rating: 950 stars on GitHub