JSFiddle - React, Tailwind, and code Playground

by J. Albert Bowden

HTML

<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script> 

<div id="veiOverallEruptions" style="width:50%; height:560px; margin-top:15px; float:left;"></div>
<div id="signifEruptCompare" style="width:50%; height:250px; margin-top:15px; float:left;"></div>
<div id="veiOverallAllLine" style="width:50%; height:400px; margin-top:15px; float:right;"></div>
  
    <div id="fatalities"></div>

JavaScript

function updateColor(series){
    if(series == undefined) return;
    var color = series.color == '#333' ? '#851E20' : '#333';
	var sibling = $('#veiOverallAllLine').highcharts().series[series.index];
	//console.log(series.index);
	series.update({color:color});
    sibling.update({color:color});
}
function drawFatalitiesChart(series){
    var fatalityCategories  = ['Avalanche/Debris/Landslides','Electrical/Lightning','Floods','Gas','Indirect (Disease/Starvation/Isolation)','Lava Flows','Mudflows/Lahars','Secondary Mudflows','Pyroclastic Flows/Surges/Blasts','Seismic/Volcanic Earthquake','Tephra/Ash/Bombs/Steam','Waves/Tsunami','Unknown'];
    var fatalityNumbersAll = [10,10,10,10,10,31,10,15,10,10,10,12,15];
    var fatalityNumbersVEI0 = [1,0,0,0,0,31,0,15,0,0,0,2,5];
	var fatalityNumbersVEI1 = [3,0,0,152,0,215,113,1290,61,1,31,3,117];
    var fatalityNumbersVEI2 = [76,0,9,19,49,3067,2125,1721,371,111,754,578,453];
	var fatalityNumbersVEI3 = [97,1,0,1705,22,70,24158,411,9709,300,658,3131,772];
	
   
    
    if (series.index == '0'){
        var fatalityNumbers = fatalityNumbersVEI0; 
    }
	if (series.index == '1'){
        var fatalityNumbers = fatalityNumbersVEI1; 
    }
	if (series.index == '2'){
        var fatalityNumbers = fatalityNumbersVEI2; 
    }
	if (series.index == '3'){
        var fatalityNumbers = fatalityNumbersVEI3; 
    }
	
	
    
    $('#fatalities').highcharts({
        chart: {
            type: 'column',
        },
        title: {
            text: 'Volcano Fatalities'
        },
        xAxis: {
            categories: fatalityCategories
        },
        yAxis: { 
            min: 0,
            title: {
                text: '',
            }
        },
        
        plotOptions: {
            column: {
                pointPadding: 0,
                borderWidth: 0
            },
        },
        series: [{
                name: 'Fatalities',
                data: fatalityNumbers, 
            	color: '#333'
            }]
   ...