Javascript Highcharts折线图内存不足
我正在尝试使用Highcharts填充折线图。它一直工作得很好,直到几天前,它开始破坏Chrome浏览器,Internet Explorer出现“SCRIPT7:内存不足”错误。我有3个其他的折线图是用同样的方法制作的,效果很好。此图表作为柱状图非常有用 这是你的电话号码。代码如下:Javascript Highcharts折线图内存不足,javascript,jquery,highcharts,underscore.js,Javascript,Jquery,Highcharts,Underscore.js,我正在尝试使用Highcharts填充折线图。它一直工作得很好,直到几天前,它开始破坏Chrome浏览器,Internet Explorer出现“SCRIPT7:内存不足”错误。我有3个其他的折线图是用同样的方法制作的,效果很好。此图表作为柱状图非常有用 这是你的电话号码。代码如下: function average(arr) { return _.reduce(arr, function(memo, num) { var total = memo + num;
function average(arr) {
return _.reduce(arr, function(memo, num) {
var total = memo + num;
return memo + num;
}, 0) / (arr.length === 0 ? 1 : arr.length);
}
function translateMonth(d) {
var month;
if (d.getMonth() === 0) {
month = 'Jan';
} else if (d.getMonth() === 1) {
month = 'Feb';
} else if (d.getMonth() === 2) {
month = 'Mar';
} else if (d.getMonth() === 3) {
month = 'Apr';
} else if (d.getMonth() === 4) {
month = 'May';
} else if (d.getMonth() === 5) {
month = 'Jun';
} else if (d.getMonth() === 6) {
month = 'Jul';
} else if (d.getMonth() === 7) {
month = 'Aug';
} else if (d.getMonth() === 8) {
month = 'Sep';
} else if (d.getMonth() === 9) {
month = 'Oct';
} else if (d.getMonth() === 10) {
month = 'Nov';
} else if (d.getMonth() === 11) {
month = 'Dec';
}
return month;
}
var npsData = [];
npsData = [{
avg: 100,
coach: "NUNES",
date: "Jul"
},{
avg: 100,
coach: "NUNES",
date: "Jul"
},{
avg: 100,
coach: "NUNES",
date: "Jul"
},{
avg: 100,
coach: "NUNES",
date: "Jul"
},{
avg: 100,
coach: "NUNES",
date: "Aug"
},{
avg: 100,
coach: "NUNES",
date: "Aug"
}]
var npsChartData = [];
npsChartData = _.chain(npsData)
.groupBy("date")
.map(function(value, key) {
return {
name: key,
y: parseFloat(Math.round(average(_.pluck(value, "avg"))))
}
})
.value();
var chart4 = new Highcharts.Chart({
chart: {
type: 'line',
renderTo: 'postCoachingSurvey',
plotBorderColor: '#0574AC',
borderWidth: .5,
plotShadow: true
},
credits: {
enabled: false
},
title: {
text: 'Post Coaching Survey',
style: {
color: '#666666',
fontWeight: 'bold'
}
},
legend: {
enabled: false,
itemStyle: {
color: '#868686',
fontSize: '10px'
}
},
xAxis: {
categories: _.pluck(npsChartData, name),
labels: {
enabled: true,
formatter: function() {
return this.value;
}
}
},
yAxis: {
tickPositioner: function () {
var positions = [],
tick = Math.floor(this.dataMin),
increment = Math.ceil((this.dataMax - this.dataMin) / 6);
for (tick; tick - increment <= this.dataMax; tick += increment) {
positions.push(tick);
}
//console.log (positions);
return positions;
}, title: {
text: 'eNPS',
style: {
color: '#666666'
}
},
labels: {
format: '{value}%'
}
},
tooltip: {
enabled:false,
pointFormat: '{point.y}' + '%',
crosshairs: true
//percentageDecimals: 1
},
plotOptions: {
series: {
cursor: 'pointer',
dataLabels: {
enabled: true,
//formatter: function() {
//return '{point.y}' + '%';
//}
}
}
},
series: [{
type: 'line',
name: 'Nps Average Score',
data: npsChartData,
color: '#EB6E00'
}]
});//end chart4
函数平均值(arr){
返回u.reduce(arr,函数(memo,num){
var总计=备忘录+数量;
返回备忘录+num;
},0)/(arr.length==0?1:arr.length);
}
函数translateMonth(d){
var月;
如果(d.getMonth()==0){
月份=‘一月’;
}else if(d.getMonth()==1){
月份='二月';
}else if(d.getMonth()==2){
月份=三月;
}else if(d.getMonth()==3){
月份='四月';
}else if(d.getMonth()==4){
月=五月;
}else if(d.getMonth()==5){
月份=六月;
}else if(d.getMonth()==6){
月份='七月';
}else if(d.getMonth()==7){
月份='八月';
}else if(d.getMonth()==8){
月=九月;
}else if(d.getMonth()==9){
月份='十月';
}else if(d.getMonth()==10){
月份='11月';
}else if(d.getMonth()==11){
月份=‘12月’;
}
返回月份;
}
净现值数据=[];
npsData=[{
平均值:100,
教练:“努内斯”,
日期:“7月”
},{
平均值:100,
教练:“努内斯”,
日期:“7月”
},{
平均值:100,
教练:“努内斯”,
日期:“7月”
},{
平均值:100,
教练:“努内斯”,
日期:“7月”
},{
平均值:100,
教练:“努内斯”,
日期:“8月”
},{
平均值:100,
教练:“努内斯”,
日期:“8月”
}]
var npsChartData=[];
npsChartData=u2;.chain(npsData)
.groupBy(“日期”)
.map(函数(值、键){
返回{
姓名:key,,
y:parseFloat(数学圆整(平均值,平均值)
}
})
.value();
var chart4=新的高点图表。图表({
图表:{
键入:“行”,
renderTo:“事后调查”,
plotBorderColor:“#0574AC”,
边框宽度:.5,
plotShadow:对
},
学分:{
已启用:false
},
标题:{
文本:“辅导后调查”,
风格:{
颜色:“#666666”,
fontWeight:“粗体”
}
},
图例:{
启用:false,
项目样式:{
颜色:“#868686”,
字体大小:“10px”
}
},
xAxis:{
类别:uu.pull(npsChartData,名称),
标签:{
启用:对,
格式化程序:函数(){
返回此.value;
}
}
},
亚克斯:{
定位器:功能(){
var头寸=[],
勾选=数学地板(this.dataMin),
增量=Math.ceil((this.dataMax-this.dataMin)/6);
对于(勾号;勾号-增量,此图表的特定数据会在代码中显示错误。您的yAxis.tickPositioner
函数中有一个无休止的循环。您有以下代码:
increment = Math.ceil((this.dataMax - this.dataMin) / 6);
for (tick; tick - increment <= this.dataMax; tick += increment) {
// ...
}
只需为月份名称使用一个数组,就可以检查您的dataMin/dataMax和increment是否为null/zero值。添加条件以检查这一点。
increment = Math.max(1, Math.ceil((this.dataMax - this.dataMin) / 6));