Google 电子表格中的换行符未在 Google 图表中输出

这段代码工作完美，除了一个小格式问题，我找不到简单的方法来修复。作为数据源的谷歌电子表格在列中有换行符。然而，在表中，它们看起来好像只是由空格格式化的。我尝试在数据表中使用allowHthml选项（将换行符转换为
标签），但这会删除所有格式并使表格看起来很糟糕。我也尝试过“Formatter”类，但它似乎更倾向于字段串联，并且也遵循相同的 no-html 规则。

任何人都知道我在这里缺少的东西可以让换行符在表格中正确显示而不破坏格式。我想简单地将换行符添加到字段中，以便它们正确显示。

您可以将其复制/粘贴到 jsLint 中，它将运行并向您显示我在说什么。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {packages: ['table']});
</script>
<script type="text/javascript">


function drawVisualization() {

  var opts = {dataType:'jsonp'};

  var query = new google.visualization.Query('https://docs.google.com/spreadsheet/pub?key=0AiEVKSSB6IaqdDZBTGJqV0lLZEV3YS0teXZkOWR4M3c&output=html', opts);

  query.setQuery("select * ");

  // Send the query with a callback function.
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {  
  // Create and populate the data table.
  var data = response.getDataTable();

    // Create and draw the visualization.
  visualization = new google.visualization.Table(document.getElementById('table'));
  visualization.draw(data, null);
}
google.setOnLoadCallback(drawVisualization);

​

这可能是一个有点 hacky 的解决方案，但是使用 JavaScript 方法来实现怎么样？将字符串中的所有换行符替换为 标记 https://stackoverflow.com/questions/784539/replace-all-line-break-in-a-string-with-br-tag-in-javascript？我还添加了少量 CSS，以便新表格具有底部垂直对齐（就像原始电子表格那样）。

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('visualization', '1', {packages: ['table']});
</script>
<script type="text/javascript">

function drawVisualization() {
  var opts = {dataType:'jsonp'};
  var query = new google.visualization.Query('https://docs.google.com/spreadsheet/pub?key=0AiEVKSSB6IaqdDZBTGJqV0lLZEV3YS0teXZkOWR4M3c&output=html', opts);

  query.setQuery("select * ");

  // Send the query with a callback function.
  query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
  // Create and populate the data table.
  var data = new google.visualization.DataTable(
        response.getDataTable().toJSON().split("\\n").join("<br />"));

  var opts = {'allowHtml': true};

  // Create and draw the visualization.
  visualization = new google.visualization.Table(document.getElementById('table'));
  visualization.draw(data, opts);
}

google.setOnLoadCallback(drawVisualization);

</script>

<style type="text/css">
.google-visualization-table-td{
    vertical-align: bottom;
}
</style>
<div id="table"></div>