Loading - please wait...

This page requires a reasonably modern HTML5 browser
with both Javascript and SVG support.

If this message is not soon replaced by an interactive chart/graph,
then it is likely that your browser does not support this web app.
Check your JavaScript Console for specific error messages.

Edit Color


SELECT DATE RANGE


Ordinal day of the year:

Ordinal day of the year:


Days to Include in Selection A N


WEEK/DAY GRID SETTINGS

Overlay Text:

Year Starts On:


Layout:

Scaling:


SCHEDULE SETTINGS

Units Type:

Value at 0:

Value at 1:

HEATMAP PADDING

INFORMATION

Overview

This application allows you to visualise and edit annual hourly schedule data. This is basically just a list of one or more daily profiles together with information about which profile applies to each day of the year.

A daily profile contains 24 hourly values that describe the temporal operation of something - be that a piece of equipment, the occupancy of a space, how open an aperture is or how much energy something is using. For flexibility, these hourly values are usually stored as fractions or percentages as this allows the same profile to be applied to buildings or equipment of different sizes. In such cases the values are used as modifiers of whatever the maximum size, load or capacity is.

Getting Started

The app contains a simple schedule when it starts up. You can load another schedule by simply dragging and dropping it anywhere within the application window in the browser, or by clicking the Import schedule data button (). To reassign a different profile to any range of days, first select them by clicking/touching the pointer in the week/day grid and dragging over the range you need. You can add to or remove from the current selection set using either the Shift key or the three selection option button in the top toolbar. You can also use the SELECT DATE RANGE popup by clicking the calendar button () in the top-right.

To edit a profile, click on its small thumbnail in the profile list to display it in the profile editor. The data in the editor will change to reflect the new current profile and the colour of the ASSIGN button will update. Use this button to assign the current profile to the selected date range in the week/day grid.

Interesting Features

The following are some of this app's more interesting features:

  • It provides a useful visual interface for overviewing annual hourly schedule data and assigning hourly profiles to specific days.
  • It allows schedule data to be exported in a range of different formats including CSV, DIVA/DaySim occupancy schedules, EnergyPlus (IDF and epJSON) and OpenStudio (gbXML is on the way).
  • Daily profiles can be dynamically re-ordered within the list by pressing the pointer on the profile you want to move and holding it down until its background turns light red, after which you can drag it to a new position.
  • If you select a range of hourly profile nodes in the profile editor, you can apply a range of different easing functions to transition the points smoothly between the first and last selected values.
  • Selected hourly profile nodes can also be incremented, scaled and even time-shifted using the controls above the profile editor.
  • Double click/tap any hourly profile node to display a popup numeric editor allowing more detailed control over the entered value.
  • Provides an EnergyPlus mode in which daily profiles are organised into weekly groups and can be applied to additional day types for dynamic switching using weather data or locale-specific holidays or work patterns.
  • Able to toggle between linear and stepped hourly profile data in order to better understand and/or demonstrate the basic time relationships.
  • Whilst date ranges can be interactively selected in the week/day grid, an additional popover is provided to allow for seasonal and monthly selection as well as more detailed control over the affected day types.

© Dr. Andrew J. Marsh, 2018.

Keyboard Modifiers

The Shift and Ctrl/Meta keys are used pretty extensively to modify interactive data entry. This applies to all increment buttons, scroll wheel motion, slider controls and input elements.

Shift Key:
Increases input to larger values, usually by ten times or significantly larger increments such as 1 month for dates and 1 hour for times.
Ctrl or Meta Key:
Decreases input to smaller values, usually by one tenth or the smallest reasonable increment such as 1 day for dates or 1 minute for times.

NOTE: You can use the scroll wheel to edit a data value when hovering over any slider, numeric input or even table rows that indicate their editibility.

Credits

This page uses the following frameworks/components:

Bootstrap  v3.3.2
Copyright © 2011-2015 Twitter, Inc. - github.com/twbs,
http://getbootstrap.com/   (LICENSE)

Bootstrap-popover-x  v1.4.0
Copyright © 2014, Kartik Visweswaran, Krajee.com,
https://github.com/kartik-v/bootstrap-popover-x   (LICENSE)

jQuery  v1.11.2
Copyright © jQuery Foundation and other contributors,
https://jquery.com/   (LICENSE)

JSON Editor
Copyright © 2015 Jos de Jong - github.com/josdejong
https://github.com/josdejong/jsoneditor/   (LICENSE)

JSURL
Copyright © 2011 Bruno Jouhier - github.com/Sage
https://github.com/Sage/jsurl/   (LICENSE)

KnockoutJS  v3.2.0
Copyright © Steven Sanderson and the Knockout.js team,
http://knockoutjs.com/   (LICENSE)

Knockstrap  v1.2.0
Copyright © 2013 Artem Stepanyuk - github.com/faulknercs,
http://faulknercs.github.io/Knockstrap/   (LICENSE)

SnackbarJS
Copyright © 2014 Federico Zivolo - github.com/FezVrasta
http://fezvrasta.github.io/snackbarjs/   (LICENSE)

SortableJS
Copyright © 2017 Lebedev Konstantin - github.com/RubaXa
https://github.com/RubaXa/Sortable   (LICENSE)

Split.js
Copyright © 2017 Nathan Cahill - github.com/nathancahill
https://github.com/nathancahill/Split.js   (LICENSE)