shadcn.io is not affiliated with official shadcn/ui
Wind Farm Map Block for Vue
Twelve turbines on a drawn ridge and a compass dial for the wind's direction: wakes cut the output of the turbines downwind, shown as dashed lines, a bar per turbine and a farm total.
Installation
Overview
Show what the wind does to a farm's output, with this wind farm map for Vue with Ark UI. Gustfield, a wind developer, draws twelve turbines on the contour lines of an invented ridge, Keldale Edge. The Angle Slider is a compass dial for the direction the wind comes from, N at the top, turned with the pointer or the arrow keys in steps of 5 degrees; arrows across the map point the way it blows. A turbine loses output to every other turbine that stands upwind of it, close enough and near enough to the wind's line, so turning the dial changes which turbines are shaded. A dashed line on the map joins a turbine to the ones it shades, and a ring turns dashed when a turbine loses 15 percent or more. The foot gives three figures, the farm's output against its rating, the share lost to wakes and the three most affected turbines, and the list under it has a row per turbine with its output as a Progress bar and its loss. A polite status line speaks the result once the dial settles. It's built from Angle Slider, Progress and Guides, with a CSS entrance only. For wind developers, grid operators and energy dashboards.
FAQ
How is the wake loss worked out?
Turbine A shades turbine B when A is within RANGE drawing units (130) of B and within CONE degrees (20) of the bearing the wind comes from. The loss is MAX_LOSS percent (60) less the farther away and the more off the line A stands, rounded, and a turbine adds up the losses it takes, capped at 60 percent. It is a simplified rule, not an engineering model: it ignores terrain, turbulence and wind speed, and the caption says so.
How do I use my own turbines?
Edit TURBINE_LINES: an id, a number, a position in the drawing's 480 by 360 units and the output in kW with a clear wind. RATED is each turbine's rating. In your app feed the free output from your turbine data, project real coordinates onto the map you use, and replace lossFrom with your wake model.
How do I use the dial without a mouse?
Focus the dial with Tab and use the arrow keys: each press turns it 5 degrees. It has a hidden input and a name, "Wind from, in degrees", and the visible line above the map says the direction in words ("Wind from the south-west, 225°"). The compass letters are decoration.
Can I use the map without a mouse?
Yes. The turbines are a list of buttons, one tab stop each, with the output as a bar and in megawatts and the loss as a percentage; pressing one highlights its wake lines on the map. The pins are hidden from assistive technology because the list says the same things in text.