Input + Chart | Observable | Observable
•ojs
•ojs
•ojs
Comments (1)
SenaitB Alemu
Jan 10, 2024
// Import D3.js library const d3 = require("d3"); // Create SVG drawing area var svg = d3.select("body") .append("svg") .attr("width", 1000) .attr("height", 800); // Draw central problem var centralProblem = svg.append("circle") .attr("cx", 500) .attr("cy", 400) .attr("r", 100) .style("fill", "red"); // Label central problem svg.append("text") .attr("x", 500) .attr("y", 400) .text("Unsafe Surgical Care in LICs (Africa)") .style("text-anchor", "middle"); // Draw contributing factors var trainingResources = svg.append("rect") .attr("x", 300) .attr("y", 300) .attr("width", 120) .attr("height", 60) .style("fill", "blue"); // Add label trainingResources.append("text") .text("Inadequate Training & Resources"); // Draw other factors var standardsAdherence = svg.append("rect") .attr("x", 300) .attr("y", 400) //... var initativesFactor = svg.append("rect") .attr("x", 300) .attr("y", 500) // ... // Draw links var link1 = svg.append("line") .attr("x1", 420) .attr("y1", 340) .attr("x2", 500) .attr("y2", 400); // Add arrowheads svg.append('path') .attr('d', 'M 490 390 L 500 400 L 490 410') .attr('fill', 'black'); // Draw intervention and outcomes var intervention = svg.append("rect") .attr("x", 600) .attr("y", 350) //... var shortTerm = svg.append("circle") .attr("cx", 800) .attr("cy", 300) // ... // Connect boxes
Reply
Add comment
Subscribe to notifications
11,101
11,101
Input + Chart | Observable | Observable