JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://openlayers.org/en/v3.2.1/build/ol.js"></script>
<link rel="stylesheet" href="http://openlayers.org/en/v3.2.1/css/ol.css">
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<div id="map" class="map"></div>

CSS

@import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700);

body {
  padding-top: 60px;
}
.map {
  height: 400px;
  width: 100%;
  background: url(textured_paper.jpeg) repeat;
}
.ol-attribution {
  max-width: calc(100% - 3em);
}
.ol-control button, .ol-attribution, .ol-scale-line-inner {
  font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
}

#tags {
  display: none;
}

body, h1, h2, h3, h4, p, li, td, th {
  font-family: Quattrocento Sans;
}
.navbar-inverse .navbar-inner {
  background: #1F6B75;
}
.navbar-inverse .brand {
  color: white;
  padding: 5px;
}

JavaScript

var raster = new ol.layer.Tile({
  source: new ol.source.MapQuest({layer: 'sat'})
});


var vectorSource = new ol.source.Vector({

  });
//var vector = new ol.layer.Vector({});
    

//var vector = new ol.layer.Vector({
//  source: vectorSource
//});

var vector = new ol.layer.Image({
            source: new ol.source.ImageVector({
                source: vectorSource,
                style: new ol.style.Style({
                    fill: new ol.style.Stroke({
                        color: '#efefef',
                        width: 1
                    }),
                    stroke: new ol.style.Stroke({
                        color: '#fff',
                        width: 1
                    })
                })
            })
});

d3.json("http://openlayers.org/en/master/examples/data/topojson/us.json", function(collection) {
    
    var features = topojson.feature(collection, collection.objects.counties);
    var format = new ol.format.GeoJSON();
    //var olfeats = format.readFeatures(features);
   var olfeats = format.readFeatures(features,
        {featureProjection:"EPSG:3857"});    
    vectorSource.addFeatures(olfeats);
    

});

var map = new ol.Map({
  layers: [raster, vector],
  target: 'map',
  view: new ol.View({
    center: [0, 0],
    zoom: 2
  })
});

var select = null;  // ref to currently selected interaction

// select interaction working on "singleclick"
var selectSingleClick = new ol.interaction.Select();

// select interaction working on "click"
var selectClick = new ol.interaction.Select({
  condition: ol.events.condition.click
});

// select interaction working on "mousemove"
var selectMouseMove = new ol.interaction.Select({
  condition: ol.events.condition.mouseMove,
    style: new ol.style.Style({
                    fill: new ol.style.Stroke({
                        color: 'red',
                        width: 1
                    }),
                    stroke: new ol.style.Stroke({
                        color: '#fff',
     ...