Public
Edited
Dec 10, 2023
exampleAnswerSet = [
[2,25,250,250,5,3,2500000,2500,3,250,2,2500,2500000,5,3,1,2500000000,0.00001],
[2500,3,250,2,2500,2500000,5,3,1,2500000000,"skip",2,25,250,250,5,3,2500000],
[5,3,1,2500000000,"skip",2,"skip",250,250,5,"skip",2500000,2500,3,250,2,2500,2500000]
]
viewof answerSelect = Inputs.select(exampleAnswerSet, {label: "Play with answer set", width: 1000})
${cyclesSorted.length>0 ?
`The money pump for the cycle selected above would work as follows:
Suppose you're stuck with the suffering of 1 member of ${sortedGraphHighlight[0]}.
But you value this similarly to the suffering of ${sortedQnA.filter(a => (a['Patient A']==sortedGraphHighlight[0])&&(a['Patient B']==sortedGraphHighlightShift[1]))[0]} ${sortedGraphHighlightShift[1]}, so presumably would accept a trade for the latter.
${sortedGraphHighlight.map((p,i) =>
`1. But you value the suffering of 1 member of ${sortedGraphHighlight[0]} similarly to the suffering of ${sortedQnA.filter(a => (a['Patient A']==p)&&(a['Patient B']==sortedGraphHighlightShift[i]))[0].weight} ${sortedGraphHighlightShift[i]}, so presumably would accept a trade for the latter.`
).join(`
)} : ``
}
sortedQnA.filter(a => (a['Patient A']==sortedGraphHighlight[0])&&(a['Patient B']==sortedGraphHighlightShift[1]))
sortedGraphHighlight.map((p,i) => sortedQnA.filter(a => (a['Patient A']==p)&&(a['Patient B']==sortedGraphHighlightShift[i]))[0].weight)
weightedCycles = findCircuitsWithCost(sortedQnA, true).sort((a,b) => a.path.length - b.path.length);
reducedWeightedCycles = removeSimilarLoopsWithCost(weightedCycles).sort((a,b) => -a.cost + b.cost);
plotWeights = weights.map(p => ({patient: p.node, weight: 1/p.minWeight})).sort((a, b) => b.weight - a.weight);
visual = {
// Set up the SVG dimensions
const svgWidth = 500;
const svgHeight = 300;
const margin = { top: 60, right: 20, bottom: 20, left: 200 };
// Calculate the bar height based on the number of classes
const barHeight = (svgHeight - margin.top - margin.bottom) / plotWeights.length;
// Create the SVG container
const svg = d3csv.create("svg")
.attr("width", svgWidth)
.attr("height", svgHeight);
// Create a scale for the x-axis
const xScale = d3csv.scaleLog()
.domain([d3csv.min(plotWeights, d => d.weight)/10, d3csv.max(plotWeights, d => d.weight)])
.range([margin.left, svgWidth - margin.right]);
// Create and append the bars
svg.selectAll(".bar")
.data(plotWeights)
.enter().append("rect")
.attr("class", "bar")
.attr("x", margin.left)
.attr("y", (d, i) => margin.top + i * barHeight)
.attr("width", d => xScale(d.weight) - margin.left)
.attr("height", barHeight - 2);
// Add text labels to the bars
svg.selectAll(".bar text")
.data(plotWeights)
.enter().append("text")
.attr("class", "bar text")
.attr("x", d => margin.left-10)
.attr("y", (d, i) => margin.top + i * barHeight + barHeight / 2)
.attr("dy", "0.35em")
.text(d => d.patient)
.attr("text-anchor", "end");
// Add marker definitions
svg.append("defs")
.append("marker")
.attr("id", "arrow")
.attr("viewBox", "0 0 10 10")
.attr("refX", "5")
.attr("refY", "5")
.attr("markerWidth", "6")
.attr("markerHeight", "6")
.attr("orient", "auto-start-reverse")
.append("path")
.attr("d", "M 0 0 L 10 5 L 0 10 z");
// Add a double-headed arrow line
svg.append("line")
.attr("x1", margin.left)
.attr("y1", margin.top-10)
.attr("x2", svgWidth - margin.right)
.attr("y2", margin.top-10)
.attr("stroke", "black")
.attr("stroke-width", 1)
.attr("marker-start","url(#arrow)")
.attr("marker-end","url(#arrow)");
// Add "None" label
svg.append("text")
.attr("class", "text")
.attr("x", margin.left) // Adjust for positioning
.attr("y", margin.top - 20) // Adjust for positioning
.text("None")
.attr("text-anchor", "middle");
// Add "Most" label
svg.append("text")
.attr("class", "text")
.attr("x", svgWidth - margin.right) // Adjust for positioning
.attr("y", margin.top - 20) // Adjust for positioning
.text("Most")
.attr("text-anchor", "middle");
// Add title
svg.append("text")
.attr("class", "text")
.attr("x", margin.left + (svgWidth-margin.right-margin.left) / 2)
.attr("y", margin.top - 20) // Adjust for positioning
.text("Moral Value")
.attr("text-anchor", "middle");
return svg.node();
}
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.
