I have created multiple google charts in one JS file and am calling
individual charts to different pages of my website with the standard <div>
id method. The charts are loading properly, but when I'm on a page of my
site where one of the charts should not be loaded, I'm getting a Container
is not defined error. This makes sense to me in that the JS file is looking
for the <div> id that does not exist on that specific page. What I'd like
to know is how to setup my JS file to stop looking for charts if they are
not present on the current page.
*Here's my current code for clarification:*
google.charts.load('current', {
packages: ['corechart', 'bar']
});
google.charts.setOnLoadCallback(lcs_genie); //Add variety charts here to
ensure page load
google.charts.setOnLoadCallback(lcs_anchor);
google.charts.setOnLoadCallback(lcs_chrome);
google.charts.setOnLoadCallback(lcs_panther);
google.charts.setOnLoadCallback(lcs_artdeco);
google.charts.setOnLoadCallback(lcs_artdeco_disease);
// START GENIE | Yield & Protein Content | Malting Barley
function lcs_genie() {
var data = google.visualization.arrayToDataTable([
['Trial', 'LCS Genie', {
role: 'annotation'
}, {
role: 'style'
}, 'Trial Average', {
role: 'annotation'
}, {
role: 'style'
}],
['3-Year WSU High Rainfall', 109.8, 'assoc. protein: 11.8% | 108% of
mean | 109.8 bu/ac', '#007041', 101.9, '101.9 bu/ac', '#c3c3c3'],
['3-Year WSU Med. Rainfall', 80.8, 'assoc. protein: 12.6% | 106% of
mean | 80.8 bu/ac', '#007041', 76.3, '76.3 bu/ac', '#c3c3c3'],
['3-Year WSU Low Rainfall', 63.3, 'assoc. protein: 13.8% | 107% of mean
| 63.3 bu/ac', '#007041', 59.1, '59.1 bu/ac', '#c3c3c3'],
['2-Year OSU', 84.3, 'assoc. protein: 12.2% | 105% of mean | 84.3
bu/ac', '#007041', 80.3, '80.3 bu/ac', '#c3c3c3'],
['2016 UI North', 121.0, 'assoc. protein: N/A | 108% of mean | 121.0
bu/ac', '#007041', 111.7, '111.7 bu/ac', '#c3c3c3'],
['3-Year UI South', 131.7, 'assoc. protein: 11.5% | 104% of mean |
131.7 bu/ac', '#007041', 126.3, '126.3 bu/ac', '#c3c3c3'],
['2016 MSU (MT) Irrigated', 127.3, 'assoc. protein: 10.0% | 114% of
mean | 127.3 bu/ac', '#007041', 112.0, '112.0 bu/ac', '#c3c3c3'],
['2016 MSU (MT) Dryland', 97.3, 'assoc. protein: 11.5% | 112% of mean |
97.3 bu/ac', '#007041', 86.6, '86.6 bu/ac', '#c3c3c3'],
['2016 UMN', 98.7, 'assoc. protein: N/A% | 105% of mean | 98.7 bu/ac',
'#007041', 94.4, '94.4 bu/ac', '#c3c3c3'],
['3-Year MSU (MI)', 74.1, 'assoc. protein: 11.0% | 102% of mean | 74.1
bu/ac', '#007041', 72.7, '72.7 bu/ac', '#c3c3c3'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'top', alignment: 'start' },
height: chartHeight,
colors: ['#007041', '#c3c3c3'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
title: 'Yield bu/ac',
viewWindow: {
min: 0,
max: 135
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Trial',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_genie'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END GENIE
// START ANCHOR | Disease Resistance | Northern Plains
function lcs_anchor() {
var data = google.visualization.arrayToDataTable([
['Disease', 'Resistance Rating', { role: 'annotation'}, { role:
'style'}, { role: 'tooltip'}],
['Fusarium Head Blight', 7, '3', '#771a14', 'Fusarium Head Blight |
Resistance Rating: 3'], // Resistance rating is calculated by subracting
the value from 10
['Bacterial Leaf Streak', 6, '4', '#771a14', 'Bacterial Leaf Streak |
Resistance Rating: 4'],
['Septoria Leaf Blotch', 6, '4', '#771a14', 'Septoria Leaf Blotch |
Resistance Rating: 4'],
['Tan Spot', 6, '4', '#771a14', 'Tan Spot | Resistance Rating: 4'],
['Leaf Rust', 7, '3', '#771a14', 'Leaf Rust | Resistance Rating: 3'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'none'},
height: chartHeight,
colors: ['#771a14'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
ticks: [{v:1, f:'9'}, {v:2, f:'8'}, {v:3, f:'7'}, {v:4, f:'6'},
{v:5, f:'5'}, {v:6, f:'4'}, {v:7, f:'3'}, {v:8, f:'2'}, {v:9, f:'1'}],
title: '7-9 Susceptible | 4-6 Intermediate | 1-3 Resistant',
viewWindow: {
min: 0,
max: 9
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Disease',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_anchor'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END ANCHOR
// START CHROME | Disease Resistance | Central Plains
function lcs_chrome() {
var data = google.visualization.arrayToDataTable([
['Disease', 'Resistance Rating', { role: 'annotation'}, { role:
'style'}, { role: 'tooltip'}],
['Barley Yellow Dwarf', 9, '1', '#221f72', 'Barley Yellow Dwarf |
Resistance Rating: 1'], // Resistance rating is calculated by subracting
the value from 10
['Hessian Fly', 10, '0', '#221f72', 'Hessian Fly | Resistance Rating:
0'],
['Leaf Rust', 9, '1', '#221f72', 'Leaf Rust | Resistance Rating: 1'],
['Soil-Borne Mosaic', 9, '1', '#221f72', 'Soil-Borne Mosaic |
Resistance Rating: 1'],
['Stem Rust', 1, '9', '#221f72', 'Stem Rust | Resistance Rating: 9'],
['Stripe Rust', 9, '1', '#221f72', 'Stripe Rust | Resistance Rating:
1'],
['Tan Spot', 8, '2', '#221f72', 'Tan Spot | Resistance Rating: 2'],
['Wheat Streak Mosaic', 3, '7', '#221f72', 'Wheat Streak Mosaic |
Resistance Rating: 7'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'none'},
height: chartHeight,
colors: ['#771a14'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
ticks: [{v:1, f:'9'}, {v:2, f:'8'}, {v:3, f:'7'}, {v:4, f:'6'},
{v:5, f:'5'}, {v:6, f:'4'}, {v:7, f:'3'}, {v:8, f:'2'}, {v:9, f:'1'},
{v:10, f:'0'}],
title: '7-9 Susceptible | 4-6 Intermediate | 1-3 Resistant',
viewWindow: {
min: 0,
max: 10
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Disease',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_chrome'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END CHROME
// START PANTHER | Disease Resistance | Central Plains
function lcs_panther() {
var data = google.visualization.arrayToDataTable([
['Disease', 'Resistance Rating', { role: 'annotation'}, { role:
'style'}, { role: 'tooltip'}],
['Stripe Rust', 7, '3', '#0065a4', 'Stripe Rust | Resistance Rating:
3'], // Resistance rating is calculated by subracting the value from 10
['Powdery Mildew', 8, '2', '#0065a4', 'Powdery Mildew | Resistance
Rating: 2'],
['Head Scab', 7, '3', '#0065a4', 'Head Scab | Resistance Rating: 3'],
['BYDV', 6, '4', '#0065a4', 'BYDV | Resistance Rating: 4'],
['Septoria Tritici', 6, '4', '#0065a4', 'Septoria Tritici | Resistance
Rating: 4'],
['Leaf Rust', 9, '1', '#0065a4', 'Leaf Rust | Resistance Rating: 1'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'none'},
height: chartHeight,
colors: ['#771a14'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
ticks: [{v:1, f:'9'}, {v:2, f:'8'}, {v:3, f:'7'}, {v:4, f:'6'},
{v:5, f:'5'}, {v:6, f:'4'}, {v:7, f:'3'}, {v:8, f:'2'}, {v:9, f:'1'}],
title: '7-9 Susceptible | 4-6 Intermediate | 1-3 Resistant',
viewWindow: {
min: 0,
max: 9
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Disease',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_panther'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END PANTHER
// START ARTDECO | Yield | Pacific Northwest
function lcs_artdeco() {
var data = google.visualization.arrayToDataTable([
['Trial', 'LCS Artdeco', {
role: 'annotation'
}, {
role: 'style'
}, 'Trial Average', {
role: 'annotation'
}, {
role: 'style'
}],
['3-Year OSU Low Rain', 70.5, '109% of mean | 70.5 bu/ac', '#005958',
64.9, '64.9 bu/ac', '#c3c3c3'],
['3-Year WSU Irrigated', 140.0, '108% of mean | 140.0 bu/ac',
'#005958', 130.0, '130.0 bu/ac', '#c3c3c3'],
['3-Year WSU 16"-20"', 116.0, '106% of mean | 116.0 bu/ac', '#005958',
109.0, '109.0 bu/ac', '#c3c3c3'],
['3-Year UI North', 116.3, '106% of mean | 116.3 bu/ac', '#005958',
109.0, '109.0 bu/ac', '#c3c3c3'],
['3-Year OSU High Rain', 129.5, '103% of mean | 129.5 bu/ac',
'#005958', 126.2, '126.2 bu/ac', '#c3c3c3'],
['3-Year OSU > 20"', 121.0, '101% of mean | 121.0 bu/ac', '#005958',
120.0, '120.0 bu/ac', '#c3c3c3'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'top', alignment: 'start' },
height: chartHeight,
colors: ['#005958', '#c3c3c3'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
title: 'Yield bu/ac',
viewWindow: {
min: 0,
max: 145
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Trial',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_artdeco'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END ARTDECO
// START ARTDECO_DISEASE | Disease Resistance | Pacific Northwest
function lcs_artdeco_disease() {
var data = google.visualization.arrayToDataTable([
['Disease', 'Resistance Rating', { role: 'annotation'}, { role:
'style'}, { role: 'tooltip'}],
['Stripe Rust', 6, '4', '#005958', 'Stripe Rust | Resistance Rating:
4'], // Resistance rating is calculated by subracting the value from 10
['Septoria', 2, '8', '#005958', 'Septoria | Resistance Rating: 8'],
['Strawbreaker Foot Rot', 3, '7', '#005958', 'Strawbreaker Foot Rot |
Resistance Rating: 7'],
['Crown Rot', 6, '4', '#005958', 'Crown Rot | Resistance Rating: 4'],
['C-Stripe', 4, '6', '#005958', 'C-Stripe | Resistance Rating: 6'],
['SBMV', 1, '9', '#005958', 'SBMV | Resistance Rating: 9'],
]);
var paddingHeight = 80;
var rowHeight = data.getNumberOfRows() * 80;
var chartHeight = rowHeight + paddingHeight;
var options = {
annotations: {textStyle: {fontSize: 14, fontName: 'Source Sans Pro',}},
legend: { position: 'none'},
height: chartHeight,
colors: ['#771a14'],
chartArea: {
width: '50%',
height: rowHeight
},
hAxis: {
ticks: [{v:1, f:'9'}, {v:2, f:'8'}, {v:3, f:'7'}, {v:4, f:'6'},
{v:5, f:'5'}, {v:6, f:'4'}, {v:7, f:'3'}, {v:8, f:'2'}, {v:9, f:'1'}],
title: '7-9 Susceptible | 4-6 Intermediate | 1-3 Resistant',
viewWindow: {
min: 0,
max: 9
},
minValue: 0,
textStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 12,
color: '#4d4d4d'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
bold: true,
fontSize: 14,
color: '#4d4d4d'
}
},
vAxis: {
title: 'Disease',
textStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
},
titleTextStyle: {
fontName: 'Source Sans Pro',
fontSize: 14,
bold: true,
color: '#848484'
}
}
};
var chart = new
google.visualization.BarChart(document.getElementById('lcs_artdeco_disease'));
chart.draw(data, options);
// redraw charts responsively
(function($) {
function resizeCharts () {
chart.draw(data, options);
}
$(window).resize(resizeCharts);
})( jQuery );
}
// END ARTDECO_DISEASE
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/f7433c54-4b36-4243-b486-7c724c80a2ee%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
