JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.6.4.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.16/jquery-ui.js"></script>
<link rel="stylesheet" href="https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.css">
<script src="https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://api.mapbox.com/mapbox.js/plugins/leaflet-omnivore/v0.2.0/leaflet-omnivore.min.js"></script>

<div id='map'></div>

CSS

body { margin:0; padding:0; }
  #map { position:absolute; top:0; bottom:0; width:100%; }

.search-ui {
  position:absolute;
  top:10px;
  right:10px;
  z-index:1000;
  }

.sparkline {
       height: 100px;
       width: 200px;
   }

JavaScript

L.mapbox.accessToken = 'pk.eyJ1IjoiZXRwLXByb2plY3QiLCJhIjoiY2lqbDc0dWQwMDAxeHUya280OTE5dGs0NCJ9.viXLMvWxmTv3_uZyvjKsOA';
var map = L.mapbox.map('map', 'mapbox.streets')
    .setView([49.4987919, 13.9583693], 4);

// omnivore will AJAX-request this file behind the scenes and parse it:
// note that there are considerations:
// - The CSV file must contain latitude and longitude values, in column
//   named roughly latitude and longitude
// - The file must either be on the same domain as the page that requests it,
//   or both the server it is requested from and the user's browser must
//   support CORS.

// The omnivore functions take three arguments:
//
// - a URL of the file to fetch
// - options to the parser
// - a custom layer
//
// And they return the custom layer, which is by default an L.geoJson layer.
//
// The second two arguments are each optional. In this case we're supplying
// no arguments to the parser (null), but supplying a custom layer:
// an instance of L.mapbox.featureLayer
// This means that rows with simplestyle properties will be styled as they
// would be in GeoJSON and elsewhere.
//omnivore.csv('gtftest.csv', null, L.mapbox.featureLayer()).addTo(map);

omnivore.csv('gtftest.csv')
    .on('ready', function(layer) {
       
        this.eachLayer(function(marker) {
            if (marker.toGeoJSON().properties.Type === 'H') {
                
                marker.setIcon(L.mapbox.marker.icon({
                    'marker-color': '#ff8888',
                    'marker-size': 'small',
                    'marker-image': 'H.png'
                }));

			} else if	(marker.toGeoJSON().properties.Type === 'LNG') {
	                // The argument to L.mapbox.marker.icon is based on the
	                // simplestyle-spec: see that specification for a full
	                // description of options.
	                marker.setIcon(L.mapbox.marker.icon({
	                    'marker-color': '#ff0000',
	                    'marker-size': 'small',
	 ...