31:T42b,chart = { const svg = d3.create("svg") .attr("viewBox", [0, 0, width, height]); svg.append("g") .call(xAxis); svg.append("g") .call(yAxis); svg.append("g") .call(grid); const colorId = DOM.uid("color"); svg.append("linearGradient") .attr("id", colorId.id) .attr("gradientUnits", "userSpaceOnUse") .attr("x1", 0) .attr("x2", width) .selectAll("stop") .data(data) .join("stop") .attr("offset", d => x(d.year) / width) .attr("stop-color", d => color(d.balbudgt)); svg.append("path") .datum(data) .attr("fill", "none") .attr("stroke", colorId) .attr("stroke-width", 5) .attr("stroke-linejoin", "round") .attr("stroke-linecap", "round") .attr("d", line); svg.append("text") // text label for the x axis .attr("x", 50 ) .attr("y", 10) .style("text-anchor", "middle") .style("font-size", "11px") .style("font-family", "sans-serif") .text("Expenditure Gap"); return svg.node(); }32:[{"id":"ad1a24332c0d22f613dc131c56c5029a8f5d83dfcabb3e8c77615592da0deb1240f487becaa98a2bb7683cfd283ffc4a0c7c5c25a2564f2fb74c2cdeeed317d8","href":"https://static.observableusercontent.com/files/ad1a24332c0d22f613dc131c56c5029a8f5d83dfcabb3e8c77615592da0deb1240f487becaa98a2bb7683cfd283ffc4a0c7c5c25a2564f2fb74c2cdeeed317d8","name":"bbvsexg.csv","type":"text/csv","lastModified":1597152122388.488,"size":156010}] 2f:{"title":"Balanced Budget Provsion vs Expenditure Gap by Country","cells":[{"id":0,"value":"md`# Balanced Budget Provsion vs Expenditure Gap by Country`","pinned":false,"hidden":false,"mode":"ojs"},{"id":327,"value":"viewof countryselected = dropdown(dropdownOptions.sort())","pinned":false,"hidden":false,"mode":"ojs"},{"id":77,"value":"legend = {\n const id = DOM.uid().id;\n return html`\n

${color.domain().map((name, i) => html`\n

\n ${document.createTextNode(name)}\n

`)}\n

`;\n}\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":36,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":330,"value":"filteredData = dataset.filter(d => d.country==countryselected)","pinned":true,"hidden":false,"mode":"ojs"},{"id":334,"value":"dropdownOptions= d3.set(dataset.map(d => d.country)).values();","pinned":true,"hidden":false,"mode":"ojs"},{"id":337,"value":"function dropdown(options) {\n let dd = html `