2f:T4c9,{ const days = dates.filter(d => d.getUTCMonth() === 2); const cellSize = 135; const cols = 7; const rows = 5; const width = cols * cellSize; const height = rows * cellSize; const svg = d3.create("svg") .attr("width", width) .attr("height", height); function getCol(date) { return date.getUTCDay(); } function getRow(date) { // https://observablehq.com/@d3/calendar/2 const week = d3.utcSunday.count(days[0], date); return week; } svg.selectAll("g") .data(days) .join("g") .attr("transform", d => `translate(${getCol(d) * cellSize},${getRow(d) * cellSize})`) .append((d, i) => RadialStackedHistogram( groupedByDay.get(d), { width: cellSize, height: cellSize, x: (d) => d.wd_smarteole, y: (d) => d.ws_smarteole, xDomain: [0, 360], yDomain: [0, 20], xTicks: i === 0 ? [90, 180, 270] : [0, 90, 180, 270], xTickFormat: (d) => `${d}°`, yTicks: 2, maxCount: 600, margin: 20, showXTickLabels: i === 0, showYTickLabels: i === 0, yAxisLabel: i === 0 ? "Counts" : d3.utcFormat("%a %b %d")(d) } )) return svg.node(); }30:[{"id":"d7e5ae38dceba1eef73d369e1f9c38e73f316b928a59f729981973092ac7621d08b7a61c636dd8fccc18a1bb9f1c5451825fa8f7b59e17bc310b313ff1905e31","href":"https://static.observableusercontent.com/files/d7e5ae38dceba1eef73d369e1f9c38e73f316b928a59f729981973092ac7621d08b7a61c636dd8fccc18a1bb9f1c5451825fa8f7b59e17bc310b313ff1905e31","name":"SMARTEOLE_WakeSteering_Map.jpg","type":"image/jpeg","lastModified":1725714208007.424,"size":199735},{"id":"5645c44f686e11c0a5a83ac9b3156f18a81a2916e9f6e4fed591894787fc85f1b6e02238eec08076e5eb577cd0322153f87b46682c96f7340f494613e247f2dc","href":"https://static.observableusercontent.com/files/5645c44f686e11c0a5a83ac9b3156f18a81a2916e9f6e4fed591894787fc85f1b6e02238eec08076e5eb577cd0322153f87b46682c96f7340f494613e247f2dc","name":"scada@1.csv","type":"text/csv","lastModified":1725714208007.424,"size":11841723},{"id":"7e504a71e56d8cfe83f8488aaf1c0379d303090f61ecaaa05fb73c8bb0c5d3ef425062de52d93b11b85d0abea0676f589389279a13d1075a3150a0bd9deb4349","href":"https://static.observableusercontent.com/files/7e504a71e56d8cfe83f8488aaf1c0379d303090f61ecaaa05fb73c8bb0c5d3ef425062de52d93b11b85d0abea0676f589389279a13d1075a3150a0bd9deb4349","name":"scada-all-wd@1.csv","type":"text/csv","lastModified":1725892800590.106,"size":11355875}] 2d:{"title":"Wind Turbine Visualization Design Space","cells":[{"id":0,"value":"# Wind Turbine Visualization Design Space\n\nWe want to analyze the effect that steering SMV6 has on the power output of SMV5. In this notebook, we explore ways of visualizing the relationship between wind speed, wind direction, wind vane, and power.","pinned":false,"hidden":false,"mode":"md"},{"id":19,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1603,"value":"## Static Conditions","pinned":false,"hidden":false,"mode":"md"},{"id":2248,"value":"### 195 - 241 degrees","pinned":false,"hidden":false,"mode":"md"},{"id":1724,"value":"These plots do not take into account time. To start, we will consider wind directions in the range of 195 to 241 degrees:","pinned":false,"hidden":false,"mode":"md"},{"id":1698,"value":"RadialStackedHistogram(data, {\n width: 400,\n height: 400,\n x: (d) => d.wd_smarteole,\n y: (d) => d.ws_smarteole,\n xDomain: [0, 360],\n yDomain: [0, 20],\n marginLeft: 40,\n marginTop: 40,\n marginRight: 40,\n marginBottom: 60,\n xTicks: [90, 180, 270],\n xTickFormat: (d) => `${d}°`,\n colorLegendTitle: \"Reference wind speed (m/s)\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2165,"value":"html`

${[\n RadialScatterplot(data, {\n width: 400,\n height: 400,\n marginTop: 20,\n marginRight: 40,\n marginBottom: 40,\n marginLeft: 40,\n theta: d => d.wd_smarteole,\n thetaDomain: [0, 360],\n thetaTicks: [90, 180, 270],\n thetaTickFormat: (d) => `${d}°`,\n r: d => d.ws_smarteole,\n rDomain: [0, 22],\n rLabel: \"Reference wind speed (m/s)\",\n radius: 1,\n strokeOpacity: 0.02,\n }),\n RadialScatterplot(data, {\n theta: d => d.wd_006,\n r: d => d.ws_006,\n radius: 1,\n width: 400,\n height: 400,\n marginTop: 20,\n marginRight: 40,\n marginBottom: 40,\n marginLeft: 40,\n thetaDomain: [0, 360],\n thetaTicks: [90, 180, 270],\n thetaTickFormat: (d) => `${d}°`,\n rLabel: \"Wind speed SMV7 (m/s)\",\n rDomain: [0, 22],\n colorLabel: \"Power (kW)\",\n radiusTicks: [500, 2000],\n radiusTickFormat: (d) => `${d} kW`,\n strokeOpacity: 0.02,\n })\n]}

`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1666,"value":"Here we plot the relationship between the power of the downwind turbine SMV5 and the reference power, which is an average of the power of unwaked turbines. We can see the effect of waking mostly at less than 220 degrees.","pinned":false,"hidden":false,"mode":"md"},{"id":1672,"value":"{\n const maxPow = d3.max(data, d => Math.max(d.pow_004, d.pow_ref_smarteole));\n \n return Plot.plot({\n aspectRatio: 1,\n width,\n x: {\n label: 'Reference Power'\n },\n y: {\n label: 'Power SMV5'\n },\n fx: {\n interval: 5,\n label: 'Reference Wind Direction'\n },\n marks: [\n Plot.dot(data, {\n x: 'pow_ref_smarteole',\n y: 'pow_004', \n fx: 'wd_smarteole',\n opacity: 0.3\n }),\n Plot.link([0], {x1: 0, y1: 0, x2: maxPow, y2: maxPow, stroke: '#a0a0a0', strokeWidth: 2}), \n ]\n })\n} ","pinned":false,"hidden":false,"mode":"ojs"},{"id":1619,"value":"Here we look at the power of a turbine versus wind speed and how much it is steered. We see that at a given wind speed, the turbine produces less power at higher absolute wind vanes. The plot is filtered to look at wind speed less than 15 m/s.","pinned":false,"hidden":false,"mode":"md"},{"id":734,"value":"Plot.plot({\n width,\n height: 600,\n fx: {\n interval: 1,\n label: \"Wind Speed SMV6\"\n },\n x: {\n ticks: 3,\n label: \"Wind Vane SMV6\"\n },\n y: {\n label: \"Power SMV6\",\n nice: true\n },\n marks: [\n Plot.frame(),\n Plot.ruleX([0], {stroke: \"#d3d3d3\"}),\n Plot.dot(data.filter(d => d.ws_005 < 15), {x: \"wind_vane_005\", y: \"pow_005\", fx: \"ws_005\", opacity: 0.1}),\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1628,"value":"In this plot, we use the reference wind speed, which is an estimate of the wind speed that SMV5 would experience if it is not waked. The x-axis is still the wind vane of the upwind turbine SMV6. The y-axis is the log power ratio. A negative value indicates that the power of SMV5 is less than the reference power. We would expect to see a higher log power ratio at larger absolute wind vanes.","pinned":false,"hidden":false,"mode":"md"},{"id":1610,"value":"Plot.plot({\n width,\n height: 600,\n fx: {\n interval: 1,\n label: \"Reference Wind Speed\"\n },\n x: {\n ticks: 3,\n label: \"Wind Vane SMV6\"\n },\n y: {\n label: \"Log power ratio\",\n nice: true\n },\n marks: [\n Plot.frame(),\n Plot.ruleX([0], {stroke: \"#d3d3d3\"}),\n Plot.dot(data.filter(d => d.ws_smarteole < 15), {x: \"wind_vane_005\", y: \"log_pow_ratio\", fx: \"ws_smarteole\", opacity: 0.1}),\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1657,"value":"If we also facet by the reference wind direction, there is no clear trend.","pinned":false,"hidden":false,"mode":"md"},{"id":1650,"value":"Plot.plot({\n width,\n height: 600,\n fx: {\n interval: 1,\n label: \"Reference Wind Speed\",\n },\n fy: {\n interval: 5,\n label: \"Reference Wind Direction\",\n },\n x: {\n ticks: 3,\n label: \"Wind Vane SMV6\",\n },\n y: {\n label: \"Log power ratio\",\n nice: true,\n },\n marks: [\n Plot.frame(),\n Plot.ruleX([0], { stroke: \"#d3d3d3\" }),\n Plot.dot(\n data.filter(\n (d) =>\n d.ws_smarteole > 4 &&\n d.ws_smarteole < 14 &&\n d.log_pow_ratio > -3 &&\n Math.abs(d.wind_vane_005) <= 20 &&\n d.log_pow_ratio < 1,\n ),\n {\n x: \"wind_vane_005\",\n y: \"log_pow_ratio\",\n fx: \"ws_smarteole\",\n fy: \"wd_smarteole\",\n opacity: 0.1,\n },\n ),\n ],\n});\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":2251,"value":"### All wind directions","pinned":false,"hidden":false,"mode":"md"},{"id":2127,"value":"viewof minPower = Inputs.range(\n [0, d3.max(dataAllWd, d => d.pow_006)],\n {label: \"Min power\", value: 0, step: 1}\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2133,"value":"viewof maxPower = Inputs.range(\n [0, d3.max(dataAllWd, d => d.pow_006)],\n {label: \"Max power\", value: 2100, step: 1}\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2146,"value":"viewof minWindSpeed = Inputs.range(\n [0, d3.max(dataAllWd, d => d.ws_006)],\n {label: \"Min wind speed\", value: 0, step: 0.25}\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2153,"value":"viewof maxWindSpeed = Inputs.range(\n [0, d3.max(dataAllWd, d => d.ws_006)],\n {label: \"Max wind speed\", value: 22, step: 0.25}\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":2113,"value":"filterableScatter = RadialScatterplot(dataAllWd, {\n theta: d => d.wd_006,\n r: d => d.ws_006,\n color: d => d.pow_006,\n radius: 1,\n width: 450,\n height: 450,\n marginTop: 40,\n marginRight: 40,\n marginBottom: 50,\n marginLeft: 50,\n thetaDomain: [0, 360],\n thetaTicks: [90, 180, 270],\n thetaTickFormat: (d) => `${d}°`,\n rLabel: \"Windspeed (m/s)\",\n colorLabel: \"Power (kW)\",\n radiusTicks: [500, 2000],\n radiusTickFormat: (d) => `${d} kW`,\n strokeOpacity: 1,\n fontSize: 20,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2173,"value":"filterableScatter.update(dataAllWd.filter(d => (\n d.pow_006 >= minPower &&\n d.pow_006 <= maxPower &&\n d.ws_006 >= minWindSpeed &&\n d.ws_006 <= maxWindSpeed)\n))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1738,"value":"RadialStackedHistogram(dataAllWd, {\n width: 400,\n height: 400,\n x: (d) => d.wd_smarteole,\n y: (d) => d.ws_smarteole,\n xDomain: [0, 360],\n yDomain: [0, 20],\n marginLeft: 40,\n marginTop: 40,\n marginRight: 40,\n marginBottom: 60,\n xTicks: [90, 180, 270],\n xTickFormat: (d) => `${d}°`,\n colorLegendTitle: \"Wind speed (m/s)\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2118,"value":"RadialScatterplot(dataAllWd, {\n theta: d => d.wd_006,\n r: d => d.ws_006,\n radius: 1,\n width: 400,\n height: 400,\n marginTop: 20,\n marginRight: 40,\n marginBottom: 40,\n marginLeft: 40,\n thetaDomain: [0, 360],\n thetaTicks: [90, 180, 270],\n thetaTickFormat: (d) => `${d}°`,\n rLabel: \"Windspeed (m/s)\",\n colorLabel: \"Power (kW)\",\n radiusTicks: [500, 2000],\n radiusTickFormat: (d) => `${d} kW`,\n strokeOpacity: 0.05,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1720,"value":"## Dynamic Conditions","pinned":false,"hidden":false,"mode":"md"},{"id":1730,"value":"These plots take into account time and are for all wind directions:","pinned":false,"hidden":false,"mode":"md"},{"id":2183,"value":"Here is a filterable radial scatterplot of this dataset for turbine SMV6:","pinned":false,"hidden":false,"mode":"md"},{"id":1833,"value":"One way to encode time is through animation. Here we show the wind rose for each day from Feb 17, 2020 - April 26, 2020.","pinned":false,"hidden":false,"mode":"md"},{"id":1783,"value":"viewof date = Scrubber(dates, {\n autoplay: false,\n loop: false,\n format: d3.utcFormat('%B %d, %Y'),\n delay: 200,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1800,"value":"animatedWindRose = RadialStackedHistogram(groupedByDay.get(dates[0]), {\n width: 400,\n height: 400,\n x: (d) => d.wd_smarteole,\n y: (d) => d.ws_smarteole,\n xDomain: [0, 360],\n yDomain: [0, 20],\n marginLeft: 40,\n marginTop: 40,\n marginRight: 40,\n marginBottom: 60,\n xTicks: [90, 180, 270],\n colorLegendTitle: \"Wind speed (m/s)\",\n xTickFormat: (d) => `${d}°`,\n maxCount: 600,\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1812,"value":"animatedWindRose.update(groupedByDay.get(date).filter(d => d.wd_smarteole >= 0))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1786,"value":"groupedByDay = d3.group(dataAllWd, d => d3.utcDay(d.time))","pinned":false,"hidden":false,"mode":"ojs"},{"id":1788,"value":"dates = Array.from(groupedByDay.keys()).slice(1, -1)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1866,"value":"We could also use small multiples, for example, to show one wind rose for each day in March.","pinned":false,"hidden":false,"mode":"md"},{"id":1878,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs"},{"id":1939,"value":"We could also represent wind speed and direction over time with a line chart with cyclically colored points or arrows.","pinned":false,"hidden":false,"mode":"md"},{"id":1912,"value":"Plot.plot({\n color: {\n domain: [0, 360],\n legend: true,\n scheme: \"Rainbow\",\n label: \"Wind direction\"\n },\n y: {\n label: \"Wind speed (m/s)\"\n },\n x: {\n type: \"utc\",\n },\n marks: [\n Plot.ruleY([0]),\n Plot.lineY(\n dataAllWd,\n Plot.binX(\n {y: \"mean\"},\n {\n x: \"time\",\n y: \"ws_smarteole\",\n interval: d3.utcHour.every(12),\n strokeOpacity: 0.3\n }\n ),\n ),\n Plot.dot(\n dataAllWd,\n Plot.binX(\n {y: \"mean\", fill: \"mean\"},\n {x: \"time\", y: \"ws_smarteole\", r: 3, fill: \"wd_smarteole\", interval: d3.utcHour.every(12)}\n ),\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2297,"value":"{ \n const legend = lineArrows.legend(\"color\");\n\n d3.select(legend).selectAll(\"text\")\n .attr(\"font-size\", 20);\n\n return legend;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":1926,"value":"lineArrows = Plot.plot({\n style: {\n fontSize: 20,\n },\n marginLeft: 30,\n marginBottom: 50,\n color: {\n domain: [0, 360],\n scheme: \"Rainbow\",\n label: \"Wind direction\"\n },\n y: {\n label: \"Wind speed (m/s)\"\n },\n x: {\n type: \"utc\",\n insetLeft: 10,\n },\n marks: [\n Plot.ruleY([0]),\n Plot.lineY(\n dataAllWd,\n Plot.binX(\n {y: \"mean\"},\n {\n x: \"time\",\n y: \"ws_smarteole\",\n interval: d3.utcHour.every(12),\n strokeOpacity: 0.3\n }\n ),\n ),\n Plot.vector(\n dataAllWd,\n Plot.binX(\n {y: \"mean\", stroke: \"mean\", rotate: \"mean\"},\n {\n x: \"time\",\n y: \"ws_smarteole\",\n stroke: \"wd_smarteole\",\n rotate: \"wd_smarteole\",\n interval: d3.utcHour.every(12),\n length: 12,\n shape: \"arrow\",\n anchor: \"middle\",\n }\n ),\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2087,"value":"Or we could remove the y-axis and encode wind speed with the length or thickness of the arrow.","pinned":false,"hidden":false,"mode":"md"},{"id":2044,"value":"Plot.plot({\n width,\n height: 75,\n color: {\n domain: [0, 360],\n legend: true,\n scheme: \"Rainbow\",\n label: \"Wind direction\"\n },\n y: {\n label: \"Wind speed (m/s)\"\n },\n x: {\n type: \"utc\",\n },\n length: {\n range: [0, 30]\n },\n marks: [\n Plot.vector(\n dataAllWd.filter(d => d.time.getUTCMonth() === 2),\n Plot.binX(\n {stroke: \"mean\", rotate: \"mean\", length: \"mean\"},\n {\n x: \"time\",\n stroke: \"wd_smarteole\",\n rotate: \"wd_smarteole\",\n interval: d3.utcHour.every(12),\n length: \"ws_smarteole\",\n shape: \"arrow\",\n anchor: \"middle\",\n strokeWidth: 2,\n }\n ),\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2077,"value":"Plot.plot({\n width,\n height: 75,\n color: {\n domain: [0, 360],\n legend: true,\n scheme: \"Rainbow\",\n label: \"Wind direction\"\n },\n y: {\n label: \"Wind speed (m/s)\"\n },\n x: {\n type: \"utc\",\n },\n length: {\n range: [0, 30]\n },\n marks: [\n Plot.vector(\n dataAllWd.filter(d => d.time.getUTCMonth() === 2),\n Plot.binX(\n {stroke: \"mean\", rotate: \"mean\", strokeWidth: \"mean\"},\n {\n x: \"time\",\n stroke: \"wd_smarteole\",\n rotate: \"wd_smarteole\",\n interval: d3.utcHour.every(12),\n shape: \"arrow\",\n anchor: \"middle\",\n strokeWidth: d => d[\"ws_smarteole\"] / 2,\n }\n ),\n )\n ]\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":182,"value":"--------------------\n## Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":2210,"value":"data = await FileAttachment(\"scada@1.csv\").csv({typed: \"auto\"})","pinned":true,"hidden":false,"mode":"ojs"},{"id":2206,"value":"dataAllWd = await FileAttachment(\"scada-all-wd@1.csv\").csv({typed: \"auto\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":171,"value":"import { Swatches } from '@d3/color-legend'","pinned":false,"hidden":false,"mode":"ojs"},{"id":1776,"value":"import {Scrubber} from \"@mbostock/scrubber\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":863,"value":"import {Scatterplot} from \"@danielkerrigan/canvas-scatterplot\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":250,"value":"import { Correlation } from \"@harrystevens/correlation\";","pinned":false,"hidden":false,"mode":"ojs"},{"id":1696,"value":"import {RadialStackedHistogram} from \"@danielkerrigan/radial-stacked-histogram\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":2102,"value":"import {RadialScatterplot} from \"@danielkerrigan/radial-scatterplot\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}