Javascript Highcharts - 导出模块
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7169869/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Highcharts - Exporting Module
提问by user906568
I am using highcharts to generate graphical data pulled from a database.
我正在使用 highcharts 生成从数据库中提取的图形数据。
I am having trouble using the exporting module. I have included the exporting property:
我在使用导出模块时遇到问题。我已经包括了出口财产：
exporting{
enabled:true
}
but the buttons do not appear...
但是按钮没有出现...
I have also linked the exporting.js to the file too...no buttons appear..
我也将exporting.js 链接到文件...没有按钮出现..
Has anyone else had this issue?
其他人遇到过这个问题吗？
EDIT:
编辑：
Here is the code:
这是代码：
$.ajax({
type:"POST",
url: "retrievechartdata.php",
data: {questionId:qId, questionIdTwo:qIdTwo, title:title, titleTwo:titleTwo, from:from, to:to},
dataType: "json",
success: function(data) {
//$("#response").html("<div class='successMessage'>"+ data.valuesTwo +"</div>");
var maxY = parseInt(data.max) + 1;
var minY = parseInt(data.min);
if(minY > 0){
minY = 0;
}else{
minY -= 1;
}
var cdata = new Array();
cdata= data.values.split(',');
for(var i=0;i<cdata.length;i++)
{
cdata[i]= parseInt(cdata[i]);
}
var leg = false;
var title = data.questionTitle;
if(data.valuesTwo != "FALSE"){
leg = true;
title += " & "+data.questionTitleTwo;
var cdataTwo = new Array();
cdataTwo = data.valuesTwo.split(',');
for(var i=0;i<cdataTwo.length;i++)
{
cdataTwo[i]= parseInt(cdataTwo[i]);
}
}
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
zoomType: 'x',
spacingRight: 20
},
credits: {
enabled: false
},
title: {
text: title
},
subtitle: {
text: document.ontouchstart === undefined ?
'Click and drag in the plot area to zoom in' :
'Drag your finger over the plot to zoom in'
},
xAxis: {
type: 'datetime',
maxZoom: 14 * 24 * 3600000, // fourteen days
lineWidth: 1,
lineColor: '#999999',
title: {
text: 'Date'
}
},
yAxis: {
title: {
text: data.questionTitle
},
labels: {
y: 2
},
lineWidth: 1,
lineColor: '#999999',
gridLineWidth: 1,
gridLineColor: '#eaeaea',
min: minY,
max: maxY,
startOnTick: false,
showFirstLabel: false
},
tooltip: {
shared: true
},
legend: {
enabled: leg
},
plotOptions: {
area: {
Color: {
linearGradient: [0, 0, 0, 600],
stops: [
[0, 'rgb(69, 114, 167)'],
[1, 'rgba(2,0,0,0)']
]
},
lineWidth: 1,
marker: {
enabled: false,
states: {
hover: {
enabled: true,
radius: 5
}
}
},
shadow: false,
states: {
hover: {
lineWidth: 1
}
}
}
},
series: [{
type: 'spline',
name: data.questionTitle,
pointInterval: 24 * 3600 * 1000,
pointStart: Date.UTC(data.year, data.month, data.day),
data: cdata,
lineColor: '#f6a828',
color: '#418ed6'
},
{
type: 'spline',
name: data.questionTitleTwo,
pointInterval: 24 * 3600 * 1000,
pointStart: Date.UTC(data.year, data.month, data.day),
data: cdataTwo,
lineColor: '#808080',
color: '#ff0000'
}],
exporting: {
enabled: true
}
})
回答by diosney
Which version of Highcharts you are using? Which version of jQuery?
您使用的是哪个版本的 Highcharts？哪个版本的jQuery？
Currently is the v2.1.6, I recommend you use the latest release because they are continuously fixing bugs, adding new functionality, etc.
当前是 v2.1.6，我建议您使用最新版本，因为它们会不断修复错误、添加新功能等。
Prior to v2.0 there is no support to the exporting feature
v2.0 之前不支持导出功能
The only things you need to do in order to bring the exporting module working are:
为了使导出模块工作，您需要做的唯一事情是：
1- First:Add the js script after the highcharts script, like this:
1-首先：在 highcharts 脚本之后添加 js 脚本，如下所示：
...
<script type="text/javascript" src="../js/highcharts.js"></script>
<!-- 1b) Optional: the exporting module -->
<script type="text/javascript" src="../js/modules/exporting.js"></script>
...
The exporting module is enabled by default, so there is no need to have the code you posted, so you can remove it:
导出模块默认启用，所以不需要你贴的代码，所以你可以删除它：
exporting{
enabled:true
}
2- Second:Be sure to publish the exporting-server/index.phpfile correctly.
2-第二：确保exporting-server/index.php正确发布文件。
Here you have what the official documentation reads about the exporting module installation:
在这里，您可以阅读有关导出模块安装的官方文档：
- Exporting module
From version 2.0 an exporting module is available for Highcharts, which allows users to download images or PDF's of your charts. This module consists of an extra JavaScript file, exporting.js, and a web service or server module written in PHP. Highslide Software offers the exporting web service free of charge. If you include the exporting module in your charts, two buttons will appear in the upper right. One button prints the chart, which is done on the client side only. The other button handles exporting. By default, an SVG representation of the chart is sent by POST to http://export.highcharts.com, where it is converted using Apache's Batik converter to PDF, PNG or JPEG.
See the navigation and exporting reference items for a full documentation for the options available. Also see under "Methods and Properties" in the reference for members releated to exporting.
- 导出模块
从 2.0 版开始，Highcharts 提供了一个导出模块，它允许用户下载图表的图像或 PDF。该模块由一个额外的 JavaScript 文件 exporting.js 和一个用 PHP 编写的 Web 服务或服务器模块组成。Highslide Software 提供免费的网络导出服务。如果在图表中包含导出模块，则右上角会出现两个按钮。一键打印图表，仅在客户端完成。另一个按钮处理导出。默认情况下，图表的 SVG 表示通过 POST 发送到http://export.highcharts.com，在那里使用 Apache 的蜡染转换器将其转换为 PDF、PNG 或 JPEG。
有关可用选项的完整文档，请参阅导航和导出参考项。另请参阅与导出相关的成员参考中的“方法和属性”。
Here you can see the configuration options regarding the exporting module: http://www.highcharts.com/ref/#exporting
在这里您可以看到有关导出模块的配置选项：http: //www.highcharts.com/ref/#exporting
Hope it helps you.
希望对你有帮助。
回答by user1385616
Make sure the script tag has
确保脚本标签有
type="text/javascript"
类型=“文本/javascript”
