Is there a way to visualize Chart by its spec obtained from Sheets API using Node.js?

[Norbert Raab]

I use Google Sheets API from googleapis to get a spreadsheet and its charts. So I have ChartSpec. How can be this spec used to visualize the chart in a web application, e.g. using Visualization API? Use case

A simple web app written in HTML and JS which shows all charts from an arbitrary spreadsheet. In the ideal scenario, the charts are rendered just like in spreadsheets, so I can see the charts without the necessity to open a spreadsheet manually.

1. A user selects a spreadsheet from a list of predefined spreadsheets (menu)
2. Web app requests up-to-date data for the selected spreadsheet from Node.js backend
3. Node.js app gets all charts in the spreadsheet using Google Sheets API
4. Node.js app responds with necessary data
5. Web app visualizes the charts that should ideally be interactive (eg. using Visualization API)

Problem

I have a trouble with steps 4 and 5. In step 3 I receive ChartSpec which seems to contain all information but data. Instead of data, there are just references to ranges in a form of ChartData object.

Creating a custom implementation which gets all referenced data seems extremely complicated. Even if I created it on my own, I do not know how to create visualizations in step 5.

What I found and why it is not solution for me? There are similar questions and solutions that use Visualization API to query data from a spreadsheet and the visualize it, such as this answer. Why is this not solution for me? Because my spreadsheets are created by non-tech people who do not follow any good practices, so data cannot be easily queried using Query API. The spreadsheets are a mess. The charts are created by the same folks and they want to customize it by themselves. What I need is to show already existing charts without necessity to make any chart-wise code.