JSFiddle - React, Tailwind, and code Playground

by Kesav Telaprolu

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<div id="container" style="width:900px">
</div>

JavaScript

ee4Z (input => {
  input.marketShare = formattedValue(input.marketShare);
  input.powerInMindValue = formattedValue(input.powerInMindValue);
  input.netValueNegative = formattedValue(input.netValueNegative);
  input.netValuePositive = formattedValue(input.netValuePositive);
  
  input.netValueNegative = input.netValueNegative.substr(0, 1) =="-"?    input.netValueNegative.substr(1) : input.netValueNegative;
  
  
  
  var chartArray = [];
  chartArray.push(input.marketShare);
  chartArray.push(input.powerInMindValue);
  chartArray.push(input.netValueNegative);
  chartArray.push(input.netValuePositive);
  chartArray.sort(function(a, b){return b - a});
  
  var scale = 285;
  var netNegScale;
  var netPosScale;
  var equityGap;
   var equityGapScale;
   
  if(input.netValueNegative > input.netValuePositive)
  {
  equityGap = input.netValueNegative - input.netValuePositive;
  }
  else
  {
  equityGap = input.netValuePositive - input.netValueNegative;
  }
  equityGap = Math.abs(Math.round(equityGap));
  equityGapScale = Math.round((equityGap/chartArray[0])*scale);
  
  netNegScale = Math.round((input.netValueNegative/chartArray[0])*scale);
  netPosScale = Math.round((input.netValuePositive/chartArray[0])*scale);

  
function formattedValue(value) {
  return Number.parseFloat(value).toFixed(1);
	}
DrawConversionModelChart();
var brandNFactors = new Array()
    brandNFactors[0] = new Array("Market Factor 1", "-2.4%")
    brandNFactors[1] = new Array("Market Factor 4", "-2.2%")
    brandNFactors[2] = new Array("Market Factor 2", "-1.5%")
    brandNFactors[3] = new Array("Market Factor 5", "-1.0%")
    brandNFactors[4] = new Array("Market Factor 8", "-0.8%")

var nonBrandNFactors = new Array()
    nonBrandNFactors[0] = new Array("Market Factor 3", "0.5%")
    nonBrandNFactors[1] = new Array("Market Factor 5", "0.3%")
    nonBrandNFactors[2] = new Array("Market Factor 1", "0.3%")
    nonBrandNFactors[3] = new Array("Market Factor 6", "0.3%")
    nonBrandNFactors[4] = new...