@phildunlap Thanks. Very helpful.

Thanks Jared. Where can I find API docs for md-progress-circular? I only know of the Dashboard API, and I don't see it there.

When the chart initially renders, or re-renders when the user changes the data, I want to provide some graphic indication, such as an animated gif, that appears anytime my chart is changing, then automatically goes away when that change has completed.

Is there a built-in Mango Dashboards way to do that, or a loading flag I can access to do this myself?

Is there a "loading flag" I can access for chart rendering. The idea is that I give the user some indication that "something is happening" when the user changes the dates that my chart is based on, thus causing the chart to rerender. When my from and to dates get far apart, the chart takes a few seconds to do something, and I'd like to show something to the user during this process.

I like that ma-calc. And I added that style to the chart. No change.

Thanks. That sounded like a great idea. Unfortunately, it did not work. I double-checked, and my watch function is the only place the 'from' and 'to' dates are set. I'm using Mango 3.2.2.

The idea is that the chart always shows a 24-hour period. When the 'from' date is changed by the user via the date picker, then the watch sets the 'to' date to 24 hours later.

<!-- this is the date picker for the 'from' date -->
<mdp-date-picker class="custom-date" mdp-open-on-click="" mdp-format="ll" ng-model="from"></mdp-date-picker>

<!-- these are the points -->
<ma-point-values point="Dpoint1" values="D1Static" from="from" to="to" rollup="AVERAGE" rollup-interval="1 minutes"></ma-point-values>
<ma-point-values point="Dpoint2" values="D2Static" from="from" to="to" rollup="AVERAGE" rollup-interval="1 minutes"></ma-point-values>
<ma-point-values point="Dpoint3" values="D3Static" from="from" to="to" rollup="AVERAGE" rollup-interval="1 minutes"></ma-point-values>
<ma-point-values point="Dpoint4" values="D4Static" from="from" to="to" rollup="AVERAGE" rollup-interval="1 minutes"></ma-point-values>
<ma-point-values point="Dpoint5" values="D5Static" from="from" to="to" rollup="AVERAGE" rollup-interval="1 minutes"></ma-point-values>

<!-- this is the chart -->
<ma-serial-chart
series-1-values="D1Static" series-1-point="Dpoint1" series-1-color='#ffaa00'
series-2-values="D2Static" series-2-point="Dpoint2" series-2-color='#0000aa'
series-3-values="D3Static" series-3-point="Dpoint3" series-3-color='#00cc00'
series-4-values="D4Static" series-4-point="Dpoint4" series-4-color='#ff66cc'
series-5-values="D5Static" series-5-point="Dpoint5" series-5-color='#ff0000' series-5-axis="right"
options="{legend: {}, chartCursor: {categoryBalloonDateFormat: 'YYYY-MM-DD HH:NN'}, titles:[{text: 'Dispatch', size: 15}], valueAxes:[{title:'kW/kVAR', position:'left'},{title:'SOC%', position:'right'}]}">
</ma-serial-chart>

----------------------JS code that is executed inside maDashboards.run in maDashboards.js -------------
$rootScope.$watch('from', function() {
$rootScope.to = moment($rootScope.from).add(1, 'days').toDate();
});

I have a graph in a dashboard that is connected to 'from' and 'to' dates.
I have a listener that watches for the 'from' date to change, and changes the 'to' date to be 24 hours after the new 'from'date.
My problem: When I change the 'from' date, the graph redraws twice: once with the original 'to' date and again with the new 'to' date. This looks very unprofessional.

Example:

• original 'from' date is 9/26/2016 midnight, original 'to' date is 9/27/2016 midnight.
• date picker attached to 'from' date changes 'from' date to 9/22/2016 midnight.
• 'from' date listener in js code changes 'to' date to 9/23/2016 midnight.
• graph redraws from 9/22/2016 midnight (new 'from' date) to 9/27/2016 midnight (old 'to' date).
• graph then redraws again from 9/22/2016 midnight to 9/23/2016 midnight (new 'to' date).

If I could just tell the graph to not redraw "right away", I would be good. How do I do that?

That's good info, though. I will take a look at adminTemplate and see if that is a better solution.