javascript - 我无法在谷歌图表的代码 javascript 中获取 json 数据(项目 Python Hello Dashboard 示例)

Question

Python Hello 仪表板示例 我不能运行这个项目。这个项目有一些问题，在文件 index.html 中:我无法为 DataTable 获取变量数据类型 JSON (dict)。

geodata = {{ data }} // error
geodata="{{data}}" //it is String not type JSON     

累积导致错误行 google.visualization.DataTable(geodata) 请帮助我!

<script type='text/javascript'>
 google.load('visualization', '1', {'packages':
   ['geochart']});
 google.setOnLoadCallback(drawMarkersMap);

 geodata = {{ data }} // error

 function drawMarkersMap() {
   if (! geodata) return;
   var data = new google.visualization.DataTable(geodata);

   var options = {
     region: 'US',
     displayMode: 'region',
     resolution: 'provinces',
     width: '800'
   };

   var chart = new google.visualization.GeoChart(
     document.getElementById('chart_div'));
   chart.draw(data, options);
};
</script>

它在这个链接中:https://developers.google.com/bigquery/articles/dashboard#downloadinstalllibraries

Answer 1

您需要更彻底地阅读教程。

{{ data }} 是一个模板占位符，它本身不是 JSON(而且根本不是有效的)。在本教程的进一步内容中，在呈现模板时会填充占位符:

@decorator.oauth_required
def get(self):
    data = { 'data': self._bq2geo(bq.Query(QUERY, BILLING_PROJECT_ID)),
             'query': QUERY }
    template = os.path.join(os.path.dirname(__file__), 'index.html')
    self.response.out.write(render(template, data))

data字典中的data键提供了需要填写的值； self._bq2geo() 方法生成 JSON 值:

def _bq2geo(self, bqdata):
    """geodata output for region maps must be in the format region, value.
       Assume the BigQuery query output is in this format and get names from schema.
    """
    logging.info(bqdata)
    columnNameGeo = bqdata['schema']['fields'][0]['name']
    columnNameVal = bqdata['schema']['fields'][1]['name']
    logging.info("Column Names=%s, %s" % (columnNameGeo, columnNameVal))
    geodata = { 'cols': ({'id':columnNameGeo,'label':columnNameGeo,'type':'string'},
      {'id':columnNameVal, 'label':columnNameVal, 'type':'number'})}
    geodata['rows'] = [];
    logging.info(geodata)
    for row in bqdata['rows']:
        newrow = ({'c':[]})
        newrow['c'].append({'v': 'US-'+row['f'][0]['v']})
        newrow['c'].append({'v':row['f'][1]['v']})
        geodata['rows'].append(newrow)
    logging.info('FINAL GEODATA---')
    logging.info(geodata)
    return json.dumps(geodata)

该方法返回一个 JSON 值，它替换了 {{ data }} 占位符字符串。