JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://openlayers.org/en/v4.2.0/css/ol.css">
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="https://openlayers.org/en/v4.2.0/build/ol.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div id="map-div">

	<div class="row">
		<div id="allStates" class="col-xs-4 col-sm-4 col-md-4 col-lg-4 nopadding">
			<h2 class="text-center">
			States
			</h2>
		</div>
		<div id="place1" class="col-xs-4 col-sm-4 col-md-4 col-lg-4 nopadding">
			<h2 class="text-center">
			Place1
			</h2>
		</div>
		<div id="place2" class="col-xs-4 col-sm-4 col-md-4 col-lg-4 nopadding">
			<h2 class="text-center">
			Place2
			</h2>
		</div>
	</div>
	<div class="row">
		<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
			<div class="table-responsive">
				<table class="table table-bordered table-condensed table-hover table-striped">
					<thead>
						<tr>
							<th>Id</th>
							<th>Start Time</th>
							<th>End Time</th>
						</tr>
					</thead>
					<tbody>
						<tr id="id1">
							<td>1</td>
							<td>10:30:32</td>
							<td>11:32:30</td>
						</tr>
						<tr id="id2">
							<td>2</td>
							<td>12:52:34</td>
							<td>13:36:54</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>

CSS

.nopadding {
    padding: 0 !important;
    margin: 0 !important;
}

JavaScript

var pieColors = [
	'rgb(31, 119, 180)', 'rgb(255, 127, 14)'
]

var pieData = [{
	values: [50, 20],
	labels: ["At Harbor", "Sailing"],
	type: 'pie',
	marker: {
		colors: pieColors
	}
}];

var d3 = Plotly.d3;

//can adjust size of svg-container
//but doesn't adjust white space
var layout = {
	height: 350
}

var WIDTH_IN_PERCENT_OF_PARENT = 100,
	HEIGHT_IN_PERCENT_OF_PARENT = 100;

var gd3 = d3.select("div[id='allStates']")
.append('div')
.style({
	width: WIDTH_IN_PERCENT_OF_PARENT + '%',
	height: HEIGHT_IN_PERCENT_OF_PARENT + '%',
});

var gd = gd3.node();

//pieChart
Plotly.plot(gd, pieData, layout, {displayModeBar: false});
//Plotly.plot(gd, pieData, layout);

window.onresize = function () {
	Plotly.Plots.resize(gd);
};