canvg未定义错误

Question

canvg未定义错误

4

我正在尝试使用Battlehorse的代码将Google Visualization图表转换为图片并保存到服务器上。我能够在本地主机上使其工作，但是当我尝试在Web服务器上使用时，出现错误“canvg未定义”。Web服务器运行的是IIS 7。我已经搜索了很多资料，但没有找到有关此错误的任何信息。是否有人知道是什么原因导致了这个错误，或者如何解决它？

http://www.battlehorse.net/page/topics/charts/save_google_charts_as_image.html

输入图片描述

代码示例：

<html>
<head>
<script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/rgbcolor.js"></script> 
<script type="text/javascript" src="http://canvg.googlecode.com/svn/trunk/canvg.js"></script>
<script type="text/javascript">
function getImgData(chartContainer) {
  var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode;
  var svg = chartArea.innerHTML;
  var doc = chartContainer.ownerDocument;
  var canvas = doc.createElement('canvas');
  canvas.setAttribute('width', chartArea.offsetWidth);
  canvas.setAttribute('height', chartArea.offsetHeight);

  canvas.setAttribute(
  'style',
  'position: absolute; ' +
  'top: ' + (-chartArea.offsetHeight * 2) + 'px;' +
  'left: ' + (-chartArea.offsetWidth * 2) + 'px;');
  doc.body.appendChild(canvas);
  canvg(canvas, svg);
  var imgData = canvas.toDataURL("image/png");
  canvas.parentNode.removeChild(canvas);
  return imgData;}           

function alert10() {
  try {
    var textbox1 = document.getElementById('textbox1');
    textbox1.value = getImgData(document.getElementById('chart1_div'));           
  }
  catch (err) {
    alert(err.message);
  }
}
</script>
</head>

- Jonathan

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jonathan · Accepted Answer

我找到了问题所在。这个网站启用了SSL，而我调用的外部脚本文件使用了http协议。我需要将外部脚本文件的引用地址调整为使用https，或者改为相对路径，像这样：

<script type="text/javascript" src="//canvg.googlecode.com/svn/trunk/rgbcolor.js"></script> 
<script type="text/javascript" src="//canvg.googlecode.com/svn/trunk/canvg.js"></script>

使用协议相对路径，例如 "//..."，可以确保在HTTP和HTTPS中均可正常工作。