SociallyCompute · jvbkw8 · Sep 4, 2016 · Sep 6, 2016 · Sep 6, 2016 · Sep 6, 2016
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+.DS_Store
diff --git a/README.md b/README.md
diff --git a/app.css b/app.css
@@ -0,0 +1,23 @@
+body {
+    background-color: #EEE;
+}
+#graph .choice {
+    float: left;
+    font-family: arial;
+    font-size: 1.5em;
+    min-width: 200px;
+    text-align: right;
+    margin: 8px 5px;
+}
+#graph .bar {
+    width: 0;
+    height: 35px;
+    background-color: blue;
+    margin: 5px;
+    float: left;
+}
+.group:after {
+  content: "";
+  display: table;
+  clear: both;
+}
diff --git a/d3.v3.min.js b/d3.v3.min.js
diff --git a/index.html b/index.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Presidential Primary Data 2016</title>
+    <link href="app.css" rel="stylesheet" type="text/css">
+    <script src="jquery-1.12.0.min.js"></script>
+    <script src="https://d3js.org/d3.v3.min.js"></script>
+    <script src="d3.v3.min.js"></script>
+<body>
+
+
+  	<div id="left">
+		<div id="graph_gop"></div>
+	</div>
+	<div id="right">
+		<div id="graph_dnc"></div>
+	</div>
+
+    <script>
+
+        var url_gop = "http://elections.huffingtonpost.com/pollster/api/charts/2016-national-gop-primary";
+ </script>           
+    <div id="graph"></div>
+
+    <script>
+
+        var url = "http://elections.huffingtonpost.com/pollster/api/charts/2016-national-gop-primary";
+	var dem = "http://elections.huffingtonpost.com/pollster/api/charts/2016-national-democratic-primary";        
+        $.ajax(url, {
+            dataType: "jsonp",
+            jsonpCallback: "pollsterCallback",
+            cache: true,
+            success: function(data) {
+
+          var candidateBar = d3.select("#graph_gop").selectAll("div").data(data.estimates),
+                var candidateBar = d3.select("#graph").selectAll("div").data(data.estimates),
+                    candidateWrapper = candidateBar.enter().append("div").classed("group", true);
+
+                candidateWrapper.append("div")
+                    .classed("choice", true)
+                    .text(function(candidate) {
+                        return candidate.choice + " " + Math.round(candidate.value * 100) / 100 + "%";
+                        return candidate.choice + " " + candidate.value + "%";
+                    });
+
+                candidateWrapper.append("div")
+                    .classed("bar", true)
+                    .transition()
+                    .duration(1000)
+                    .style("width", function(candidate) {
+                        return candidate.value * 10 + "px";
+                    });                
+
+
+
+            }
+
+        });        
+        var url_dnc = "http://elections.huffingtonpost.com/pollster/api/charts/2016-national-democratic-primary";
+
+        $.ajax(url_dnc, {
+            dataType: "jsonp",
+            cache: true,
+            success: function(data) {
+
+                var candidateBar = d3.select("#graph_dnc").selectAll("div").data(data.estimates),
+                    candidateWrapper = candidateBar.enter().append("div").classed("group", true);
+
+                candidateWrapper.append("div")
+                    .classed("choice", true)
+                    .text(function(candidate) {
+                        return candidate.choice + " " + Math.round(candidate.value * 100) / 100 + "%";
+                    });
+
+                candidateWrapper.append("div")
+                    .classed("bar", true)
+                    .transition()
+                    .duration(1000)
+                    .style("width", function(candidate) {
+                        return candidate.value * 10 + "px";
+                    });                
+
+
+
+            }
+
+        });
+    </script>
+
+
+</body>
+</html>
diff --git a/jquery-1.12.0.min.js b/jquery-1.12.0.min.js