JSFiddle - React, Tailwind, and code Playground
by Patricia Warwick
JavaScript
<p> </p>
<p>
<meta charset="utf-8" />
<script src="/sites/default/d3_files/d3.v3.js"></script><script src="http://code.jquery.com/jquery-1.9.1.js"></script><script src="http://d3js.org/topojson.v1.min.js"></script><script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script><script>var categoryColour = {
"volunteer": "blue",
"organization": "green",
"community group": "red",
"air": "transparent"
};
</script><script src="/sites/default/d3_files/category-table.js"></script></p>
<p> </p>
<p>
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet" />
<!--<script src="/jquery.mobile-1.4.0/jquery.mobile-1.4.0.js"></script>-->
<style type="text/css">
body {
background-image:url('/sites/default/files/background.png');
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
margin-top:-50px;
}
svg {
border:0px solid #ebebeb;
}
.ui-widget {
font-family: Verdana,Arial,sans-serif;
font-size: .8em;
}
.ui-widget-content {
background: #F9F9F9;
border: 1px solid #90d93f;
color: #222222;
}
.ui-dialog {
left: 0;
outline: 0 none;
padding: 20 !important;
position: absolute;
top: 0;
}
.ui-dialog .ui-dialog-content {
background: none repeat scroll 0 0 transparent;
border: 0 none;
overflow: auto;
position: relative;
padding: 20px !important;
}
.ui-widget-header {
background: #b0de78;
border: 0;
color: #fff;
font-weight: normal;
}
.ui-dialog .ui-dialog-titlebar {
padding: 0.1em .5em;
position: relative;
font-size: 1em;
}
.datamaps-hoverover {
background-color:white;
border:2px solid #90d93f;
padding:10px;
margin-left:100px;
margin-top: 300px;
font-size:12px;
font-family:'Helvetica';
}
#data-div {
width: 960px;
margin-bottom:5px;
margin-left:5px;
}
#legend {
width: 300px;
margin-bottom:5px;
margin-left:5px;
...