29:null 2a:["$","title",null,{"children":"Sleep Indices Heatmap Example | SynoSys | Observable"}] 2f:Te55,data = [ { "Cluster": 0, "Feature": "ST_long_mean", "Value": 0.964697 }, { "Cluster": 0, "Feature": "ST_long_std", "Value": -1.078434 }, { "Cluster": 0, "Feature": "WT_long_mean", "Value": -1.062746 }, { "Cluster": 0, "Feature": "WT_long_std", "Value": -1.048775 }, { "Cluster": 0, "Feature": "ST_short_mean", "Value": 0.550289 }, { "Cluster": 0, "Feature": "ST_short_std", "Value": -0.451836 }, { "Cluster": 0, "Feature": "WT_short_mean", "Value": -0.57735 }, { "Cluster": 0, "Feature": "WT_short_std", "Value": -0.57735 }, { "Cluster": 0, "Feature": "LW_Count_mean", "Value": -1.080055 }, { "Cluster": 0, "Feature": "LW_Count_std", "Value": 0.943483 }, { "Cluster": 0, "Feature": "SW_Count_mean", "Value": 1.024901 }, { "Cluster": 0, "Feature": "SW_Count_std", "Value": 0.901683 }, { "Cluster": 0, "Feature": "LW_length_mean", "Value": 0.915665 }, { "Cluster": 0, "Feature": "LW_length_std", "Value": -1.081399 }, { "Cluster": 0, "Feature": "SW_length_mean", "Value": 0.542501 }, { "Cluster": 0, "Feature": "SW_length_std", "Value": -0.453427 }, { "Cluster": 0, "Feature": "Sleep_Percentage_mean", "Value": 1.078572 }, { "Cluster": 0, "Feature": "Sleep_Percentage_std", "Value": -1.043821 }, { "Cluster": 1, "Feature": "ST_long_mean", "Value": 0.067215 }, { "Cluster": 1, "Feature": "ST_long_std", "Value": 0.181818 }, { "Cluster": 1, "Feature": "WT_long_mean", "Value": 0.922434 }, { "Cluster": 1, "Feature": "WT_long_std", "Value": 0.942782 }, { "Cluster": 1, "Feature": "ST_short_mean", "Value": 0.603995 }, { "Cluster": 1, "Feature": "ST_short_std", "Value": 1.146181 }, { "Cluster": 1, "Feature": "WT_short_mean", "Value": 1.154701 }, { "Cluster": 1, "Feature": "WT_short_std", "Value": 1.154701 }, { "Cluster": 1, "Feature": "LW_Count_mean", "Value": 0.186318 }, { "Cluster": 1, "Feature": "LW_Count_std", "Value": 0.104783 }, { "Cluster": 1, "Feature": "SW_Count_mean", "Value": -0.051817 }, { "Cluster": 1, "Feature": "SW_Count_std", "Value": 0.173838 }, { "Cluster": 1, "Feature": "LW_length_mean", "Value": 0.151404 }, { "Cluster": 1, "Feature": "LW_length_std", "Value": 0.190083 }, { "Cluster": 1, "Feature": "SW_length_mean", "Value": 0.611512 }, { "Cluster": 1, "Feature": "SW_length_std", "Value": 1.146389 }, { "Cluster": 1, "Feature": "Sleep_Percentage_mean", "Value": -0.896375 }, { "Cluster": 1, "Feature": "Sleep_Percentage_std", "Value": 0.949495 }, { "Cluster": 2, "Feature": "ST_long_mean", "Value": -1.031912 }, { "Cluster": 2, "Feature": "ST_long_std", "Value": 0.896617 }, { "Cluster": 2, "Feature": "WT_long_mean", "Value": 0.140312 }, { "Cluster": 2, "Feature": "WT_long_std", "Value": 0.105993 }, { "Cluster": 2, "Feature": "ST_short_mean", "Value": -1.154284 }, { "Cluster": 2, "Feature": "ST_short_std", "Value": -0.694345 }, { "Cluster": 2, "Feature": "WT_short_mean", "Value": -0.57735 }, { "Cluster": 2, "Feature": "WT_short_std", "Value": -0.57735 }, { "Cluster": 2, "Feature": "LW_Count_mean", "Value": 0.893737 }, { "Cluster": 2, "Feature": "LW_Count_std", "Value": -1.048266 }, { "Cluster": 2, "Feature": "SW_Count_mean", "Value": -0.973084 }, { "Cluster": 2, "Feature": "SW_Count_std", "Value": -1.075522 }, { "Cluster": 2, "Feature": "LW_length_mean", "Value": -1.067069 }, { "Cluster": 2, "Feature": "LW_length_std", "Value": 0.891316 }, { "Cluster": 2, "Feature": "SW_length_mean", "Value": -1.154013 }, { "Cluster": 2, "Feature": "SW_length_std", "Value": -0.692962 }, { "Cluster": 2, "Feature": "Sleep_Percentage_mean", "Value": -0.182197 }, { "Cluster": 2, "Feature": "Sleep_Percentage_std", "Value": 0.094326 } ] 30:Ta84,{ const combinedData = [ ...splitData(data).shortData.map((d) => ({ ...d, type: "short" })), ...splitData(data).longData.map((d) => ({ ...d, type: "long" })), ...splitData(data).otherData.map((d) => ({ ...d, type: "other" })) ]; const cellSize = 20; const clusters = [...new Set(combinedData.map((d) => d.Cluster))].map(String); const features = [...new Set(combinedData.map((d) => d.Feature))]; const margin = { top: 50, right: 50, bottom: 120, left: 20 }; const width = features.length * cellSize + margin.left + margin.right; const height = clusters.length * cellSize + margin.top + margin.bottom; const svg = d3.create("svg").attr("width", width).attr("height", height); const tooltip = d3 .select("body") .append("div") .style("position", "absolute") .style("background", "white") .style("border", "1px solid #ccc") .style("padding", "5px") .style("display", "none"); const x = d3 .scaleBand() .domain(combinedData.map((d) => d.Feature)) .range([margin.left, width]) .padding(0.1); const y = d3 .scaleBand() .domain(combinedData.map((d) => d.Cluster)) .range([0, height - margin.bottom]) .padding(0.1); const color = d3 .scaleSequential(d3.interpolateRdBu) .domain(d3.extent(combinedData, (d) => d.Value)); svg .selectAll() .data(combinedData) .enter() .append("rect") .attr("x", (d) => x(d.Feature)) .attr("y", (d) => y(d.Cluster)) .attr("width", x.bandwidth()) .attr("height", y.bandwidth()) .style("fill", (d) => color(d.Value)) .on("mouseover", function (event, d) { tooltip .style("display", "block") .html( `Cluster: ${d.Cluster}
Feature: ${ d.Feature }
Value: ${d.Value.toFixed(2)}` ) .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }) .on("mouseout", function () { tooltip.style("display", "none"); }) .on("mousemove", function (event) { tooltip .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }); svg .append("g") .attr("transform", `translate(0, ${height - margin.bottom})`) .call(d3.axisBottom(x)) .selectAll("text") .attr("y", 0) .attr("x", -100) .attr("dy", ".55em") .attr("transform", "rotate(-90)") .style("text-anchor", "start") .style("font-size", "10px"); svg .append("g") .attr("transform", `translate(${margin.left}, 0)`) .call(d3.axisLeft(y)) .selectAll("text") .style("text-anchor", "end") .style("font-size", "10px"); return svg.node(); }31:T988,{ const shortData = splitData(data).shortData; const cellSize = 20; const clusters = [...new Set(shortData.map((d) => d.Cluster))].map(String); const features = [...new Set(shortData.map((d) => d.Feature))]; const margin = { top: 50, right: 50, bottom: 120, left: 20 }; const width = features.length * cellSize + margin.left + margin.right; const height = clusters.length * cellSize + margin.top + margin.bottom; const svg = d3.create("svg").attr("width", width).attr("height", height); const tooltip = d3 .select("body") .append("div") .style("position", "absolute") .style("background", "white") .style("border", "1px solid #ccc") .style("padding", "5px") .style("display", "none"); const x = d3 .scaleBand() .domain(shortData.map((d) => d.Feature)) .range([margin.left, width]) .padding(0.1); const y = d3 .scaleBand() .domain(shortData.map((d) => d.Cluster)) .range([0, height-margin.bottom]) .padding(0.1); const color = d3 .scaleSequential(d3.interpolateRdBu) .domain(d3.extent(shortData, (d) => d.Value)); svg .selectAll() .data(shortData) .enter() .append("rect") .attr("x", (d) => x(d.Feature)) .attr("y", (d) => y(d.Cluster)) .attr("width", x.bandwidth()) .attr("height", y.bandwidth()) .style("fill", (d) => color(d.Value)) .on("mouseover", function (event, d) { tooltip .style("display", "block") .html( `Cluster: ${d.Cluster}
Feature: ${ d.Feature }
Value: ${d.Value.toFixed(2)}` ) .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }) .on("mouseout", function () { tooltip.style("display", "none"); }) .on("mousemove", function (event) { tooltip .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }); svg .append("g") .attr("transform", `translate(0, ${height - margin.bottom})`) .call(d3.axisBottom(x)) .selectAll("text") .attr("y", 0) .attr("x", -100) .attr("dy", ".55em") .attr("transform", "rotate(-90)") .style("text-anchor", "start") .style("font-size", "10px"); svg .append("g") .attr("transform", `translate(${margin.left}, 0)`) .call(d3.axisLeft(y)) .selectAll("text") .style("text-anchor", "end") .style("font-size", "10px"); return svg.node(); }32:T980,{ const longData = splitData(data).longData; const cellSize = 20; const clusters = [...new Set(longData.map((d) => d.Cluster))].map(String); const features = [...new Set(longData.map((d) => d.Feature))]; const margin = { top: 50, right: 50, bottom: 120, left: 20 }; const width = features.length * cellSize + margin.left + margin.right; const height = clusters.length * cellSize + margin.top + margin.bottom; const svg = d3.create("svg").attr("width", width).attr("height", height); const tooltip = d3 .select("body") .append("div") .style("position", "absolute") .style("background", "white") .style("border", "1px solid #ccc") .style("padding", "5px") .style("display", "none"); const x = d3 .scaleBand() .domain(longData.map((d) => d.Feature)) .range([margin.left, width]) .padding(0.1); const y = d3 .scaleBand() .domain(longData.map((d) => d.Cluster)) .range([0, height-margin.bottom]) .padding(0.1); const color = d3 .scaleSequential(d3.interpolateRdBu) .domain(d3.extent(longData, (d) => d.Value)); svg .selectAll() .data(longData) .enter() .append("rect") .attr("x", (d) => x(d.Feature)) .attr("y", (d) => y(d.Cluster)) .attr("width", x.bandwidth()) .attr("height", y.bandwidth()) .style("fill", (d) => color(d.Value)) .on("mouseover", function (event, d) { tooltip .style("display", "block") .html( `Cluster: ${d.Cluster}
Feature: ${ d.Feature }
Value: ${d.Value.toFixed(2)}` ) .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }) .on("mouseout", function () { tooltip.style("display", "none"); }) .on("mousemove", function (event) { tooltip .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }); svg .append("g") .attr("transform", `translate(0, ${height - margin.bottom})`) .call(d3.axisBottom(x)) .selectAll("text") .attr("y", 0) .attr("x", -100) .attr("dy", ".55em") .attr("transform", "rotate(-90)") .style("text-anchor", "start") .style("font-size", "10px"); svg .append("g") .attr("transform", `translate(${margin.left}, 0)`) .call(d3.axisLeft(y)) .selectAll("text") .style("text-anchor", "end") .style("font-size", "10px"); return svg.node(); }33:T988,{ const otherData = splitData(data).otherData; const cellSize = 20; const clusters = [...new Set(otherData.map((d) => d.Cluster))].map(String); const features = [...new Set(otherData.map((d) => d.Feature))]; const margin = { top: 50, right: 50, bottom: 120, left: 20 }; const width = features.length * cellSize + margin.left + margin.right; const height = clusters.length * cellSize + margin.top + margin.bottom; const svg = d3.create("svg").attr("width", width).attr("height", height); const tooltip = d3 .select("body") .append("div") .style("position", "absolute") .style("background", "white") .style("border", "1px solid #ccc") .style("padding", "5px") .style("display", "none"); const x = d3 .scaleBand() .domain(otherData.map((d) => d.Feature)) .range([margin.left, width]) .padding(0.1); const y = d3 .scaleBand() .domain(otherData.map((d) => d.Cluster)) .range([0, height-margin.bottom]) .padding(0.1); const color = d3 .scaleSequential(d3.interpolateRdBu) .domain(d3.extent(otherData, (d) => d.Value)); svg .selectAll() .data(otherData) .enter() .append("rect") .attr("x", (d) => x(d.Feature)) .attr("y", (d) => y(d.Cluster)) .attr("width", x.bandwidth()) .attr("height", y.bandwidth()) .style("fill", (d) => color(d.Value)) .on("mouseover", function (event, d) { tooltip .style("display", "block") .html( `Cluster: ${d.Cluster}
Feature: ${ d.Feature }
Value: ${d.Value.toFixed(2)}` ) .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }) .on("mouseout", function () { tooltip.style("display", "none"); }) .on("mousemove", function (event) { tooltip .style("left", event.pageX + 10 + "px") .style("top", event.pageY - 28 + "px"); }); svg .append("g") .attr("transform", `translate(0, ${height - margin.bottom})`) .call(d3.axisBottom(x)) .selectAll("text") .attr("y", 0) .attr("x", -100) .attr("dy", ".55em") .attr("transform", "rotate(-90)") .style("text-anchor", "start") .style("font-size", "10px"); svg .append("g") .attr("transform", `translate(${margin.left}, 0)`) .call(d3.axisLeft(y)) .selectAll("text") .style("text-anchor", "end") .style("font-size", "10px"); return svg.node(); }34:T1e5d,function spiralHeatmap() { // constants const radians = 0.0174532925; // All options that are accessible to caller // Default values var radius = 250; var holeRadiusProportion = 0.3; // proportion of radius var arcsPerCoil = 12; // assuming months per year var coilPadding = 0; // no padding var arcLabel = ''; // no labels var coilLabel = ''; // no labels function chart(selection) { selection.each(function(data) { const arcAngle = 360 / arcsPerCoil; const labelRadius = radius + 20; var arcLabelsArray = []; for (var i = 0; i < arcsPerCoil; i++) { arcLabelsArray.push(i); } // Create/update the x/y coordinates for the vertices and control points for the paths // Stores the x/y coordinates on the data updatePathData(data); let thisSelection = d3 .select(this) .append('g') .attr('class', 'spiral-heatmap'); var arcLabelsG = thisSelection .selectAll('.arc-label') .data(arcLabelsArray) .enter() .append('g') .attr('class', 'arc-label'); arcLabelsG .append('text') .text(function(d) { return data[d][arcLabel]; }) .attr('x', function(d, i) { let labelAngle = i * arcAngle + arcAngle / 2; return x(labelAngle, labelRadius); }) .attr('y', function(d, i) { let labelAngle = i * arcAngle + arcAngle / 2; return y(labelAngle, labelRadius); }) .style('text-anchor', function(d, i) { return i < arcLabelsArray.length / 2 ? 'start' : 'end'; }); arcLabelsG .append('line') .attr('x2', function(d, i) { let lineAngle = i * arcAngle; let lineRadius = chartRadius + 10; return x(lineAngle, lineRadius); }) .attr('y2', function(d, i) { let lineAngle = i * arcAngle; let lineRadius = chartRadius + 10; return y(lineAngle, lineRadius); }); var arcs = thisSelection .selectAll('.arc') .data(data) .enter() .append('g') .attr('class', 'arc'); arcs.append('path').attr('d', function(d) { // start at vertice 1 let start = 'M ' + d.x1 + ' ' + d.y1; // inner curve to vertice 2 let side1 = ' Q ' + d.controlPoint1x + ' ' + d.controlPoint1y + ' ' + d.x2 + ' ' + d.y2; // straight line to vertice 3 let side2 = 'L ' + d.x3 + ' ' + d.y3; // outer curve vertice 4 let side3 = ' Q ' + d.controlPoint2x + ' ' + d.controlPoint2y + ' ' + d.x4 + ' ' + d.y4; // combine into string, with closure (Z) to vertice 1 return start + ' ' + side1 + ' ' + side2 + ' ' + side3 + ' Z'; }); // create coil labels on the first arc of each coil let coilLabels = arcs .filter(function(d) { return d.arcNumber == 0; }) .raise(); coilLabels .append('path') .attr('id', function(d) { return 'path-' + d[coilLabel]; }) .attr('d', function(d) { // start at vertice 1 let start = 'M ' + d.x1 + ' ' + d.y1; // inner curve to vertice 2 let side1 = ' Q ' + d.controlPoint1x + ' ' + d.controlPoint1y + ' ' + d.x2 + ' ' + d.y2; return start + side1; }) .style('opacity', 0); coilLabels .append('text') .attr('class', 'coil-label') .attr('x', 3) .attr('dy', -4) .append('textPath') .attr('xlink:href', function(d) { return '#path-' + d[coilLabel]; }) .text(function(d) { return d[coilLabel]; }); }); function updatePathData(data) { let holeRadius = radius * holeRadiusProportion; let arcAngle = 360 / arcsPerCoil; let dataLength = data.length; let coils = Math.ceil(dataLength / arcsPerCoil); // number of coils, based on data.length / arcsPerCoil let coilWidth = (chartRadius * (1 - holeRadiusProportion)) / (coils + 1); // remaining chartRadius (after holeRadius removed), divided by coils + 1. I add 1 as the end of the coil moves out by 1 each time data.forEach(function(d, i) { let coil = Math.floor(i / arcsPerCoil); let position = i - coil * arcsPerCoil; let startAngle = position * arcAngle; let endAngle = (position + 1) * arcAngle; let startInnerRadius = holeRadius + (i / arcsPerCoil) * coilWidth; let startOuterRadius = holeRadius + (i / arcsPerCoil) * coilWidth + coilWidth * (1 - coilPadding); let endInnerRadius = holeRadius + ((i + 1) / arcsPerCoil) * coilWidth; let endOuterRadius = holeRadius + ((i + 1) / arcsPerCoil) * coilWidth + coilWidth * (1 - coilPadding); // vertices of each arc d.x1 = x(startAngle, startInnerRadius); d.y1 = y(startAngle, startInnerRadius); d.x2 = x(endAngle, endInnerRadius); d.y2 = y(endAngle, endInnerRadius); d.x3 = x(endAngle, endOuterRadius); d.y3 = y(endAngle, endOuterRadius); d.x4 = x(startAngle, startOuterRadius); d.y4 = y(startAngle, startOuterRadius); // CURVE CONTROL POINTS let midAngle = startAngle + arcAngle / 2; let midInnerRadius = holeRadius + ((i + 0.5) / arcsPerCoil) * coilWidth; let midOuterRadius = holeRadius + ((i + 0.5) / arcsPerCoil) * coilWidth + coilWidth * (1 - coilPadding); // MID POINTS, WHERE THE CURVE WILL PASS THRU d.mid1x = x(midAngle, midInnerRadius); d.mid1y = y(midAngle, midInnerRadius); d.mid2x = x(midAngle, midOuterRadius); d.mid2y = y(midAngle, midOuterRadius); d.controlPoint1x = (d.mid1x - 0.25 * d.x1 - 0.25 * d.x2) / 0.5; d.controlPoint1y = (d.mid1y - 0.25 * d.y1 - 0.25 * d.y2) / 0.5; d.controlPoint2x = (d.mid2x - 0.25 * d.x3 - 0.25 * d.x4) / 0.5; d.controlPoint2y = (d.mid2y - 0.25 * d.y3 - 0.25 * d.y4) / 0.5; d.arcNumber = position; d.coilNumber = coil; }); return data; } function x(angle, radius) { // change to clockwise let a = 360 - angle; // start from 12 o'clock a = a + 180; return radius * Math.sin(a * radians); } function y(angle, radius) { // change to clockwise let a = 360 - angle; // start from 12 o'clock a = a + 180; return radius * Math.cos(a * radians); } function chartWH(r) { return r * 2; } } chart.radius = function(value) { if (!arguments.length) return radius; radius = value; return chart; }; chart.holeRadiusProportion = function(value) { if (!arguments.length) return holeRadiusProportion; holeRadiusProportion = value; return chart; }; chart.arcsPerCoil = function(value) { if (!arguments.length) return arcsPerCoil; arcsPerCoil = value; return chart; }; chart.coilPadding = function(value) { if (!arguments.length) return coilPadding; coilPadding = value; return chart; }; chart.arcLabel = function(value) { if (!arguments.length) return arcLabel; arcLabel = value; return chart; }; chart.coilLabel = function(value) { if (!arguments.length) return coilLabel; coilLabel = value; return chart; }; return chart; }35:[] 2d:{"id":"0a6444b56b672a09","slug":null,"title":"Sleep Indices Heatmap Example","thumbnail":"53b7a1891dc28d5cb6e24c7957d8e05f98d2595c698080924ea0ac775667be30","access_level":"public","create_time":"$D2025-02-26T09:11:30.984Z","update_time":"$D2025-02-27T21:46:16.552Z","view_time":null,"first_public_time":"$D2025-02-26T10:28:40.037Z","fork":{"id":"9681ba53a1196ca1","slug":null,"title":"Heatmap Example","owner":{"id":"768b0b1650cff748","login":"synosys","name":"SynoSys"}},"stars":0,"starred":false,"owner":{"type":"team","id":"768b0b1650cff748","login":"synosys","name":"SynoSys","avatar_url":"https://avatars-next.observableusercontent.com/a1e17aaf043ef2dde071b60a281dddb515f8d4fca1b826935b9d22371e66e5dd","tier":"starter_2024"},"version":204,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"e7aeeb92f6534769","login":"isinkosemen","name":"Isin Kosemen","avatar_url":"https://avatars-next.observableusercontent.com/eba1875f048d3ca949846e25fa68a07e302128a50076b24d7fbb281190817fbf","tier":null}],"members":[{"type":"individual","id":"e7aeeb92f6534769","login":"isinkosemen","name":"Isin Kosemen","avatar_url":"https://avatars-next.observableusercontent.com/eba1875f048d3ca949846e25fa68a07e302128a50076b24d7fbb281190817fbf","tier":null,"role":"editor"},{"type":"team","id":"768b0b1650cff748","login":"synosys","name":"SynoSys","avatar_url":"https://avatars-next.observableusercontent.com/a1e17aaf043ef2dde071b60a281dddb515f8d4fca1b826935b9d22371e66e5dd","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Sleep Indices Heatmap Example","cells":[{"id":0,"value":"# Sleep Indices Heatmap Example","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":4,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":99,"value":"function splitData(data) {\n let shortData = [];\n let longData = [];\n let otherData = [];\n\n data.forEach(d => {\n if (d.Feature.includes(\"_short\") || d.Feature.includes(\"_Short\")|| d.Feature.includes(\"SW\")) {\n shortData.push(d);\n } \n else if (d.Feature.includes(\"_long\") || d.Feature.includes(\"_Long\")|| d.Feature.includes(\"LW\")) {\n longData.push(d);\n } else {\n otherData.push(d);\n }\n });\n\n return { shortData, longData, otherData };\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":103,"value":"splitData(data)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":192,"value":"$30","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":176,"value":"Short Sleep Indices","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":7,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":183,"value":"Long Sleep Indices","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":173,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":201,"value":"Other Sleep Indices","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":187,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":76,"value":"chartWidth = d3.min([500, width])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":80,"value":"chartHeight = chartWidth","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":83,"value":"chartRadius = chartWidth / 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":74,"value":"margin = 40","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":47,"value":"$34","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 2e:"$2d:body"