У меня странная проблема с высокими графиками. У меня есть 5 маленьких графиков подряд, и иногда одна или две из них случайным образом не рисуются на экране.
Это код, который я использую
// Twitter
// The file twitter_history.tsv is being manually generated by a given excel
$.ajax({
type: "GET",
url: "downloads/twitter_history.tsv",
dataType: "text",
success: function(data) {
var twitter_hist_new_followers_options = {
chart: {
renderTo: 'fol_mini',
backgroundColor: null,
borderWidth: 0,
type: 'area',
margin: [2, 0, 2, 0],
style: {
overflow: 'visible'
},
// small optimalization, saves 1-2 ms each sparkline
skipClone: true,
zoomType: 'x'
},
exporting: { enabled: false },
title: null,
credits: {
enabled: false
},
xAxis: {
categories: [],
labels: {
enabled: false
},
title: {
text: null
},
startOnTick: false,
endOnTick: false,
tickPositions: []
},
yAxis: {
endOnTick: false,
startOnTick: false,
labels: {
enabled: false
},
title: {
text: null
},
tickPositions: [0]
},
legend: {
enabled: false
},
series: [{
name: 'Followers',
data: []
}]
};
var twitter_hist_tweet_impressions_options = {
chart: {
renderTo: 'imp_mini',
backgroundColor: null,
borderWidth: 0,
type: 'area',
margin: [2, 0, 2, 0],
style: {
overflow: 'visible'
},
// small optimalization, saves 1-2 ms each sparkline
skipClone: true,
zoomType: 'x'
},
exporting: { enabled: false },
title: null,
credits: {
enabled: false
},
xAxis: {
categories: [],
labels: {
enabled: false
},
title: {
text: null
},
startOnTick: false,
endOnTick: false,
tickPositions: []
},
yAxis: {
endOnTick: false,
startOnTick: false,
labels: {
enabled: false
},
title: {
text: null
},
tickPositions: [0]
},
legend: {
enabled: false
},
series: [{
name: 'Impressions',
data: []
}]
};
var twitter_hist_number_of_tweets_options = {
chart: {
renderTo: 'twe_mini',
backgroundColor: null,
borderWidth: 0,
type: 'area',
margin: [2, 0, 2, 0],
style: {
overflow: 'visible'
},
// small optimalization, saves 1-2 ms each sparkline
skipClone: true,
zoomType: 'x'
},
exporting: { enabled: false },
title: null,
credits: {
enabled: false
},
xAxis: {
categories: [],
labels: {
enabled: false
},
title: {
text: null
},
startOnTick: false,
endOnTick: false,
tickPositions: []
},
yAxis: {
endOnTick: false,
startOnTick: false,
labels: {
enabled: false
},
title: {
text: null
},
tickPositions: [0]
},
legend: {
enabled: false
},
series: [{
name: 'Tweets',
data: []
}]
};
var twitter_hist_profile_visits_options = {
chart: {
renderTo: 'vis_mini',
backgroundColor: null,
borderWidth: 0,
type: 'area',
margin: [2, 0, 2, 0],
style: {
overflow: 'visible'
},
// small optimalization, saves 1-2 ms each sparkline
skipClone: true,
zoomType: 'x'
},
exporting: { enabled: false },
title: null,
credits: {
enabled: false
},
xAxis: {
categories: [],
labels: {
enabled: false
},
title: {
text: null
},
startOnTick: false,
endOnTick: false,
tickPositions: []
},
yAxis: {
endOnTick: false,
startOnTick: false,
labels: {
enabled: false
},
title: {
text: null
},
tickPositions: [0]
},
legend: {
enabled: false
},
series: [{
name: 'Visits',
data: []
}]
};
var twitter_hist_mentions_options = {
chart: {
renderTo: 'men_mini',
backgroundColor: null,
borderWidth: 0,
type: 'area',
margin: [2, 0, 2, 0],
style: {
overflow: 'visible'
},
// small optimalization, saves 1-2 ms each sparkline
skipClone: true,
zoomType: 'x'
},
exporting: { enabled: false },
title: null,
credits: {
enabled: false
},
xAxis: {
categories: [],
labels: {
enabled: false
},
title: {
text: null
},
startOnTick: false,
endOnTick: false,
tickPositions: []
},
yAxis: {
endOnTick: false,
startOnTick: false,
labels: {
enabled: false
},
title: {
text: null
},
tickPositions: [0]
},
legend: {
enabled: false
},
series: [{
name: 'Mentions',
data: []
}]
};
var lines=data.split('\n');
$.each(lines, function(lineNo, line) {
if (lineNo !== 0) {
var items = line.split('\t');
// New Followers
twitter_hist_new_followers_options.xAxis.categories.push(items[0]);
twitter_hist_new_followers_options.series[0].data.push(parseFloat(items[5]));
// Impressions
twitter_hist_tweet_impressions_options.xAxis.categories.push(items[0]);
twitter_hist_tweet_impressions_options.series[0].data.push(parseFloat(items[2]));
// Number of Tweets
twitter_hist_number_of_tweets_options.xAxis.categories.push(items[0]);
twitter_hist_number_of_tweets_options.series[0].data.push(parseFloat(items[1]));
// Profile Visits
twitter_hist_profile_visits_options.xAxis.categories.push(items[0]);
twitter_hist_profile_visits_options.series[0].data.push(parseFloat(items[3]));
// Mentions
twitter_hist_mentions_options.xAxis.categories.push(items[0]);
twitter_hist_mentions_options.series[0].data.push(parseFloat(items[4]));
}
});
var new_followers = new Highcharts.Chart(twitter_hist_new_followers_options);
var tweet_impressions = new Highcharts.Chart(twitter_hist_tweet_impressions_options);
var number_of_tweets = new Highcharts.Chart(twitter_hist_number_of_tweets_options);
var profile_visits = new Highcharts.Chart(twitter_hist_profile_visits_options);
var hist_mentions = new Highcharts.Chart(twitter_hist_mentions_options);
}
});
Что я делаю не так? Почему иногда второй, иногда пятый график не отображается? Это сводит меня с ума. Данные статические.