Javascript highchart csv导出自定义文件名和值 请参考下面的JS fiddle链接。 https://jsfiddle.net/2pd1natw/1/ //这是我的JS供参考 $(函数(){ var k=0; $(“#容器”)。高图({ 图表:{ 键入:“列”, zoomType:'xy', 活动:{ 向下展开:函数(e){ 如果(!e.系列选项){ var图表=此, 深入调查={ '2015':{ 名称:“2015年”, 数据:[ ['Q4-2015',89] ] }, '2016':{ 名称:“2016年”, 数据:[ ['Q2-2016',95], ['Q3-2016',99] ] } }, 钻孔下钻线={ '2015':{ 类型:“样条线”, 名称:“2015年”, 数据:[ ['Q4-2015',11.45] ], 亚克斯:1 }, '2016':{ 类型:“样条线”, 名称:“2016年”, 亚克西斯:1,, 数据:[ ['Q2-2016',11.2], ['Q3-2016',11.5] ] } }, 系列=向下钻取[e.point.name], 系列线=向下钻线[e.point.name]; 图表。添加单一系列向下倾斜(e.点,系列); 图表。添加单一系列向下倾斜(e.点、系列线); chart.applyDrilldown(); } } } }, 标题:{ 文本:“租金和资本价值趋势” }, 出口:{ 启用:对, csv:{ ColumnHeadPerformatter:功能(项、键、系列){ 如果(键==''| |键===未定义){ 回归期; }else if(key=='y'&&k==0){ k=k+1; 返回“租金价值(卢比/平方英尺/月)”; }else if(key=='y'&&k==1){ k=0; 返回“资本价值(卢比/平方英尺)”; } } }, 按钮:{ 上下文按钮:{ 菜单项:[{ textKey:“下载CSV”, onclick:function(){ 这个.downloadCSV(); } }] } } }, xAxis:{ 类型:'类别', }, 亚克斯:[{ 分:0,, 标题:{ 文本:“租金价值(卢比/平方英尺/月)” }, 标签:{ 格式:“{value}” } }, { 分:0,, 时间间隔:5, 标题:{ 正文:“资本价值(卢比/平方英尺)” }, 标签:{ 格式:“{value}K” }, 相反:对 }], 工具提示:{ 格式化程序:函数(){ var s=''; $.each(this.points,function(){ if(this.series.type=='spline'){ s+='资本价值:'+this.y+'K'; }否则{ s+='租金值:'+this.y; } }); 返回s; }, 分享:真的 }, 图例:{ 布局:“水平”, 对齐:“左”, 大小:“12px”, x:50, 垂直排列:“底部”, y:20, 浮动:对 }, 打印选项:{ 系列:{ 边框宽度:0, 数据标签:{ 已启用:false } } }, 系列:[{ 名称:“雷诺价值(卢比/平方英尺/月)”, 颜色:“#EE8908”, 数据:[ { 名称:“2015年”, y:89, 深入调查:正确 }, { 名称:“2016年”, y:90, 深入调查:正确 } ] },{ 名称:“资本价值(卢比/平方英尺)”, 颜色:“#F8BB6C”, 类型:'样条', 亚克西斯:1,, 数据:[ { 名称:'2015', y:11.45 },{ 名称:'2016', y:15.22 } ], 工具提示:{ valueSuffix:'K' } } ], 向下展开:{ /*activeAxisLabelStyle:{ text装饰:“无” },*/ 系列:[] } }); });
有两种情况我被卡住了Javascript highchart csv导出自定义文件名和值 请参考下面的JS fiddle链接。 https://jsfiddle.net/2pd1natw/1/ //这是我的JS供参考 $(函数(){ var k=0; $(“#容器”)。高图({ 图表:{ 键入:“列”, zoomType:'xy', 活动:{ 向下展开:函数(e){ 如果(!e.系列选项){ var图表=此, 深入调查={ '2015':{ 名称:“2015年”, 数据:[ ['Q4-2015',89] ] }, '2016':{ 名称:“2016年”, 数据:[ ['Q2-2016',95], ['Q3-2016',99] ] } }, 钻孔下钻线={ '2015':{ 类型:“样条线”, 名称:“2015年”, 数据:[ ['Q4-2015',11.45] ], 亚克斯:1 }, '2016':{ 类型:“样条线”, 名称:“2016年”, 亚克西斯:1,, 数据:[ ['Q2-2016',11.2], ['Q3-2016',11.5] ] } }, 系列=向下钻取[e.point.name], 系列线=向下钻线[e.point.name]; 图表。添加单一系列向下倾斜(e.点,系列); 图表。添加单一系列向下倾斜(e.点、系列线); chart.applyDrilldown(); } } } }, 标题:{ 文本:“租金和资本价值趋势” }, 出口:{ 启用:对, csv:{ ColumnHeadPerformatter:功能(项、键、系列){ 如果(键==''| |键===未定义){ 回归期; }else if(key=='y'&&k==0){ k=k+1; 返回“租金价值(卢比/平方英尺/月)”; }else if(key=='y'&&k==1){ k=0; 返回“资本价值(卢比/平方英尺)”; } } }, 按钮:{ 上下文按钮:{ 菜单项:[{ textKey:“下载CSV”, onclick:function(){ 这个.downloadCSV(); } }] } } }, xAxis:{ 类型:'类别', }, 亚克斯:[{ 分:0,, 标题:{ 文本:“租金价值(卢比/平方英尺/月)” }, 标签:{ 格式:“{value}” } }, { 分:0,, 时间间隔:5, 标题:{ 正文:“资本价值(卢比/平方英尺)” }, 标签:{ 格式:“{value}K” }, 相反:对 }], 工具提示:{ 格式化程序:函数(){ var s=''; $.each(this.points,function(){ if(this.series.type=='spline'){ s+='资本价值:'+this.y+'K'; }否则{ s+='租金值:'+this.y; } }); 返回s; }, 分享:真的 }, 图例:{ 布局:“水平”, 对齐:“左”, 大小:“12px”, x:50, 垂直排列:“底部”, y:20, 浮动:对 }, 打印选项:{ 系列:{ 边框宽度:0, 数据标签:{ 已启用:false } } }, 系列:[{ 名称:“雷诺价值(卢比/平方英尺/月)”, 颜色:“#EE8908”, 数据:[ { 名称:“2015年”, y:89, 深入调查:正确 }, { 名称:“2016年”, y:90, 深入调查:正确 } ] },{ 名称:“资本价值(卢比/平方英尺)”, 颜色:“#F8BB6C”, 类型:'样条', 亚克西斯:1,, 数据:[ { 名称:'2015', y:11.45 },{ 名称:'2016', y:15.22 } ], 工具提示:{ valueSuffix:'K' } } ], 向下展开:{ /*activeAxisLabelStyle:{ text装饰:“无” },*/ 系列:[] } }); });,javascript,csv,highcharts,Javascript,Csv,Highcharts,有两种情况我被卡住了 当我尝试在向下钻取后将图表导出为csv时,下载的文件名应为“季度租赁资本趋势”,向下钻取前为“年度租赁资本趋势”。 e、 g.在深入调查之前,文件名应类似于“Year rental capital trend.cs Please refer below JS fiddle link. https://jsfiddle.net/2pd1natw/1/ // this is my JS for reference $(function () { var k
Please refer below JS fiddle link.
https://jsfiddle.net/2pd1natw/1/
// this is my JS for reference
$(function () {
var k = 0;
$('#container').highcharts({
chart: {
type: 'column',
zoomType: 'xy',
events: {
drilldown: function (e){
if (!e.seriesOptions) {
var chart = this,
drilldowns = {
'2015':{
name: '2015',
data: [
['Q4-2015',89]
]
},
'2016':{
name: '2016',
data: [
['Q2-2016',95],
['Q3-2016',99]
]
}
},
drilldownsLines = {
'2015':{
type: 'spline',
name: '2015',
data: [
['Q4-2015',11.45]
],
yAxis: 1
},
'2016':{
type: 'spline',
name: '2016',
yAxis: 1,
data: [
['Q2-2016',11.2],
['Q3-2016',11.5]
]
}
},
series = drilldowns[e.point.name],
seriesLine = drilldownsLines[e.point.name];
chart.addSingleSeriesAsDrilldown(e.point, series);
chart.addSingleSeriesAsDrilldown(e.point, seriesLine);
chart.applyDrilldown();
}
}
}
},
title: {
text: 'Rental & Capital Value Trend'
},
exporting: {
enabled: true,
csv:{
columnHeaderFormatter:function(item, key, series){
if(key === '' || key === undefined){
return 'Period';
}else if(key === 'y' && k == 0){
k = k + 1;
return 'Rental Value (INR/SF/Month)';
}else if(key === 'y' && k == 1){
k = 0;
return 'Capital Value (INR/SF)';
}
}
},
buttons:{
contextButton:{
menuItems: [{
textKey: 'downloadCSV',
onclick: function (){
this.downloadCSV();
}
}]
}
}
},
xAxis: {
type: 'category',
},
yAxis: [{
min: 0,
title: {
text: 'Rental Value (INR/SF/Month)'
},
labels: {
format: '{value}'
}
}, {
min:0,
tickInterval:5,
title: {
text: 'Capital Value (INR/SF)'
},
labels: {
format: '{value} K'
},
opposite:true
}],
tooltip:{
formatter:function(){
var s='';
$.each(this.points, function () {
if(this.series.type == 'spline'){
s += '<br/>Capital Value : ' + this.y+ 'K';
}else{
s += '<br/> Rental Value : ' + this.y;
}
});
return s;
},
shared:true
},
legend: {
layout: 'horizontal',
align: 'left',
size: '12px',
x: 50,
verticalAlign: 'bottom',
y: 20,
floating: true
},
plotOptions: {
series: {
borderWidth: 0,
dataLabels: {
enabled: false
}
}
},
series: [{
name: 'Renatl Value (INR/SFT/Month)',
color: '#EE8908',
data: [
{
name: '2015',
y: 89,
drilldown: true
}, {
name: '2016',
y: 90,
drilldown: true
}
]
},{
name:'Capital Value (INR/SF)',
color:'#F8BB6C',
type:'spline',
yAxis:1,
data:[
{
name:'2015',
y:11.45
},{
name:'2016',
y:15.22
}
],
tooltip: {
valueSuffix: 'K'
}
}
],
drilldown: {
/*activeAxisLabelStyle: {
textDecoration: 'none'
},*/
series: []
}
});
});