时间戳

首页 > 解决方案 > 谷歌图表创建相对 URL

javascript - 谷歌图表创建相对 URL

问题描述

我正在使用 Google Charts，我注意到图表的 URL 是一个相对 URL。示例： //chart.googleapis.com 而不是https://chart.googleapis.com

如果我使用图表代码创建单个 HTML 文件，则 URL 很好（使用 https），但在 PHP 应用程序提供的文件中，URL 是相对的。

在正常情况下，这不是问题，但我将图表导出为 PDF，如果没有完整的 url，图表不会在 PDF 上呈现。有没有人遇到同样的问题？

工作示例：

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {'packages':['imagesparkline']});
</script>
<div id="chart_div"></div>


<script>
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {

    var data = google.visualization.arrayToDataTable([
    ['Revenue', 'Licenses'],
    [435, 132],
    [438, 131],
    [512, 137],
    [460, 142],
    [491, 140],
    [487, 139],
    [552, 147],
    [511, 146],
    [505, 151],
    [509, 149]
    ]);

    var chart = new google.visualization.ImageSparkLine(document.getElementById('chart_div'));

    chart.draw(data, {width: 120, height: 40, showAxisLines: false,  showValueLabels: false, labelPosition: 'left'});
  }
</script>

这是一个工作示例的小提琴：https ://jsfiddle.net/br6837oq/

解决方案

用绝对 URL 替换相对 URL 解决了这个问题：

$html = str_replace('src="//chart.googleapis.com', 'src="https://chart.googleapis.com', $html);

标签： javascriptchartsgoogle-visualization

解决方案

推荐阅读