Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- var games = data;
- console.log(games);
- var svgContainer = d3.select("main").append("svg")
- .attr("id", "canvas")
- .attr("width", 1000)
- .attr("height", 1000);
- var circles = svgContainer.selectAll("circle")
- .data(games)
- .enter()
- .append("circle")
- var xCordinate = 0
- var xCordinate2 = 0
- var radius = 20
- var circleAttributes = circles
- .attr("cx", function(d){
- xCordinate = xCordinate + 42
- return xCordinate;
- })
- .attr("cy", 100)
- .attr("r", radius)
- .style("fill", function(d){
- var returnColor;
- if (d.result === 'Loss') { returnColor = "red";
- } else if (d.result === 'Win') { returnColor = "green";}
- return returnColor;
- })
- .on("mouseover", function(d){
- d3.select(this)
- .style("fill", "blue")
- .attr("r", radius * 10)
- .attr("cy", 500)
- .attr("cx", 500)
- })
- .on("mouseout", function(d){
- d3.select(this)
- .style("fill", function(d){
- var returnColor;
- if (d.result === 'Loss') { returnColor = "red";
- } else if (d.result === 'Win') { returnColor = "green";}
- return returnColor;
- })
- .attr("r", radius)
- .attr("cy", 900)
- .attr("cx", function(d){
- xCordinate2 = xCordinate2 + 42
- return xCordinate2;
- })
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement