Daylight Analysis (Old)

The aim of this app is to dynamically model the relationship between room size, window layout and the spatial distribution of internal daylighting. To make it fun to play with, I have tried to ensure the app and its calculations are as fast and interactive as possible so that changes to the room or its windows update the daylighting in close to real time, even on a tablet or phone.

As this is one of the first iterations of my daylighting tools, the model is limited to a simple axially-aligned rectangular room with any number of rectangular windows in each of the four walls. Working with such a simple model is critical at this stage as it allows me to investigate a range of optimisation strategies and more readily validate daylight results against other algorithms, as well as being a test-bed for experiments with interactive model manipulation techniques without having to deal with the complexities that a full CAD model would bring.

Changing the Model

To change the size of the room, simply select any of its bounding surfaces and then drag the appropriate arrow in the direction you want. To adjust a window, simply select it first by clicking or tapping, and then drag any of the manipulator arrows.

The circular manipulator in the centre of the window allows you to change its position. Whilst windows are automatically prevented from overlapping each other, you can still drag them into any area where they will fit, even within adjacent walls. The trick when dragging windows between walls is to make sure that the destination wall is forward facing, otherwise it thinks you are trying to drag the window into the ceiling.

To change the work plane height, either click/tap it within the model and drag it up and down or set the value directly in the Analysis tab within the DAYLIGHT SETTINGS panel.

You can also change the sizes of things by clicking or tapping any dimension value. This will show a small popup allowing you to interactively edit the numeric value. You can switch between metric and imperial dimensions within the Dimensions tab of the MODEL SETTINGS panel.

Daylight Calculation Method

The daylight calculations here use the split-flux method developed by the Building Research Establishment (BRE) in the UK. This involved converting all the required daylight factor protractors and nomograms into high-resolution look-up tables, though more recent iterations have moved to using sky patches and daylight coefficients. To validate this approach, we have done extensive comparisons of both the absolute daylight factors generated in this model with those of the same model in Radiance from LBNL, as well as the magnitude of relative changes in value when windows are enlarged/reduced, the room size changed or reflectance values varied.

As the room is relatively simple and always convex, and the window apertures are rectangular without any complex shading or light reflection systems, there is actually pretty close correlation with Radiance results. A research paper will soon be published detailing the results of this comparison and I will add a link to it here when it is available. In the interim, if you are interested, you can read a more detailed report compiled as a supplement to that paper.

A future version of this app will allow you to remotely render the current model in Radiance and then import the results back into the room so that you can do your own visual comparison. I already have most of this working but need to refine and bullet-proof the back-end systems before making it publicly available.

Interesting Features

At the moment all the daylight calculations are being done in JavaScript, which is still blazingly fast. I also have a GPU-based version I am playing with which is even faster. However, given that there is so much else going on when you interact with the model (especially when contours are displayed and multiple windows are being checked for overlaps), it turns out that the daylighting calculations are only a relatively small load compared to the shape tessellation and mesh regeneration processes. Thus the speed increase due to using the GPU with this simplified model is not actually that noticeable. When I move to analysing more complex non-rectilinear models, the GPU version will come into its own and make an extraordinary difference.

Editable Dimensions

Another interesting feature of this app is the ability to numerically edit dimensions within the context of the 3D model. When you select either the room or a window aperture, you will see both a set of manipulator arrows and some dimension lines. The dimensions will update as you drag the manipulator arrows around. However, you can also click on any dimension value to display an small popup editor that allows you to numerically edit the value, as shown in Figure 2. The editor includes buttons and a slider to make touch-based adjustment and incrementing a bit easier.

You can also numerically edit all the room dimensions in one place by clicking/tapping anywhere within the ROOM INFORMATION overlay panel. This displays the ROOM SIZE editor panel as shown in Figure 3.

Daylight Design Goals

Whilst the distribution of daylight across the room is very informative, the design goal is very often to achieve a specific daylight factor over a given minimum area of the work surface. The DESIGN GOAL panel allows you to specify the require daylight factor target and display the actual area of the analysis grid that is at or above that value. In addition, the actual numeric percentage is displayed as a value within the LEGEND overlay panel. As a shortcut, you can click and drag this numeric percentage up ad down within the legend to interactively set the target daylight factor.

At the moment the percentage value is calculated from the histogram displayed, so the increments are based on its bin resolution. A future version will decouple these items and allow much finer incremental control.

Window Frames and Dividers

Using the APERTURE SETTINGS panel you can adjust the size of window frames and dividers as well as the maximum span for glazing before additional dividers are inserted.

Reflectance and Transmittance

The MATERIAL SETTINGS panel is where you can adjust the surface reflectance and glazing transmittance values that are a key factor affecting daylight levels. The areas of red in each slider indicate unrealistic values not easily achievable with standard building materials.

The value set here are intended as room-average values rather than surface-specific. This is so that the effects of changes in each value can be seen more clearly within the model without having to edit multiple materials, etc. A more detailed daylighting app in the future will handle complex rooms with multiple materials and insets.

Future Development

The key feature of this app was to keep things as straightforward and intuitive as possible. However, there are other factors that also affect internal daylighting such as shading devices and external site obstructions. I have some of that already implemented, but am wrestling with exactly how to include it without making the app overly complicated, or whether to add it in another more advanced daylight app.

---

Change Log

0.0.7 2018-02-03

• Added ability to toggle the display of grid lines, surface colours, sample points and textual values within the daylight distribution grid. These options are available as a new menu item in the top-left of the application area as well as toggle buttons in the bottom-left.

• Having had to explain way too often why the daylight grid does not appear to cover the entire internal area of the room, I have added an option to toggle between a smoothly interpolated grid between sample points and a block grid where cells are centred on each sample point and flatly coloured based on the sample value. Toggling this option should clearly illustrate the difference between the two approaches, but a more detailed discussion can be found in the article Fitting an Analysis Grid.

• Changed the algorithm for determining the wall into which new windows are inserted to one based first on those actually facing the camera and then the currently selected window, if any. It is pretty straightforward to drag windows across any two camera-facing walls so this change should not prove too disruptive, but is considered more intuitive for new users.

• Added an additional window edit popover. Now, when you select a window in the model, the information panel beneath the legend chart on the left of the application area should switch from INFO: ROOM to INFO: APERTURE #XX, where XX is the numerical index of the aperture in the model. Clicking on the information panel, or pressing the X key, will display a popover allowing you to edit the position and size of the window relative to the host wall.

• Added a SNAP SETTINGS popover to the list in the top-right of the application area. This popover allows you to select different snap options as well as the grid snap size and dimension settings.

• Double-clicking on the central manipulator of an already selected window will toggle between a horizontal-only or vertical-only movement indicator. This will reset to both axis whenever you change selection, or you can simple double-click again to cycle through the options.

0.0.6 2017-03-19

• Added alignment snapping when interactively dragging the position or size of an aperture. By default, it only snaps to other apertures in the same wall. However, you can choose ‘All Apertures’ in the Cursor Snap menu to check alignment with all apertures in any wall. You can temporarily toggle this by holding down the SHIFT key as you drag, or actually toggle it using the V key.

• Decoupled the design target daylight factor from the histogram bin size. Previously the percentage above target was calculated from the histogram so the daylight factor value was limited to the same increments as the binned data. Now the percentage above target is calculated independently and directly from the daylight grid, so the target can be set to any value.

0.0.5 2017-02-16

• Latest Chrome release (57) just dropped support for line widths other than 1 pixel on all platforms, irrespective of hardware capabilities. As this made my line-based 3D font pretty hard to read at a single pixel width on Retina and other high resolution displays, I had to spend a week creating a variable-weight triangulated font instead. Not as simple as it sounds but at least its scalable and readable now.

0.0.4 2016-12-08

• Fixed a problem with new Chrome release (55) which introduced support for PointerEvents but with a bug where the mouse button value was not accurately reported for all move events.

0.0.3 2016-11-28

• Added perspective, axonometric, plan, front and side view button in View Settings.

• Added ability to click on a dimension value and interactively edit it in a pop-up panel.

• Added a ‘ROOM SIZE’ editor panel which you can display by clicking the ‘ROOM INFORMATION’ overlay. This allows you to numerically edit each room dimension.

• Fixed issues when undoing the interactive movement of a window to another wall.

• Added a fix and notification for Safari slowing down significantly when using a WebGL canvas larger that 1440x900 within a scaled display on a Retina screen.

• Improved automatic ground grid sizing and snapping when significantly changing the room size.

0.0.2 2016-10-06

• Added JSON editor to allow loading and saving of application settings.

• Added ability to read model and display settings from URL parameters.

• Added ability to create a URL containing model and display settings.

0.0.1 2016-09-28

• Initial release.