JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.45.0/mapbox-gl.css">
<script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.45.0/mapbox-gl.js"></script>
<div id="map"></div>
<div id="layer-selector">
  <input name="mode" type="radio" value="2d" /> 2D<br/>
  <input name="mode" type="radio" value="3d" checked /> 3D
</div>

CSS

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

#layer-selector {
  position: absolute;
  top: 0;
  bottom: 0;
  background-color: transparent;
  color: white;
}

JavaScript

if (mapboxgl.supported()) {
  mapboxgl.accessToken = 'pk.eyJ1Ijoic3RlcGhhbmVnZW8iLCJhIjoiY2plMGEybzYxNW82cTJxcDAxaWdia282MyJ9.zji2nWNGVPMtFtid6oc3uA';
  var map = new mapboxgl.Map({
    container: 'map',
    center: [-96.953835, 29.119053],
    zoom: 7,
    hash: true,
    style: 'mapbox://styles/mapbox/dark-v9',
  });

  map.on('load', function() {
    $('#layer-selector > input[type=radio][name=mode]').change(function() {
      if (this.value === '2d') {
        map.setLayoutProperty('hexbins-3d', 'visibility', 'none');
        map.setLayoutProperty('hexbins-2d', 'visibility', 'visible');

      } else {
        map.setLayoutProperty('hexbins-2d', 'visibility', 'none');
        map.setLayoutProperty('hexbins-3d', 'visibility', 'visible');
      }
    });

    map.addSource('hexbins-source', {
      type: 'vector',
      url: 'mapbox://stephanegeo.3to6lsmv'
    });

    map.addLayer({
      id: 'hexbins-3d',
      type: 'fill-extrusion',
      source: 'hexbins-source',
      'source-layer': 'aggregated',
      layout: {
        visibility: 'visible'
      },
      paint: {
        'fill-extrusion-opacity': 0.5,
        'fill-extrusion-color': [
          'interpolate', ['exponential', 1],
          ['get', 'parcel_count'],
          0, 'hsl(192, 98%, 51%)',
          100000, 'hsl(1, 86%, 45%)'
        ]
      }
    });

    map.addLayer({
      id: 'hexbins-2d',
      type: 'fill',
      source: 'hexbins-source',
      'source-layer': 'aggregated',
      layout: {
        visibility: 'none'
      },
      paint: {
        'fill-opacity': 0.5,
        'fill-color': [
          'interpolate', ['exponential', 1],
          ['get', 'parcel_count'],
          0, 'hsl(192, 98%, 51%)',
          100000, 'hsl(1, 86%, 45%)'
        ]
      }
    });
  });
}