viewof dataAggregationSelected = Inputs.radio(new Map([["All Passwords", allDataSorted], ["Group by Password Type", rollupData], ["Count by Crack Difficulty", rollupDataByDifficulty]]), {value: allDataSorted, label: "Select one:"})
// Is there a way to make
viewof sortField = Inputs.select(["length", "password_type", "crack_difficulty"], {label: "Sort By:", value: "password_type"})
UvaPasswords = FileAttachment("pass1000@2.csv").csv()
// UvaPasswords.forEach(d => {
// if (d.alphabet_size == "10") {d.password_type = "numeric"}
// else if (d.alphabet_size == "26") {d.password_type = "alphabetic"}
// else if (d.alphabet_size == "36") {d.password_type = "alphanumeric"}
// else if (d.alphabet_size == "43") {d.password_type = "numeric-symbolic"}
// else if (d.alphabet_size == "59") {d.password_type = "alphabetic-symbolic"}
// else if (d.alphabet_size == "69") {d.password_type = "alphanumeric-symbolic"}
// })
//slicedData = d3.shuffle(UvaPasswords).slice(0,1000)
sortedData = d3.sort(UvaPasswords, (a,b) => d3.ascending(a[sortField],b[sortField]))
import {layoutChildren} from "@emfielduva/dvlib_layout"
dataLayout = layoutChildren("passwords", sortedData);
allDataSorted = d3.sort(UvaPasswords, (a,b)=>d3.ascending(a[sortField], b[sortField]))
rollupData = d3.rollups(UvaPasswords, v => d3.count(v, d => toNum(d["search_space_count"])), d => d["password_type"]).sort((a,b) => d3.ascending(a[1],b[1]))
rollupDataByDifficulty = d3.rollups(UvaPasswords, v => d3.count(v, d => toNum(d["search_space_count"])), d => d["crack_difficulty"], d => ["password_type"]);
import {dvPackCircles} from "@emfielduva/dvlib_layout"
pcElem = d3.select(svgContainer).select('#layer1')
pc = dvPackCircles(pcElem,dataLayout,600,600,"alphabet_size",options); // alphabet_size works fine
//pc = dvPackCircles(pcElem,dataLayout,600,600,"search_space_count",options); // for some reason doesn't like search_space_count
options = ({
transitionMS: 1000,
padding: 1,
classField: "password_type",
textLabelField: "password"
})
import {toNum} from "@emfielduva/dvlib_layout"
rollupData2 = d3.rollups(UvaPasswords, v => d3.count(v, d => toNum(d["search_space_count"])), d => d["password_type"]).sort((a,b) => d3.ascending(a[1],b[1])) //use d3.count to count how many of each type of password
//.sort(a,b) --> compares each a and b value and sorts them
//a[1] --> sorts by column 1 (numeric value)
// rollupData = d3.rollups(UvaPasswords, v=> d3.sum(v,
// d => d["password"]),
// d => d["length"]),
// d => d["alphabet_size"]),
// d => d["search_space_count"]).sort((a,b,c,d) => d3.ascending(a[1],b[1]),c[1],d[1])
viewof tableRollup = Inputs.table(rollupData)
dataLayoutFullSum = layoutChildren("passwords",rollupData);
pc2Elem = d3.select(svgContainer2).select("#layer1")
pc2 = dvPackCircles(pc2Elem,dataLayoutFullSum,600,600,'',options)
dataLayoutByDifficulty = layoutChildren("passwords", rollupDataByDifficulty);
pc3Elem = d3.select(svgContainer3).select("#bydifficulty")
pc3 = dvPackCircles(pc3Elem,dataLayoutByDifficulty,800,800,'',options)
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.
