turf =require("@turf/[email protected]")FA = FileAttachment// use turf.js to make the geojson winding order compatible with d3.jsasyncfunctionfixedGeoJSON(x) {const raw =awaitFA(x).json() raw.features= raw.features.map(function(f) {return turf.rewind(f, { reverse:true }); })return raw}// bedHeights = fixedGeoJSON("/data/bedmap2/bedmap2_bed_heights.geojson")bedHeights =FA("/data/bedmap2/bedmap2_bed_heights.geojson").json()landIceOutline =fixedGeoJSON("/data/bedmap2/bedmap2_surface_outline.geojson")// seaIceOutline = fixedGeoJSON("/data/nsidc/seaice_median.geojson")glacierPoints =FA("/data/nsidc/glaciers-antarctica.csv").csv()seaIceRegions =FA("/data/nsidc/seaice_median_hulls.geojson").json()// filter the sea ice regions on a timercurrentSeaIceRegion = ({...seaIceRegions,features: seaIceRegions.features.filter( d =>parseInt(d.properties.month) == monthTimer +1)})
comments = [md`When you think of Antarctica, you probably think of its ice. But underneath is a continent, with rock rising above sea level.`,md`A sheet of ice sits over nearly all of the land, as well as some of the shallow waters — kilometres thick in many places.`,md`The massive ice sheet isn’t still—it very slowly flows into the sea in rivers called glaciers.<br><br>NASA says that melting of the ice sheets has contributed to one third of the sea rise we've seen since 1993.`,md`Most of the melt currently comes from areas where part of the ice sheet sits over the ocean, as a bookshelf hangs onto a wall.<br><br>This is called an ice shelf. Ice shelves often act as plugs, holding glaciers in.`,md`Ross Ice Shelf and Ronne Ice Shelf are two of the biggest, but smaller ones hang all around the edge of Antarctica.`,md`Modelling has found that glacial ice flowing into the Amundsen Sea is vulnerable to warming, and that its melt could destabilise larger areas.<br><br> Thwaites Glacier alone could eventually raise sea levels by 65cm if the ice shelf holding it back collapses.`,md`Thinner ice also forms on the waters surrounding Antarctica. This sea ice grows in the winter and shrinks in the summer.`,md`Although the sea ice covers a large area, it does not directly influence sea rise, as it already rests on the water.<br><br>But the sea ice does protect the ice sheet from being battered by the ocean and winds.`,md`The sea ice was stable until 2016, when it started shrinking.<br><br>Scientists want to understand this sudden reversal before the sea ice melts further and exposes more of the ice sheet.`]comments[storyStep]
viewof storyStep = Inputs.button( [ ["→", value => {const maxVal = comments.length;if (value == maxVal -2) {// console.log("Disabling button after this click", this)this.disabled=truedocument.querySelector("#advance-buttons button:first-child").disabled=true } else {// console.log("Enabling button", this)document.querySelector("#advance-buttons button:first-child").disabled=false }return value < maxVal -1? value +1: value } ], ["↩", () => {document.querySelector("#advance-buttons button:first-child").disabled=falsereturn0 } ], ], {value:0,id:"storyStepsBtns" })
antarcticMap = Plot.plot({// projection: "equal-earth",// projection: {type: "orthographic", rotate: [0, -30, 20]},projection: ({width, height}) => d3.geoAzimuthalEquidistant().rotate([0,90]).translate([width /2, height /2]).scale(width /1.05).clipAngle(40),color: {type:"ordinal",range: ["#084594","#2171b5","#4292c6","#6baed6","#9ecae1","#c6dbef",// "#eff3ff","#effaff","#fec44f","#ec7014","#cc4c02","#993404" ],legend:true,swatchWidth:25 },marks: [ pattern, Plot.geo(bedHeights, {fill: d => d.properties.hi/1000,fillOpacity:0.75,stroke:null,ariaDescription:"A map showing the elevation (or depth, where it is below sea level) of the bedrock of Antarctica. Parts of the bedrock are over two kilometres above sea level." }), Plot.text(labelContinents, {ariaHidden:"true",text:"t",x:"x",y:"y",fill:"#00000033",lineWidth:12,fontSize:18,fontFamily:"Roboto Condensed",fontStyle:"italic" }),/* there's some complexity here with duplicate layers as the layers that fade in can't be displayed at the same time as the ones that animate on the timer (render transform limitation) */ storyStep >=1&& storyStep <=5? landIceOutlineLayerWithFade :null, storyStep ==2? glacierPointLayerWithFade :null, storyStep ==3|| storyStep ==4? iceShelfArrowLayerWithFade :null, storyStep ==3|| storyStep ==4? iceShelfLabelLayerWithFade :null, storyStep ==5? thwaitesGlacierPointLayerWithFade :null, storyStep ==5? thwaitesGlacierArrowLayerWithFade :null, storyStep ==5? thwaitesGlacierLabelLayerWithFade :null, storyStep >=6? seaIceRegionLayer :null, storyStep >=6? landIceOutlineLayer :null, storyStep >=6? seaIceLabelLayer :null, ],height:800,insetTop:0})
landIceOutlineLayerWithFade = Plot.geo(landIceOutline, {fill:"url(#stripes)",stroke:"#333333",strokeWidth:1,fillOpacity:0.75,render: fadeLayerIn,ariaDescription:"An outline of the parts of Antarctica covered with ice. This is typically the outline you see on maps."})landIceOutlineLayer = Plot.geo(landIceOutline, {fill:"url(#stripes)",stroke:"#333333",strokeWidth:1,fillOpacity:0.75,ariaHidden:true})iceShelfArrowLayerWithFade = Plot.arrow(labelShelves, {x1:"xfrom",y1:"yfrom",x2:"xto",y2:"yto",bend:true,stroke:"navy",strokeWidth:3,render: fadeLayerIn,aria:true})iceShelfLabelLayerWithFade = Plot.text(labelShelves, {text: d => d.t.toUpperCase(),x:"xfrom",y: d => d.yfrom+2.5,// shift labels outward, not up/downstroke:"lightcyan",fill:"navy",strokeWidth:4,fontSize:24,fontFamily:"Roboto Condensed",fontWeight:"bold",lineWidth:15,render: fadeLayerIn,ariaLabel: d => d.t})glacierPointLayerWithFade = Plot.dot(glacierPoints, {x:"lon",y:"lat",r:2.5,// opacity: 0.75,fill:"red",stroke:"#00000099",strokeWidth:0.5,render: fadeLayerIn,ariaDescription:"Points around the edges of Antarctic marking glaciers: slow-moving rivers of ice."})thwaitesGlacierPointLayerWithFade = Plot.dot( [{ lon:-106.75,lat:-75.5 }], {x:"lon",y:"lat",r:4.5,fill:"navy",stroke:"lightcyan",strokeWidth:0.5,symbol:"triangle",render: fadeLayerIn,ariaHidden:true})thwaitesGlacierArrowLayerWithFade = Plot.arrow(labelThwaites, {x1:"xfrom",y1:"yfrom",x2: d => d.xto-3.5,y2:"yto",bend:true,stroke:"navy",strokeWidth:3,render: fadeLayerIn,ariaLabel: d => d.t})thwaitesGlacierLabelLayerWithFade = Plot.text(labelThwaites, {text: d => d.t.toUpperCase(),x: d => d.xfrom-2.5,y:"yfrom",// shift labels outward, not up/downtextAnchor:"end",stroke:"lightcyan",fill:"navy",strokeWidth:4,fontSize:18,fontFamily:"Roboto Condensed",fontWeight:"bold",lineWidth:10,render: fadeLayerIn,ariaHidden:true})seaIceRegionLayer = Plot.geo(currentSeaIceRegion, {fill:"#dddddd",stroke:"#eeeeee",strokeWidth:1,fillOpacity:0.65,ariaHidden:true})seaIceLabelLayer = Plot.text(labelSeaIce,{text: d => d.t.toUpperCase(),x:"x",y:"y",textAnchor:"start",stroke:"white",fill:"#666666",strokeWidth:4,fontSize:24,fontFamily:"Roboto Condensed",fontWeight:"bold",lineWidth:20,ariaLabel: d => d.t})