The Google Charts chart instance. Used to access
getChartLayoutInterface() for locating SVG elements.
The google.visualization.DataTable (or DataView) used
to draw the chart.
The DOM element the chart was drawn into.
Adapter options (chart type is required).
A Maidr object ready to be passed to <Maidr data={…}> or
set as the maidr / maidr-data attribute.
google.charts.load('current', { packages: ['corechart'] });
google.charts.setOnLoadCallback(() => {
const data = google.visualization.arrayToDataTable([
['City', 'Population'],
['New York', 8336817],
['Los Angeles', 3979576],
]);
const container = document.getElementById('chart');
const chart = new google.visualization.ColumnChart(container);
google.visualization.events.addListener(chart, 'ready', () => {
const maidr = createMaidrFromGoogleChart(chart, data, container, {
chartType: 'ColumnChart',
});
container.setAttribute('maidr', JSON.stringify(maidr));
});
chart.draw(data);
});
Creates a MAIDR data object from a rendered Google Charts chart.
Call this after the chart has finished rendering (inside the
google.visualization.events.addListener(chart, 'ready', …)callback) so that the container DOM already contains the SVG elements.