multiple series on a single plot

[Desmond]

I need to create a chart to display a daily cooling load profile for each day of the week (monday, tuesday, wednesday,etc) as shown in the attached picture.

Is there any suggestion or method to accomplish it in MangoES 2.7.10 environment?

Any help will be appreciated.

[Woody Beverley]

Hello Desmond,

I think you are probably already familiar with using our Excel Reports Module (see video)

Am I correct to assume it is a report that you wish to create or are you asking how to produce a graph on the display as in a custom dashboard?

[Desmond]

Hi woody,
Thanks for your prompt reply.
In fact both are my objective. This format of chart will be a part of excel report module. At the moment I am in the process of learning and exploring the use and configuration excel report module which is an exciting feature.
However I am clueless to create the mango dashboard as I do not involve much in jave code.Alternatively I find the dglux may be a better option.
The chart will be useful for user who need to do analysis on demand. Ultimately there should be a duration period to control the datasets.
Hope that you will give me some guidance to kick off.
Thank you

[Woody Beverley]

Great! I would suggest continue exploring the Excel Reports and if you hit a wall and have specific questions, post them here. As for a dashboard I would suggest our new Angular way of creating custom dashboards. Joel has nice intro here.

[Jared Wiltshire]

Hi Desmond,

Try pasting the following into the "play area" of the Mango Custom Dashboards v3, it should give you a graph like you are after.

<div ng-init="page={rollup:'5 minutes', rollupType:'AVERAGE', week:0, values:{}}"></div>

<div layout="row">
    <md-input-container flex="" class="no-errors-spacer">
        <label>Choose a point</label>
        <ma-point-list limit="200" ng-model="page.point"></ma-point-list>
    </md-input-container>
</div>

<div layout="row">
    <md-input-container flex class="no-errors-spacer">
       <label>Select a week</label>
       
       <md-select ng-model="page.week">
          <md-option ng-value="0">This week</md-option>
          <md-option ng-value="-1">Last week</md-option>
        </md-select>
    </md-input-container>
</div>

<ma-now update-interval="1 HOURS" output="page.now"></ma-now>

<ma-point-values point="page.point" values="page.values.sunday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':1:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.monday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':1:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':2:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.tuesday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':2:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':3:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.wednesday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':3:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':4:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.thursday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':4:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':5:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.friday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':5:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':6:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-point-values point="page.point" values="page.values.saturday"
  from="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':6:'day'"
    to="page.now|moment:'startOf':'week'|moment:'add':page.week:'weeks'|moment:'add':7:'day'"
rollup="{{page.rollupType}}" rollup-interval="{{page.rollup}}">
</ma-point-values>

<ma-serial-chart style="height: 600px; width: 100%"
series-1-values="page.values.sunday" series-1-title="Sunday"
series-2-values="page.values.monday" series-2-title="Monday"
series-3-values="page.values.tuesday" series-3-title="Tuesday"
series-4-values="page.values.wednesday" series-4-title="Wednesday"
series-5-values="page.values.thursday" series-5-title="Thursday"
series-6-values="page.values.friday" series-6-title="Friday"
series-7-values="page.values.saturday" series-7-title="Saturday"
time-format="LTS"
 options="{legend:{}, chartCursor:{categoryBalloonDateFormat:'HH:NN'}, categoryAxis:{labelRotation:45}}">
</ma-serial-chart>

[Automationforum]

This post is deleted!

[Desmond]

Thank you Woody for your support and really big thank to Jared for your script. I really excited to see it working in my screen. I will definitely give it a try.

In fact I am developing a web app to measure and verification of buildings performance in creating an awareness for efficiency and productivity. MangoES is our preferred choice to become an intelligence tool to make building and people SMART.

[Woody Beverley]

We get great joy in seeing what you guys create with Mango. Keep up the good work Desmond!