如何调整 Google Charts (WordTree) 以从 Google 表格 URL 获取数据源？ [关闭]答案

【问题标题】：How to adjust Google Charts (WordTree) to take data source from Google sheets URL? [closed]如何调整 Google Charts (WordTree) 以从 Google 表格 URL 获取数据源？ [关闭]
【发布时间】：2021-07-14 05:07:46
【问题描述】：

我想从 Google 表格 URL 创建 WordTree 作为数据源

wordTree 图表位于： https://developers.google.com/chart/interactive/docs/gallery/wordtree

并且可以找到更改数据源 https://developers.google.com/chart/interactive/docs/drawing_charts

但是我不断收到错误，无法抓取工作表并且代码无法运行

【问题讨论】：

希望替换此部分： function drawChart() { var data = google.visualization.arrayToDataTable( [ ['Phrases'], ['cats are better than dogs'], ['cats eat kibble '], ['猫比仓鼠好'], ['猫比小猫好'], ['猫是邪恶的'], ['猫很奇怪'], ['猫吃老鼠'], ] );到从谷歌表格中获取数据的行而不是docs.google.com/spreadsheets/d/…

标签： javascript charts google-visualization react-google-charts

【解决方案1】：

似乎与图表包装类一起使用...

google.charts.load('current', {
  packages: ['wordtree']
}).then(function () {
  var chart = new google.visualization.ChartWrapper({
    chartType: 'WordTree',
    containerId: 'chart',
    dataSourceUrl: 'https://docs.google.com/spreadsheets/d/1loB8SHnERMVCyjaWWkWi-ADmA99Yjf4FrgGD-oPUPdA/edit?usp=sharing',
    query: 'SELECT A,B',
    options: {
      wordtree: {
        format: 'implicit',
        word: 'patio'
      }
    }
  });
  chart.draw();
});

确保 query 属性设置为提取包含数据的列。

请看下面的小提琴...
https://jsfiddle.net/WhiteHat/L0vmk2tq/

【讨论】：

感谢您的回答是否可以切换到codepen？ jsfiddle在中国被屏蔽了，即使使用美国VPN我也无法访问（提前致谢）
看到这个codepen...