31:[{"id":"eda8a802fb7fd7429555174d1054ed864838ed3805a56a3cec27d6e065b8c12eefab55fb777078ef832caa2f6219b6952d5ff1cdd57e39d00bbc91225f14fbec","href":"https://static.observableusercontent.com/files/eda8a802fb7fd7429555174d1054ed864838ed3805a56a3cec27d6e065b8c12eefab55fb777078ef832caa2f6219b6952d5ff1cdd57e39d00bbc91225f14fbec","name":"windgrid.csv","type":"text/csv","lastModified":1641586387940.979,"size":163963}] 2f:{"title":"Vector Mark / Observable Plot","cells":[{"id":0,"value":"

Vector Mark / Observable Plot

Observable Plot › Marks › Vector · API

\n\n# Plot: Vector\n\nThe **vector** mark represents data as little arrows, typically positioned in *x* and *y* quantitative dimensions, with a given magnitude (*length*) and direction (*rotate*), as in a vector field. For example, the plot below shows the wind speed and direction for a section of western Europe. (Based on a [LitVis example](https://github.com/gicentre/litvis/blob/master/examples/windVectors.md).)","pinned":false,"hidden":false,"mode":"md"},{"id":38,"value":"wind = FileAttachment(\"windgrid.csv\").csv({typed: true})","pinned":true,"hidden":false,"mode":"ojs"},{"id":40,"value":"Plot.plot({\n inset: 10,\n width: 1152,\n height: 870, // for a rougly equirectangular projection\n color: {\n scheme: \"viridis\",\n label: \"Speed (m/s)\",\n zero: true,\n legend: true\n },\n marks: [\n Plot.vector(wind, {\n x: \"longitude\",\n y: \"latitude\",\n rotate: ({u, v}) => Math.atan2(u, v) * 180 / Math.PI,\n length: ({u, v}) => Math.hypot(u, v),\n stroke: ({u, v}) => Math.hypot(u, v)\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":71,"value":"Per [Remote Sensing Systems](https://www.remss.com/measurements/ccmp/) documentation:\n\n> *Standard U and V coordinates apply, meaning the positive U is to the right and positive V is above the axis. U and V are relative to true north. CCMP winds are expressed using the oceanographic convention, meaning a wind blowing toward the Northeast has a positive U component and a positive V component.*\n> \n> *Longitude is given in degrees East from 0.125 to 359.875 and latitude is given in degrees North with negative values representing southern locations.*","pinned":false,"hidden":false,"mode":"md"},{"id":178,"value":"And here is another example using Poisson disk sampling of a Perlin noise field:","pinned":false,"hidden":false,"mode":"md"},{"id":13,"value":"Plot.plot({\n inset: 12,\n height: 1152,\n width: 1152,\n marks: [\n Plot.vector(samples([0, 0, 2, 2], 4000), {\n length: ([x, y]) => (noise(x + 2, y) + 0.5) * 24,\n rotate: ([x, y]) => noise(x, y) * 360\n })\n ]\n})","pinned":true,"hidden":false,"mode":"ojs"},{"id":191,"value":"noise = octave(perlin2, 2)","pinned":true,"hidden":false,"mode":"ojs"},{"id":169,"value":"Next \nAPI Reference","pinned":false,"hidden":false,"mode":"md"},{"id":185,"value":"---\n\n## Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":182,"value":"import {perlin2, octave} from \"@mbostock/perlin-noise\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":15,"value":"import {samples} from \"@mbostock/poisson-disk-sampling\"","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}