Pull data from a Dataview-plugin table for the Charts-plugin

What I’m trying to do

I want to generate a chart from a table that itself has been generated with dataview.

Things I have tried

I tried to give the table a Block-ID, by referencing the table block with ^. Usually a ID like this ^170bd5 for example is generated, when a try to reference a specific block.

It works when I manually create a Table with an ID like this:

|       | Test1 | Test2 | Test3 |
| ----- | ----- | ----- | ----- |
| Data1 | 1     | 2     | 3.33  |
| Data2 | 3     | 2     | 1     |
| Data3 | 6.7   | 4     | 2     |


type: bar
id: mytableid
layout: rows
width: 80%
beginAtZero: true

But this doesn’t seem to work with a dataview generated table.

I don’t work with charts in Obsidian… how are you trying to make your chart?

It appears there is a way to do so in DataviewJS - Creating Dynamic Graphs in Obsidian - Obsidian Rocks.

To make a chart I use the second code snippet I posted within the lines “```Chart” at the beginning and a closing line at the end. This works with a manually created table like the one in the first code snippet.

The documentation you posted shows how to fetch file data with javascript. I hover hoped that I can just bind a dataview table to a chart via the Block-ID of that table. That way the data fetching would work via SQL queries in the dataview table and the chart just connects to that table.

All the charts I’ve built, and that isn’t that many, has used dataviewjs to gather the data, and then render it using a call to window.renderChart() or something like that.

In other words, I’d piggy back on the existing query, possibly convert it to dataviewjs using something like:


const result = await dv.query(`
  ... your DQL query ...

// Reformat into correct chart input
if (result.successful )  {
  // Do stuff to result.value.values
  window.renderChart( ... )
} else
  dv.paragraph("~~~~\n" + result.error + "\n~~~~")


Something along those lines.