2023 fall studio 9/21 - fleet's version
co2Calc = {
var totalCo2 = 0
var totalOccupants = 0
//Per capita = 16.28
//Average SF = 0.01803491773
// Pop=# of People
// SF = SF
// Co2SF=(ocMult*16.28)/SF
//do some calc and rtrn value
for (let i = 0; i < outlines.length; ++i) {
var alteredOcc = Math.round(outlines[i].occ * ocMult) // multiplying occ of each bldg by occupancy
//totalCo2 = totalCo2 + outlines[i].co2
totalCo2 = totalCo2 + outlines[i].sf/outlines[i].occ
var totalOccupants = totalOccupants+alteredOcc
}
return [Math.round(totalOccupants),Math.round(totalCo2)]
}
ocMult
viewof ocMult = Inputs.range([0, 1], {value: 1, step: 0.01, label: "ocMult"})
chart = {
const width = 500,
height = 500;
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, height]);
var g = svg.append("g").attr("id", "paths");
var p = svg.selectAll("polyline") //d3 geopath
.data(outlines)
.enter() //there are more data than elements, this selects them
.append("polyline") //appends path to data
.attr("points", function(d) {return d.pts})//required attributes
.style("stroke","black")//style
.style("stroke-width","3px")
.style("fill","rgb(255,0,0)")
.on("mouseover",polyHover)
.on("mouseout",polyHoverOut)
function polyHover(event,d){
//console.log("hello studious students")
d3.select(this).style("fill","purple")
svg
.append("text")
.attr("x","100")
.attr("y","100")
.attr("class","hoverText")
.text(d.sf)
svg
.append("text")
.attr("x","100")
.attr("y","115")
.attr("class","hoverText")
.text(co2Calc)
//.text("I love CASE 😀")
}
function polyHoverOut(){
d3.select(this).style("fill","red")
svg.selectAll("text.hoverText").remove()
}
svg
.append("text")
.attr("x","50")
.attr("y","50")
.text('Total Occupants: ' + co2Calc[0])
svg
.append("text")
.attr("x","50")
.attr("y","75")
.text('Total co2 Amount: ' + co2Calc[1])
return svg.node();
}
st3 = FileAttachment("square_test3.txt").tsv({array:true})
square_test = FileAttachment("square_test.txt").tsv({array:true})
lines_test = FileAttachment("lines_test.txt").tsv({array:true})
outlines = {
var list = lines_test
var spreadsheet = buildingList
var cleanLines = []
for (let i = 0; i < list.length-1; i=i+2) {
var id = list[i+1][0]
var idNum = Number(id)
var squareFt
var occupancy
var materials
var co2
var buildingco2
for (let k = 0; k < spreadsheet.length; k++) {
if(idNum==spreadsheet[k].address){
//console.log("match!!!!!!!")
squareFt = spreadsheet[k].sf
occupancy = spreadsheet[k].occ
materials = spreadsheet[k].material
co2 = spreadsheet[k].c02print
buildingco2 = (16.28*1.86)/spreadsheet[k].sf
}
}
cleanLines.push({pts:list[i],id:idNum,sf:squareFt,occ:occupancy,mat:materials,co2:co2,buildingco2:buildingco2})//add features to our final list of objects
}
return cleanLines
}
buildingList_link = "https://docs.google.com/spreadsheets/d/e/2PACX-1vQ-w1IY3qxAh_EX-g0FErE5OK_SiQcQGM0PnqbF-0iUp2GCEPIIqe4Ei3mwYccQQp-FyMd-xG-gIId9/pub?output=csv"
buildingList = d3.csv(buildingList_link,d3.autoType)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
