31:T762,md`# Kaplan-Meier Curves I'm a big advocate for visualization as a tool to *democratize data*— that is, it's a way of making sure that the use of data isn't just the unique purview of those corporations and governments that are powerful enough to hire statisticians or computer scientists, but that *everybody* gets fair access to the information they need, and has a part of play in decision-making. I think this is especially crucial when it comes to our health. We should be able to look at our options and make decisions that are right *for us*. Potentially life and death decisions about our care and treatment shouldn't be made by [opaque and inscrutable data-driven algorithms](https://www.theverge.com/2018/3/21/17144260/healthcare-medicaid-algorithm-arkansas-cerebral-palsy). What's more, the way that statistics are presented to patients, and patients' statistical literacy, can [greatly impact the message](https://people.umass.edu/biep540w/pdf/Stephen%20Jay%20Gould.pdf) that people receive as they begin their treatment. So that's why I'd like to talk about **Kaplan-Meier curves**. The [Kaplan-Meier estimator](https://en.wikipedia.org/wiki/Kaplan%E2%80%93Meier_estimator) is a way of estimating the survival rate or occurrence rate of a particular event in a population. Where you might see it is in *survival curves* for things like cancer diagnoses. It's a way of showing how *hazardous* a particular cancer might be for a particular group of people (a *cohort*). Here's an example. Imagine I have a group of patients, all of whom have been diagnosed with a particular cancer *x*. While they all may have been diagnosed at different times, let's first orient them to a common scale, **patient time**: how many (in this case) months it's been for each patient since each of their diagnoses. After diagnosis, they each have *follow-up* appointments once a month. ` 32:T58c,settings = { var showCurve = false; var showSixMonths = false; var showMedian = false; const form = html``; form.curve.value = false; form.sixMonths.value = false; form.median.value = false; form.curve.onclick = event => { showCurve = !showCurve; form.curve.value = showCurve; if(showCurve){ chart.showCurve(); } else{ chart.hideCurve(); } form.curve.innerHTML= showCurve?"Hide Curve":"Show Curve"; form.dispatchEvent(new CustomEvent("input")); event.preventDefault(); }; form.sixMonths.onclick = event => { showSixMonths = !showSixMonths; form.sixMonths.value = showSixMonths; if(showSixMonths){ chart.showSixMonths(); } else{ chart.hideSixMonths(); } form.sixMonths.innerHTML= showSixMonths?"Hide 6 Months":"Show 6 Months"; form.dispatchEvent(new CustomEvent("input")); event.preventDefault(); }; form.median.onclick = event => { showMedian = !showMedian; form.median.value = showMedian; if(showMedian){ chart.showMedian(); } else{ chart.hideMedian(); } form.median.innerHTML= showMedian?"Hide Median":"Show Median"; form.dispatchEvent(new CustomEvent("input")); event.preventDefault(); }; return form; }33:T74a,md `In reality, of course, we don't get to look at multiple cohorts. We just have the patients that we have. And often the sizes of these cohorts are quite small. A cancer may be so rare that we just don't have many examples of it. Or the populations we're interested in are distinct enough that we have to break things up into smaller chunks. As Gould noted in the essay that I linked above, the prognoses of younger people who receive their diagnosis very early on in the progression of a disease may look quite different from those of patients who are older, or who are diagnosed later. So, I often want to compare not against the cohort of everybody who has a particular cancer, but the cohort of everybody **like me** who has that cancer. And there often just isn't much data, depending on how *me-like* I'd want to get. There are other issues as well. It turns out that we've made a lot of assumptions here. The first is that *people only stop checking in because they've died of cancer*. And this is absolutely not true. If my cancer is in remission, and has been for years, maybe I'm less diligent about making all of my appointments with my oncologist. Or maybe I move and my original oncologist loses track of me. Or perhaps I've just withdrawn from treatment entirely. If I leave the doctor's office and get killed by a bolt of lightning, it's unfortunate, but it doesn't tell anybody very much about how hazardous my particular type of cancer is. In any event, there are lots of reasons why I might stop checking in (and so my data might disappear from the chart) for reasons other than dying of cancer. If I were one of the dot-and-line patients above, and I stopped checking in for one of these reasons, my line would just disappear after a certain point: everything to the right of it would just be a big unknown. We call this ***right-censoring***.`34:T462,md`So hopefully now you'll know what to do if you see one of these curves in the wild. A Kaplan-Meier curve is just one way we have of visualizing the risks of particular events like cancers, surgeries, natural disasters, or even [the Hunger Games](https://jezebel.com/an-incredibly-detailed-super-statistical-hunger-games-s-5901466). Steep curves tend to mean that bad events (like death) happen very quickly or in large batches. Shallower ones mean that long periods of time will go by without a bad event. Important caveats: 1. **The median is not the message**. Kaplan-Meier curves are defined over cohorts of people who may have very little in common. Past performance is not a predictor of future performance. Even if it was, the outcomes of a *cohort* are only predictive of *your* outcomes insofar as you think that you and the measured cohort are similar. 2. **The real world is messy!** There's a ton of uncertainty, variability, and missing data whenever we try to find out information about the world. If you don't reflect that uncertainty in your visualizations, you might be doing people a grave disservice.`35:T1233,function drawCohort(cohort){ const svg = d3.select(DOM.svg(width, height)); var yPercent = d3.scaleLinear().domain([0,1]).range([y(0),y(cohort.length)]); var lifeLines = svg.append("g").attr("id","lifeLines").selectAll("rect").data(cohort,d => d.id).enter().append("rect") .attr("x",d=> x(d.start)) .attr("y",(d,i)=> y(i+1) - r/4) .attr("height",r/2) .attr("width",d=> x(d.end) - x(d.start)); var starts = svg.append("g").attr("id","starts").selectAll("circle").data(cohort,d => d.id).enter().append("circle") .attr("r",r) .attr("cx",d => x(d.start)) .attr("cy",(d,i) => y(i+1)); var ends = svg.append("g").attr("id","ends").selectAll("circle").data(cohort, d => d.id).enter().append("circle") .attr("r",r) .attr("cy",(d,i) => y(i+1)) .attr("cx",d => x(d.start)) .attr("opacity",d => d.alive?0:1) .attr("cx",d => x(d.end)) .attr("fill","crimson"); let curX,curY; let curveValues = []; for(let i = 0;id.x) .y(d=>d.y); svg.append("path") .datum(curveValues) .attr("id","curve") .attr("d",line) .attr("stroke","crimson") .attr("fill","none") .attr("opacity",0) .attr("stroke-width",r); svg.append("line") .attr("id","median") .attr("x1",x(0)) .attr("x2",x(months)+(r/2)) .attr("y1",yPercent(0.5)) .attr("y2",yPercent(0.5)) .attr("stroke","steelblue") .attr("stroke-width",Math.max(r/2,1.5)) .attr("opacity",0); svg.append("circle") .attr("id","medianPt") .attr("cx",x(1)) .attr("cy",yPercent(0.5)) .attr("r",Math.max(r,3)) .attr("fill","steelblue") .attr("opacity",0); svg.append("line") .attr("id","sixMonths") .attr("x1",x(6)) .attr("x2",x(6)) .attr("y1",margin) .attr("y2",height-margin) .attr("stroke","steelblue") .attr("stroke-width",Math.max(r/2,1.5)) .attr("opacity",0); svg.append("circle") .attr("id","sixMonthsPt") .attr("cx",x(6)) .attr("cy",y(cohort.length-1)) .attr("r",Math.max(r,3)) .attr("fill","steelblue") .attr("opacity",0); var xAxis = d3.axisBottom(x); svg.append("g").call(xAxis); var yAxis = d3.axisLeft(yPercent).tickArguments([Math.min(20,cohort.length),"%"]); svg.append("g") .attr("transform", "translate("+margin+", 0)") .call(yAxis); svg.node().hideCurve = function(){ d3.select("#curve") .transition() .duration(1500) .attr("opacity",0); d3.select("#ends").selectAll("circle").data(cohort, d => d.id) .transition() .attr("opacity",d => d.alive?0:1) .attr("cy",(d,i) => y(i+1)); d3.select("#starts").selectAll("circle").data(cohort, d => d.id) .attr("opacity",1) .attr("cy",(d,i) => y(i+1)); d3.select("#lifeLines").selectAll("rect").data(cohort, d => d.id) .transition() .attr("opacity",1) .attr("y",(d,i) => y(i+1)); }; svg.node().showCurve = function(){ d3.select("#starts").selectAll("circle").data(cohort, d => d.id) .transition() .attr("opacity",0); d3.select("#lifeLines").selectAll("rect").data(cohort, d => d.id) .transition() .attr("opacity",0); d3.select("#curve") .transition() .attr("opacity",1); d3.select("#ends").selectAll("circle").data(cohort, d => d.id) .transition() .duration(2000) .attr("opacity",0); }; svg.node().hideMedian = function(){ svg.select("#median") .transition() .attr("opacity",0); svg.select("#medianPt") .transition() .attr("opacity",0) .attr("cx",x(1)); }; svg.node().showMedian = function(){ svg.select("#median") .transition() .attr("opacity",1); svg.select("#medianPt") .attr("opacity",1) .transition() .duration(2000) .attr("cx",x(median)); }; svg.node().hideSixMonths = function(){ svg.select("#sixMonths") .attr("opacity",0); svg.select("#sixMonthsPt") .attr("opacity",0) .attr("cy",y(cohort.length-1)); }; svg.node().showSixMonths = function(){ svg.select("#sixMonths") .transition() .attr("opacity",1); svg.select("#sixMonthsPt") .attr("opacity",1) .transition() .duration(2000) .attr("cy",y(sixMonths*cohort.length)); } return svg.node(); }36:T5b8,function drawCurvesSuper(){ const svg = d3.select(DOM.svg(width,height)) .attr("float","left"); const yPercent = d3.scaleLinear().domain([0,1]).range([y(0),y(n)]); cohorts.forEach(function(cohort){let curX,curY; let curveValues = []; let survivorIndex = cohort.map(d=>d.alive).lastIndexOf(true); if(survivorIndex==-1){ curX = x(months); curY = yPercent(0); curveValues.push({"x":curX, "y": curY}); } curX = Math.max(months,x(dl.max(cohort,d => d.end))); curY = survivorIndex==-1 ? yPercent(0) : y(survivorIndex+1); curveValues.push({"x":curX, "y": curY}); cohort.forEach(function(d,i){ if(!d.alive){ curveValues.push({"x":curX,"y":curY}); curX = x(d.end); curveValues.push({"x":curX,"y":curY}); curY = y(i+1); } }); curveValues.push({"x":x(cohort[cohort.length-1].end),"y":y(cohort.length)}); curveValues.push({"x":x(0),"y":y(cohort.length)}); let line = d3.line() .x(d=>d.x) .y(d=>d.y); svg.append("path") .datum(curveValues) .attr("id","curve") .attr("d",line) .attr("stroke","crimson") .attr("fill","none") .attr("opacity",Math.max(2/draws,0.1)) .attr("stroke-width",r); }); let xAxis = d3.axisBottom(x); svg.append("g").call(xAxis); let yAxis = d3.axisLeft(yPercent).tickArguments([Math.min(20,n),"%"]); svg.append("g") .attr("transform", "translate("+margin+", 0)") .call(yAxis); return svg.node(); }37:T6a6,function drawCurve(cohort,w,h,drawAxes,kaplan){ let cMargin = drawAxes ? margin : 0; let rs = r*(h/height); let xs = d3.scaleLinear().domain([0,months]).range([rs+cMargin,w-cMargin-rs]); let ys = d3.scaleLinear().domain([1,cohort.length]).range([h-cMargin-rs,cMargin+rs]); const svg = d3.select(DOM.svg(w, h)) .attr("float","left"); const yPercent = d3.scaleLinear().domain([0,1]).range([ys(0.5),ys(cohort.length)]); if(drawAxes){ let xAxis = d3.axisBottom(xs); svg.append("g").call(xAxis); let yAxis = d3.axisLeft(yPercent).tickArguments([Math.min(20,cohort.length),"%"]); svg.append("g") .attr("transform", "translate("+cMargin+", 0)") .call(yAxis); } if(cohort.length==0){ return svg.node(); } let curX,curY; let curveValues = []; for(let i = 0;id.x) .y(d=>d.y); svg.append("path") .datum(curveValues) .attr("id","curve") .attr("d",line) .attr("stroke","crimson") .attr("fill","none") .attr("opacity",1) .attr("stroke-width",rs); let tickSize = Math.max(20,ys(0)-ys(1)); if(kaplan){ svg.append("g").selectAll("rect").data(cohort.filter(d => d.censored)).enter().append("rect") .attr("x",d => xs(d.cend)) .attr("y",d => yPercent(s(cohort,d.cend,kaplan))-(tickSize/2)) .attr("width",rs) .attr("height",tickSize) .attr("fill","crimson"); } return svg.node(); }38:[] 2f:{"title":"Kaplan-Meier Curves","cells":[{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":50,"value":"md`We can have different *cohort* sizes. Adjust the slider below to change the size of the cohort ${tex `n(0)`}. Currently **${n} patients**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":61,"value":"md`Cancers can also be more or less *deadly*. Adjust the slider below to change the probability that a patient dies in a particular month (γ). We normally don't know this number, but we'll be using it to power our survival curves.\nCurrently **${Math.round(gamma*100)}%**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":156,"value":"md`Let's also choose how long we are *observing* our patients. Currently **${months} months.**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":92,"value":"md`We can use these numbers to simulate what happens to a cohort over time. Every time you change a parameter, I simulate a new cohort of patients. Each patient is a black dot. Pretend the entire cohort was diagnosed at the same time, and we check in with them every month. The longer the line extending out from the circle, the more check-ins that patient made it to. I'm representing the last check-in that a patient made it to with a red circle. I then sort the entire cohort based on how many check-ins each patient made it to. Longer-lived patients end up towards the bottom, and shorter-lived patients are towards the top.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":35,"value":"\nviewof n = slider(\"# of patients\",20,5,200);\n//html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":102,"value":"viewof months = slider(\"Months\",24,12,120,6);\n//html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":63,"value":"viewof gamma = slider(\"γ\",0.1,0,1,0.01);\n//html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":444,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":78,"value":"chart = drawCohort(cohortSimple)","pinned":false,"hidden":false,"mode":"ojs"},{"id":270,"value":"md`Some patients make it to the end of the observation period. Others don't. The survival curve is the **the line we draw between all the red dots**. It tells us *the relative risk in a population*. The steeper this curve, the riskier things are (in this case, the more deadly the cancer). Click the button to draw the survival curve for your cohort.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":835,"value":"md`This survival curve tells us the chance that a particular member of the cohort is alive at time *t*. Assuming there are *${tex `n(t)`}* total patients living in a given month *t*, and *${tex `d(t)`}* patients die that month, this generates a probability of surviving a particular month as:\n\n${tex`1-\\frac{d(t)}{n(t)}`}\n\nThe probability of living to *at least* month *t* is then just the result of multiplying all of those probabilities together for each month 1...*t*, or:\n\n${tex`S(t) = \\prod_{i=0}^{i=t}1-\\frac{d(i)}{n(i)}`}\n\nThis is our **survival function**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":297,"value":"{\n var text = \"**Half of your cohort stopped checking in after \"+median+\" months**\";\n if(median>months){\n text = \"**More than half of your cohort made it through the entire observation period**\";\n }\n const para = md`One of the things that the curve gives us is an estimator of the **median length of survival**. That is, we go down our sorted list of patients, and the length of time that the patient in the middle of our cohort made it to is a reasonable guess for how long you'd expect a new member of the cohort make it to. ${text}.`\n return para;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":299,"value":"md`Another thing you can get out of the curve is a **time-based survival rate**. That is, one or two or three years out, what percentage of the cohort is checking in? Simply draw a line down from the x axis at the desired time, count the number of dots that are still making their check-ins, and then divide by the cohort size. **${Math.round(sixMonths*100)}% of your cohort checked in at six months**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":646,"value":"md`There's quite a bit of randomness, even for the simple model of risk I've built here. This randomness will be especially apparent in smaller cohorts, where one or two unlucky patients can alter the entire visual appearance of the curve. Try adjusting the slider below to see many different curves that you *could* have seen, given your parameters above.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":637,"value":"viewof draws = slider(\"Number of cohorts:\",5,1,100,1);","pinned":false,"hidden":false,"mode":"ojs"},{"id":687,"value":"chartS = drawCurvesSuper()","pinned":false,"hidden":false,"mode":"ojs"},{"id":596,"value":"//uncomment this line to see all the curves side by side!\n//chartJ = drawCurvesJuxta()","pinned":false,"hidden":false,"mode":"ojs"},{"id":651,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":730,"value":"md`Let's assume that **${kappa}** ${kappa==1 ? \"patient\" : \"patients\"} will drop out of our cohort at some random time in our observational window. We don't know what happens to them later; all we know is that we don't have any more data after that check-in. Adjust the slider to control the number of right-censored patients.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":725,"value":"viewof kappa = slider(\"Dropouts\",2,0,n-4,1);","pinned":false,"hidden":false,"mode":"ojs"},{"id":722,"value":"md`The question is then what to do with data once it becomes right-censored. We no longer have an exact survival curve of our cohort. Instead, we now only have an **estimated survival curve**. We don't know how hazardous a cancer is, because we don't know what happens to parts of our cohort.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":821,"value":"md`One option is to **throw out all the points that are right censored**, so we'd be drawing our curve with only the ${n-kappa} patients we observed throughout the entire period. Here's what that looks like:` ","pinned":false,"hidden":false,"mode":"ojs"},{"id":754,"value":"chartRemove = drawCurve(cohortSimple.filter(d=> !d.censored),2*width/3,2*height/3,true)","pinned":false,"hidden":false,"mode":"ojs"},{"id":827,"value":"md`But this potentially throws away lots of information! If a patient survives for months or years, but then right-censors just at the end, that's a lot of data about survivability that we're filtering out.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":834,"value":"md`The Kaplan Meier estimator solves this problem by only removing patients at the exact last minute. We get data from patients until they right-censor, and then remove them from consideration. In other words, we **shrink the number of at-risk patients** in the cohort based on the number of right-censored patients. The denominator in our survival function gets smaller each month someone withdraws from our cohort. Mathematically, assuming ${tex `w(t)`} people withdraw at month *t*:\n\n${tex `n(i+1) = n(i)-d(i)-w(i)`}\n\nAnd so:\n\n${tex`\\hat{S}(t) = \\prod_{i=0}^{i=t}1-\\frac{d(i)}{n(i)}`}\n\nThe hat (^) tells us that this is just an *estimate* of ${tex `S(t)`}\n\nHere's our final Kaplan-Meier curve. We use a tick mark to indicate intervals where patients are censored. These ticks denote places where patients were right-censored, and so the subsequent data gets just a little, well, *iffy*-ier.\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":887,"value":"chartKaplan = drawCurve(cohortSimple,width,height,true,true)","pinned":false,"hidden":false,"mode":"ojs"},{"id":932,"value":"$34","pinned":false,"hidden":false,"mode":"ojs"},{"id":98,"value":"cohortSimple = simulateSimple(n,gamma,months)","pinned":false,"hidden":false,"mode":"ojs"},{"id":350,"value":"median = dl.median(cohortSimple,d => d.span)","pinned":false,"hidden":false,"mode":"ojs"},{"id":352,"value":"sixMonths = cohortSimple.filter(d=>d.span>=6).length / cohortSimple.length","pinned":false,"hidden":false,"mode":"ojs"},{"id":668,"value":"cohorts = drawCohorts(draws)","pinned":false,"hidden":false,"mode":"ojs"},{"id":97,"value":"function simulateSimple(){\n var cohort = [];\n var end = months;\n //initialize our cohort.\n for(var i = 1;i<=n;i++){\n //we assume that they were diagnosed on the same day, and lived until at least the end of our observation period.\n //kappa patients are censored. they drop out at some random time in our span.\n let patient = {\"id\":i, \"start\":0, \"end\":months+1, \"span\":months+1, \"alive\":true, \"censored\":false};\n if(i<=kappa){\n patient.censored = true;\n patient.cend = ~~(Math.random() * (months - 1)) + 1;\n }\n cohort.push(patient);\n }\n \n //for each month, check if each patient who is alive, died or was censored\n for(var j=1;j<=months;j++){\n cohort.filter(d => d.alive).forEach(function(d){\n if(Math.random()<=gamma){\n d.alive = false;\n d.end = j;\n d.span = d.end-d.start;\n }\n });\n }\n return cohort.sort(dl.comparator('-span'));\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":80,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":659,"value":"function drawCohorts(){\n let cohorts = [];\n for(let i = 0;i d.end>=t || (censoring && d.cend && d.cend>t)).length\n //cohort.filter(d => d.end>t && (censoring && d.cend && d.cend>t)).length;\n let d = cohort.filter(d => d.end==t).length;\n if(n==0){\n return 0;\n }\n else{\n return s(cohort,t-1,censoring) * (1-(d/n));\n }\n }\n\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":425,"value":"x = d3.scaleLinear().domain([0,months]).range([margin+r,width-margin-r]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":435,"value":"y = d3.scaleLinear().domain([1,cohortSimple.length]).range([height-margin-r,margin+r]);","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"d3 = require(\"d3@5\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":16,"value":"dl = require(\"datalib\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":223,"value":"import {slider} from \"@jheer/dom-utilities\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W38","stdlib":"1","titling":"auto"}