Skip to content

Instantly share code, notes, and snippets.

@timvarga
Last active February 10, 2016 17:12
Show Gist options
  • Save timvarga/b2a3d3b33df9690cd69b to your computer and use it in GitHub Desktop.
Save timvarga/b2a3d3b33df9690cd69b to your computer and use it in GitHub Desktop.
Interactive Scatter
Period x Group Region Technology Investor_Type Score Value y
BEFORE 1 Germany>Utilities Germany Onshore Utilities 2 1707 6
BEFORE 1 Germany>Developers Germany Onshore Developers 4 10242 5
BEFORE 1 Germany>FIs Germany Onshore FIs 3 10242 4
BEFORE 1 Germany>Large Consumers Germany Onshore Large Consumers 1 0 3
BEFORE 1 Germany>Small Consumers Germany Onshore Small Consumers 5 6828 2
BEFORE 1 Germany>Government Germany Onshore Government 5 5121 1
AFTER 2 Germany>Utilities Germany Onshore Utilities 1 0 6
AFTER 2 Germany>Developers Germany Onshore Developers 4 5250 5
AFTER 2 Germany>FIs Germany Onshore FIs 4 6125 4
AFTER 2 Germany>Large Consumers Germany Onshore Large Consumers 2 1750 3
AFTER 2 Germany>Small Consumers Germany Onshore Small Consumers 2 875 2
AFTER 2 Germany>Government Germany Onshore Government 4 3500 1
BEFORE 3 UK>Utilities UK Onshore Utilities 3 376.4 6
BEFORE 3 UK>Developers UK Onshore Developers 4 2258.4 5
BEFORE 3 UK>FIs UK Onshore FIs 4 4516.8 4
BEFORE 3 UK>Large Consumers UK Onshore Large Consumers 1 75.28 3
BEFORE 3 UK>Small Consumers UK Onshore Small Consumers 2 150.56 2
BEFORE 3 UK>Government UK Onshore Government 2 150.56 1
AFTER 4 UK>Utilities UK Onshore Utilities 1 220.86 6
AFTER 4 UK>Developers UK Onshore Developers 2 2208.6 5
AFTER 4 UK>FIs UK Onshore FIs 3 4417.2 4
AFTER 4 UK>Large Consumers UK Onshore Large Consumers 1 73.62 3
AFTER 4 UK>Small Consumers UK Onshore Small Consumers 1 368.1 2
AFTER 4 UK>Government UK Onshore Government 1 73.62 1
BEFORE 5 Nordics>Utilities Nordics Onshore Utilities 2 1146.64 6
BEFORE 5 Nordics>Developers Nordics Onshore Developers 5 3022.96 5
BEFORE 5 Nordics>FIs Nordics Onshore FIs 3 208.48 4
BEFORE 5 Nordics>Large Consumers Nordics Onshore Large Consumers 4 521.2 3
BEFORE 5 Nordics>Small Consumers Nordics Onshore Small Consumers 3 312.72 2
BEFORE 5 Nordics>Government Nordics Onshore Government 1 0 1
AFTER 6 Nordics>Utilities Nordics Onshore Utilities 2 428.8 6
AFTER 6 Nordics>Developers Nordics Onshore Developers 4 3087.36 5
AFTER 6 Nordics>FIs Nordics Onshore FIs 3 643.2 4
AFTER 6 Nordics>Large Consumers Nordics Onshore Large Consumers 2 128.64 3
AFTER 6 Nordics>Small Consumers Nordics Onshore Small Consumers 1 0 2
AFTER 6 Iberia>Government Iberia Onshore Government 1 0 1
BEFORE 7 Iberia>Utilities Iberia Onshore Utilities 5 24811.2 6
BEFORE 7 Iberia>Developers Iberia Onshore Developers 3 1378.4 5
BEFORE 7 Iberia>FIs Iberia Onshore FIs 4 1378.4 4
BEFORE 7 Iberia>Large Consumers Iberia Onshore Large Consumers 3 0 3
BEFORE 7 Iberia>Small Consumers Iberia Onshore Small Consumers 3 0 2
BEFORE 7 Iberia>Government Iberia Onshore Government 4 0 1
AFTER 8 Iberia>Utilities Iberia Onshore Utilities 2 12876.3 6
AFTER 8 Iberia>Developers Iberia Onshore Developers 1 715.35 5
AFTER 8 Iberia>FIs Iberia Onshore FIs 2 715.35 4
AFTER 8 Iberia>Large Consumers Iberia Onshore Large Consumers 1 0 3
AFTER 8 Iberia>Small Consumers Iberia Onshore Small Consumers 1 0 2
AFTER 8 Iberia>Government Iberia Onshore Government 2 0 1
BEFORE 11 Germany>Utilities Germany Offshore Utilities 4 130 6
BEFORE 11 Germany>Developers Germany Offshore Developers 3 52 5
BEFORE 11 Germany>FIs Germany Offshore FIs 3 208 4
BEFORE 11 Germany>Large Consumers Germany Offshore Large Consumers 1 0 3
BEFORE 11 Germany>Small Consumers Germany Offshore Small Consumers 1 0 2
BEFORE 11 Germany>Government Germany Offshore Government 3 130 1
AFTER 12 Germany>Utilities Germany Offshore Utilities 5 0 6
AFTER 12 Germany>Developers Germany Offshore Developers 3 2844 5
AFTER 12 Germany>FIs Germany Offshore FIs 5 3318 4
AFTER 12 Germany>Large Consumers Germany Offshore Large Consumers 1 948 3
AFTER 12 Germany>Small Consumers Germany Offshore Small Consumers 1 474 2
AFTER 12 Germany>Government Germany Offshore Government 4 1896 1
BEFORE 13 UK>Utilities UK Offshore Utilities 5 920.25 6
BEFORE 13 UK>Developers UK Offshore Developers 4 184.05 5
BEFORE 13 UK>FIs UK Offshore FIs 5 1840.5 4
BEFORE 13 UK>Large Consumers UK Offshore Large Consumers 1 0 3
BEFORE 13 UK>Small Consumers UK Offshore Small Consumers 1 0 2
BEFORE 13 UK>Government UK Offshore Government 4 736.2 1
AFTER 14 UK>Utilities UK Offshore Utilities 4 279.27 6
AFTER 14 UK>Developers UK Offshore Developers 3 2792.7 5
AFTER 14 UK>FIs UK Offshore FIs 4 5585.4 4
AFTER 14 UK>Large Consumers UK Offshore Large Consumers 1 93.09 3
AFTER 14 UK>Small Consumers UK Offshore Small Consumers 1 465.45 2
AFTER 14 UK>Government UK Offshore Government 1 93.09 1
BEFORE 15 Nordics>Utilities Nordics Offshore Utilities 3 192 6
BEFORE 15 Nordics>Developers Nordics Offshore Developers 1 24 5
BEFORE 15 Nordics>FIs Nordics Offshore FIs 1 0 4
BEFORE 15 Nordics>Large Consumers Nordics Offshore Large Consumers 1 0 3
BEFORE 15 Nordics>Small Consumers Nordics Offshore Small Consumers 1 0 2
BEFORE 15 Nordics>Government Nordics Offshore Government 2 24 1
AFTER 16 Nordics>Utilities Nordics Offshore Utilities 3 84.2 6
AFTER 16 Nordics>Developers Nordics Offshore Developers 2 606.24 5
AFTER 16 Nordics>FIs Nordics Offshore FIs 3 126.3 4
AFTER 16 Nordics>Large Consumers Nordics Offshore Large Consumers 1 25.26 3
AFTER 16 Nordics>Small Consumers Nordics Offshore Small Consumers 1 0 2
AFTER 16 Iberia>Government Iberia Offshore Government 1 0 1
BEFORE 17 Iberia>Utilities Iberia Offshore Utilities 1 0 6
BEFORE 17 Iberia>Developers Iberia Offshore Developers 1 0 5
BEFORE 17 Iberia>FIs Iberia Offshore FIs 1 0 4
BEFORE 17 Iberia>Large Consumers Iberia Offshore Large Consumers 1 0 3
BEFORE 17 Iberia>Small Consumers Iberia Offshore Small Consumers 1 0 2
BEFORE 17 Iberia>Government Iberia Offshore Government 1 0 1
AFTER 18 Iberia>Utilities Iberia Offshore Utilities 2 2700 6
AFTER 18 Iberia>Developers Iberia Offshore Developers 1 150 5
AFTER 18 Iberia>FIs Iberia Offshore FIs 2 150 4
AFTER 18 Iberia>Large Consumers Iberia Offshore Large Consumers 1 0 3
AFTER 18 Iberia>Small Consumers Iberia Offshore Small Consumers 1 0 2
AFTER 18 Iberia>Government Iberia Offshore Government 1 0 1
BEFORE 21 Germany>Utilities Germany SolarPV Utilities 1 0 6
BEFORE 21 Germany>Developers Germany SolarPV Developers 5 5450.25 5
BEFORE 21 Germany>FIs Germany SolarPV FIs 3 10900.5 4
BEFORE 21 Germany>Large Consumers Germany SolarPV Large Consumers 3 3633.5 3
BEFORE 21 Germany>Small Consumers Germany SolarPV Small Consumers 5 9083.75 2
BEFORE 21 Germany>Government Germany SolarPV Government 4 7267 1
AFTER 22 Germany>Utilities Germany SolarPV Utilities 1 0 6
AFTER 22 Germany>Developers Germany SolarPV Developers 4 2312.7 5
AFTER 22 Germany>FIs Germany SolarPV FIs 2 6167.2 4
AFTER 22 Germany>Large Consumers Germany SolarPV Large Consumers 3 2312.7 3
AFTER 22 Germany>Small Consumers Germany SolarPV Small Consumers 4 770.9 2
AFTER 22 Germany>Government Germany SolarPV Government 4 3854.5 1
BEFORE 23 UK>Utilities UK SolarPV Utilities 1 0 6
BEFORE 23 UK>Developers UK SolarPV Developers 4 695 5
BEFORE 23 UK>FIs UK SolarPV FIs 4 1668 4
BEFORE 23 UK>Large Consumers UK SolarPV Large Consumers 2 139 3
BEFORE 23 UK>Small Consumers UK SolarPV Small Consumers 4 278 2
BEFORE 23 UK>Government UK SolarPV Government 1 0 1
AFTER 24 UK>Utilities UK SolarPV Utilities 1 0 6
AFTER 24 UK>Developers UK SolarPV Developers 3 670 5
AFTER 24 UK>FIs UK SolarPV FIs 2 1608 4
AFTER 24 UK>Large Consumers UK SolarPV Large Consumers 1 134 3
AFTER 24 UK>Small Consumers UK SolarPV Small Consumers 1 268 2
AFTER 24 UK>Government UK SolarPV Government 1 0 1
BEFORE 25 Nordics>Utilities Nordics SolarPV Utilities 1 0 6
BEFORE 25 Nordics>Developers Nordics SolarPV Developers 1 5.3 5
BEFORE 25 Nordics>FIs Nordics SolarPV FIs 1 0 4
BEFORE 25 Nordics>Large Consumers Nordics SolarPV Large Consumers 1 0 3
BEFORE 25 Nordics>Small Consumers Nordics SolarPV Small Consumers 1 47.7 2
BEFORE 25 Nordics>Government Nordics SolarPV Government 1 0 1
AFTER 26 Nordics>Utilities Nordics SolarPV Utilities 1 0 6
AFTER 26 Nordics>Developers Nordics SolarPV Developers 1 2.7 5
AFTER 26 Nordics>FIs Nordics SolarPV FIs 1 0 4
AFTER 26 Nordics>Large Consumers Nordics SolarPV Large Consumers 1 0 3
AFTER 26 Nordics>Small Consumers Nordics SolarPV Small Consumers 1 15.3 2
AFTER 26 Iberia>Government Iberia SolarPV Government 1 0 1
BEFORE 27 Iberia>Utilities Iberia SolarPV Utilities 3 4555.8 6
BEFORE 27 Iberia>Developers Iberia SolarPV Developers 5 253.1 5
BEFORE 27 Iberia>FIs Iberia SolarPV FIs 3 253.1 4
BEFORE 27 Iberia>Large Consumers Iberia SolarPV Large Consumers 3 0 3
BEFORE 27 Iberia>Small Consumers Iberia SolarPV Small Consumers 2 0 2
BEFORE 27 Iberia>Government Iberia SolarPV Government 2 0 1
AFTER 28 Iberia>Utilities Iberia SolarPV Utilities 2 4324.5 6
AFTER 28 Iberia>Developers Iberia SolarPV Developers 2 240.25 5
AFTER 28 Iberia>FIs Iberia SolarPV FIs 1 240.25 4
AFTER 28 Iberia>Large Consumers Iberia SolarPV Large Consumers 1 0 3
AFTER 28 Iberia>Small Consumers Iberia SolarPV Small Consumers 1 0 2
AFTER 28 Iberia>Government Iberia SolarPV Government 2 0 1
Cereal Name Manufacturer Type Calories Protein (g) Fat Sodium Dietary Fiber Carbs Sugars Display Shelf Potassium Vitamins and Minerals Serving Size Weight Cups per Serving
100%_Bran Nabisco C 70 4 1 130 10 5 6 3 280 25 1 0.33
100%_Natural_Bran Quaker Oats C 120 3 5 15 2 8 8 3 135 0 1 -1
All-Bran Kelloggs C 70 4 1 260 9 7 5 3 320 25 1 0.33
All-Bran_with_Extra_Fiber Kelloggs C 50 4 0 140 14 8 0 3 330 25 1 0.5
Almond_Delight Ralston Purina C 110 2 2 200 1 14 8 3 -1 25 1 0.75
Apple_Cinnamon_Cheerios General Mills C 110 2 2 180 1.5 10.5 10 1 70 25 1 0.75
Apple_Jacks Kelloggs C 110 2 0 125 1 11 14 2 30 25 1 1
Basic_4 General Mills C 130 3 2 210 2 18 8 3 100 25 1.33 0.75
Bran_Chex Ralston Purina C 90 2 1 200 4 15 6 1 125 25 1 0.67
Bran_Flakes Post C 90 3 0 210 5 13 5 3 190 25 1 0.67
Cap'n'Crunch Quaker Oats C 120 1 2 220 0 12 12 2 35 25 1 0.75
Cheerios General Mills C 110 6 2 290 2 17 1 1 105 25 1 1.25
Cinnamon_Toast_Crunch General Mills C 120 1 3 210 0 13 9 2 45 25 1 0.75
Clusters General Mills C 110 3 2 140 2 13 7 3 105 25 1 0.5
Cocoa_Puffs General Mills C 110 1 1 180 0 12 13 2 55 25 1 1
Corn_Chex Ralston Purina C 110 2 0 280 0 22 3 1 25 25 1 1
Corn_Flakes Kelloggs C 100 2 0 290 1 21 2 1 35 25 1 1
Corn_Pops Kelloggs C 110 1 0 90 1 13 12 2 20 25 1 1
Count_Chocula General Mills C 110 1 1 180 0 12 13 2 65 25 1 1
Cracklin'_Oat_Bran Kelloggs C 110 3 3 140 4 10 7 3 160 25 1 0.5
Cream_of_Wheat_(Quick) Nabisco H 100 3 0 80 1 21 0 2 -1 0 1 1
Crispix Kelloggs C 110 2 0 220 1 21 3 3 30 25 1 1
Crispy_Wheat_&_Raisins General Mills C 100 2 1 140 2 11 10 3 120 25 1 0.75
Double_Chex Ralston Purina C 100 2 0 190 1 18 5 3 80 25 1 0.75
Froot_Loops Kelloggs C 110 2 1 125 1 11 13 2 30 25 1 1
Frosted_Flakes Kelloggs C 110 1 0 200 1 14 11 1 25 25 1 0.75
Frosted_Mini-Wheats Kelloggs C 100 3 0 0 3 14 7 2 100 25 1 0.8
Fruitful_Bran Kelloggs C 120 3 0 240 5 14 12 3 190 25 1.33 0.67
Fruity_Pebbles Post C 110 1 1 135 0 13 12 2 25 25 1 0.75
Golden_Crisp Post C 100 2 0 45 0 11 15 1 40 25 1 0.88
Golden_Grahams General Mills C 110 1 1 280 0 15 9 2 45 25 1 0.75
Grape_Nuts_Flakes Post C 100 3 1 140 3 15 5 3 85 25 1 0.88
Grape-Nuts Post C 110 3 0 170 3 17 3 3 90 25 1 0.25
Great_Grains_Pecan Post C 120 3 3 75 3 13 4 3 100 25 1 0.33
Honey_Graham_Ohs Quaker Oats C 120 1 2 220 1 12 11 2 45 25 1 1
Honey_Nut_Cheerios General Mills C 110 3 1 250 1.5 11.5 10 1 90 25 1 0.75
Honey-comb Post C 110 1 0 180 0 14 11 1 35 25 1 1.33
Just_Right_Crunchy__Nuggets Kelloggs C 110 2 1 170 1 17 6 3 60 100 1 -1
Just_Right_Fruit_&_Nut Kelloggs C 140 3 1 170 2 20 9 3 95 100 1.3 0.75
Kix General Mills C 110 2 1 260 0 21 3 2 40 25 1 1.5
Life Quaker Oats C 100 4 2 150 2 12 6 2 95 25 1 0.67
Lucky_Charms General Mills C 110 2 1 180 0 12 12 2 55 25 1 1
Maypo American Home Food Products H 100 4 1 0 0 16 3 2 95 25 1 -1
Mueslix_Crispy_Blend Kelloggs C 160 3 2 150 3 17 13 3 160 25 1.5 0.67
Multi-Grain_Cheerios General Mills C 100 2 1 220 2 15 6 1 90 25 1 1
Nut&Honey_Crunch Kelloggs C 120 2 1 190 0 15 9 2 40 25 1 0.67
Nutri-Grain_Almond-Raisin Kelloggs C 140 3 2 220 3 21 7 3 130 25 1.33 0.67
Nutri-grain_Wheat Kelloggs C 90 3 0 170 3 18 2 3 90 25 1 -1
Oatmeal_Raisin_Crisp General Mills C 130 3 2 170 1.5 13.5 10 3 120 25 1.25 0.5
Post_Nat._Raisin_Bran Post C 120 3 1 200 6 11 14 3 260 25 1.33 0.67
Product_19 Kelloggs C 100 3 0 320 1 20 3 3 45 100 1 1
Puffed_Rice Quaker Oats C 50 1 0 0 0 13 0 3 15 0 0.5 1
Puffed_Wheat Quaker Oats C 50 2 0 0 1 10 0 3 50 0 0.5 -1
Quaker_Oat_Squares Quaker Oats C 100 4 1 135 2 14 6 3 110 25 1 0.5
Quaker_Oatmeal Quaker Oats H 100 5 2 0 2.7 -1 -1 1 110 0 1 0.67
Raisin_Bran Kelloggs C 120 3 1 210 5 14 12 2 240 25 1.33 0.75
Raisin_Nut_Bran General Mills C 100 3 2 140 2.5 10.5 8 3 140 25 1 0.5
Raisin_Squares Kelloggs C 90 2 0 0 2 15 6 3 110 25 1 0.5
Rice_Chex Ralston Purina C 110 1 0 240 0 23 2 1 30 25 1 1.13
Rice_Krispies Kelloggs C 110 2 0 290 0 22 3 1 35 25 1 1
Shredded_Wheat Nabisco C 80 2 0 0 3 16 0 1 95 0 0.83 -1
Shredded_Wheat_'n'Bran Nabisco C 90 3 0 0 4 19 0 1 140 0 1 0.67
Shredded_Wheat_spoon_size Nabisco C 90 3 0 0 3 20 0 1 120 0 1 0.67
Smacks Kelloggs C 110 2 1 70 1 9 15 2 40 25 1 0.75
Special_K Kelloggs C 110 6 0 230 1 16 3 1 55 25 1 1
Strawberry_Fruit_Wheats Nabisco C 90 2 0 15 3 15 5 2 90 25 1 -1
Total_Corn_Flakes General Mills C 110 2 1 200 0 21 3 3 35 100 1 1
Total_Raisin_Bran General Mills C 140 3 1 190 4 15 14 3 230 100 1.5 1
Total_Whole_Grain General Mills C 100 3 1 200 3 16 3 3 110 100 1 1
Triples General Mills C 110 2 1 250 0 21 3 3 60 25 1 0.75
Trix General Mills C 110 1 1 140 0 13 12 2 25 25 1 1
Wheat_Chex Ralston Purina C 100 3 1 230 3 17 3 1 115 25 1 0.67
Wheaties General Mills C 100 3 1 200 3 17 3 1 110 25 1 1
Wheaties_Honey_Gold General Mills C 110 2 1 200 1 16 8 1 60 25 1 0.75
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<!-- Example based on http://bl.ocks.org/mbostock/3887118 -->
<!-- Tooltip example from http://www.d3noob.org/2013/01/adding-tooltips-to-d3js-graph.html -->
<style>
body {
font: 16px sans-serif;
}
.axis path,
.axis line {
fill: none;
stroke: #fff;
shape-rendering: crispEdges;
}
.dot {
stroke: #000;
}
.tooltip {
position: absolute;
padding: 5px 5px;
pointer-events: none;
background-color: white;
border: 1px solid black;
}
form {
position: absolute;
right: 10px;
top: 720px;
}
label {
font-size: 20px;
text-transform: uppercase;
}
</style>
<body>
<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>
<!-- Technology radio buttons -->
<form>
<label><input type="radio" name="mode" value="Onshore" checked> Onshore Wind</label>
<label><input type="radio" name="mode" value="Offshore"> Offshore Wind</label>
<label><input type="radio" name="mode" value="SolarPV"> Solar PV</label>
</form>
<script>
var margin = {top: 20, right: 20, bottom: 30, left: 150},
width = 960 - margin.left - margin.right,
height = 700 - margin.top - margin.bottom;
var nest = d3.nest()
.key(function (d) { return d.Technology })
.key(function (d) { return d.Region })
.key(function (d) { return d.Period });
/*
* value accessor - returns the value to encode for a given data object.
* scale - maps value to a visual display encoding, such as a pixel position.
* map function - maps from data value to display value
* axis - sets up axis
*/
// setup x
var xValue = function(d) { return d.x;}, // data -> value
xScale = d3.scale.linear().range([0, width]), // value -> display
xMap = function(d) { return xScale(xValue(d));}, // data -> display
xAxis = d3.svg.axis().scale(xScale).orient("bottom");
// setup y
var yValue = function(d) { return d.Investor_Type; }, // data -> value
yScale = d3.scale.ordinal()
// .domain(["Utilities","Developers","FIs","Large Consumers","Small Consumers","Government"])
.rangeRoundBands([0,height+100],1), // value -> display
yMap = function(d) { return yScale(yValue(d)); }, // data -> display
yAxis = d3.svg.axis().scale(yScale).orient("left");
// setup fill color
var cValue = function(d) { return d.Score;},
color = d3.scale.pow().exponent(2).domain([1,5]).range(["#fff111","blue"]);
// add the graph canvas to the body of the webpage
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
// add the tooltip area to the webpage
var tooltip = d3.select("body").append("div")
.attr("class", "tooltip")
.style("opacity", .5);
// load data
d3.csv("160208.csv", function(error, data) {
yScale.domain(data.map(function(d) { return d.Investor_Type; }));
// change string (from CSV) into number format
data.forEach(function(d) {
d.Value = +d.Value;
d.Score = +d.Score;
d.y = +d.y;
d.x = +d.x;
// console.log(d);
});
// don't want dots overlapping axis, so add in buffer to data domain
xScale.domain([0, 29]);
// x-axis
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(0," + height + ")")
.call(xAxis)
.append("text")
.attr("class", "label")
.attr("x", width)
.attr("y", -6)
.style("text-anchor", "end")
.text("");
// y-axis
svg.append("g")
.attr("class", "y axis")
.call(yAxis)
.append("text")
.attr("class", "label")
.attr("y", 5)
.attr("dy", ".71em")
.style("text-anchor", "end")
.text("Investor Class");
// draw dots
svg.selectAll(".dot")
.data(data)
.enter().append("circle")
.attr("class", "dot")
.attr("r", function(d) {return d.Value/500;})
.attr("cx", xMap)
.attr("cy", yMap)
.style("fill", function(d) { return color(cValue(d));})
.on("mouseover", function(d) {
tooltip.transition()
.duration(200)
.style("opacity", 1);
tooltip.html("Technology: " + d["Technology"] + "<br/>" + "Region: " + d["Region"]
+ "<br/>" + "Investor: " + d["Investor_Type"] + "<br/>" + "Capacity: " + d.Value + "MW" + "<br/>" + "Market Rating: " + d.Score)
.style("left", (d3.event.pageX + 5) + "px")
.style("top", (d3.event.pageY - 28) + "px");
})
.on("mouseout", function(d) {
tooltip.transition()
.duration(500)
.style("opacity", 0);
});
// draw legend
var legend = svg.selectAll(".legend")
.data(color.domain())
.enter().append("g")
.attr("class", "legend")
.attr("transform", function(d, i) { return "translate(0," + i * 20 + ")"; });
// draw legend colored rectangles
legend.append("rect")
.attr("x", width - 18)
.attr("width", 18)
.attr("height", 18)
.style("fill", color);
// draw legend text
legend.append("text")
.attr("x", width - 24)
.attr("y", 9)
.attr("dy", ".35em")
.style("text-anchor", "end")
.text(function(d) { return d;})
d3.selectAll("input").on("change", change);
var timeout = setTimeout(function() {
d3.select("input[value=\"Onshore\"]").property("checked", true).each(change);
}, 2000);
function change() {
clearTimeout(timeout);
if (this.value === "Onshore") transitionOffshore();
else if (this.value === "Offshore") transitionSolar();
else transitionOnshore();
}
function transitionOffshore() {
var t = svg.transition().duration(750),
g = t.selectAll(".group").attr("transform", function(d) { return "translate(0," + y0(d.key) + ")"; });
g.selectAll("circle").attr("x", function(d) { return y1(d.value); });
g.select(".dot").attr("x", function(d) { return y1(d.values[0].value / 2); })
}
function transitionSolar() {
var t = svg.transition().duration(750),
g = t.selectAll(".group").attr("transform", "translate(0," + y0(y0.domain()[0]) + ")");
g.selectAll("circle").attr("y", function(d) { return y1(d.value + d.valueOffset); });
g.select(".dot").attr("y", function(d) { return y1(d.values[0].value / 2 + d.values[0].valueOffset); })
}
function transitionOnshore(){
var t = svg.transition().duration(750),
g = t.selectAll(".dot").attr("r", function(d) { return d.Value/400 });
}
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment