Please Note This forum exists for community support for the Mango product family and the Radix IoT Platform. Although Radix IoT employees participate in this forum from time to time, there is no guarantee of a response to anything posted here, nor can Radix IoT, LLC guarantee the accuracy of any information expressed or conveyed. Specific project questions from customers with active support contracts are asked to send requests to support@radixiot.com.

Radix IoT Website Mango 3 Documentation Website Mango 4 Documentation Website

First initializing a chart using ma-point-values xid built using other datapoint values


  • Hi,
    I've a chart where I want to show the power of an inverter, this is a template page named "home.html" I want to use it for several different inverter, so I calculate the datapoint xid using other two datapoints "plantNameAcronym" and "trackerRowColumn":

    <div flex layout="column" layout-gt-sm="row" layout-align="space-between" ng-init="live=1; energy=0">
      <md-card flex="100" flex-gt-sm="50">
    
        <md-card-title>
          <md-button ng-class="{'selected': live === 1, 'not-selected':live!==0}" ng-mousedown="live=1; from=theTimeNow">LIVE</md-button>
          <mdp-date-picker mdp-placeholder="Day" ng-click="live=0" mdp-open-on-click="" mdp-format="ll" ng-model="from"></mdp-date-picker>
        </md-card-title>
    
    
        <md-card-content class="graph-content">
          <div ng-if="live ==0">
            <ma-point-values point-xid="{{plantNameAcronym.value}}_TRK-{{trackerRowColumn.value}}_FML01-power-smart" point="powerPast" values="powerPastValues"
                  from="from | moment:'startOf':'day' | moment:'add':3:'hours'"
                  to="from | moment:'endOf':'day'" rollup="LAST" rollup-interval="1 minutes">
             </ma-point-values>
          
          
             <ma-serial-chart style="height: 250px; width: 98%" series-1-values="powerPastValues" series-1-color="#F88F24" series-1-point="powerPast" series-1-type="line"
                legend="false" default-balloon-text="Power: [[value]] kW" balloon="true" export="true"  stack-type="regular"
                options="{export: {'dateFormat': 'DD/MM/YYYY H:mm ', 'fileName': 'Power'},
                titles:[{text:'Power chart',color:'#165A87'}],
                valueAxes:[{title:'[kW]', gridColor:'#444343', axisColor:'#444343',titleColor:'#165A87'}],
                categoryAxis:{gridColor:'#444343', axisColor:'#444343', startEffect:'elastic'}
                    }">
            </ma-serial-chart>
          </div>
    
          <div ng-if="live ==1">
            <ma-point-values point-xid="{{plantNameAcronym.value}}_TRK-{{trackerRowColumn.value}}_FML01-power-smart" point="powerLive" values="powerLiveValues"
              from="theTimeNow | moment:'startOf':'day' | moment:'add':3:'hours'"
              to="theTimeNow" rollup="LAST" rollup-interval="1 minutes">
            </ma-point-values>
    
            <ma-serial-chart style="height: 250px; width: 98%" series-1-values="powerLiveValues" series-1-color="#F88F24" series-1-point="powerLive" series-1-type="line"
              legend="false" default-balloon-text="Power: [[value]] kW" balloon="true" export="true"  stack-type="regular"
              options="{export: {'dateFormat': 'DD/MM/YYYY H:mm ', 'fileName': 'Power'},
              titles:[{text:'Power chart',color:'#165A87'}],
              valueAxes:[{title:'[kW]', gridColor:'#444343', axisColor:'#444343',titleColor:'#165A87'}],
              categoryAxis:{gridColor:'#444343', axisColor:'#444343', startEffect:'elastic'}
              }">
            </ma-serial-chart>
          </div>
        </md-card-content>
      </md-card>
          </div>
    

    instead in another file customized for each inverter (6.4 in this case) I've something like this:

    <ma-get-point-value point-xid="TER_TRK-6.4_ConfigRPI-tracker-rowColumn" point="trackerRowColumn"></ma-get-point-value>
    <ma-get-point-value point-xid="TER_TRK-6.4_ConfigRPI-plantNameAcronym" point="plantNameAcronym"></ma-get-point-value>
    <div ng-include="'templates/home.html'"></div>
    

    My problem is that on first loading (live=1) the graph is not showed

    0_1580222892428_3cf14b86-3940-4d82-b7ae-d20b58a38adf-immagine.png

    but clicking on "Day" an then again on "Live" the graph is showed correctly

    0_1580222974610_5edd3313-d77c-44d3-b981-7cf2213b0c24-immagine.png

    is seems to be an initialization problem but I can't realize where's the problem, using directly point-xid="TER_TRK-6.4_FML01-power-smart" works without problems:

    <ma-point-values point-xid="TER_TRK-6.4_FML01-power-smart" point="powerLive" values="powerLiveValues"
              from="theTimeNow | moment:'startOf':'day' | moment:'add':3:'hours'"
              to="theTimeNow" rollup="LAST" rollup-interval="1 minutes">
            </ma-point-values>
    

    Any idea about how to solve the problem?
    Thanks,
    Antonio


  • It seems that the first time the page is executed the

    <ma-point-values point-xid="{{plantNameAcronym.value}}_TRK-{{trackerRowColumn.value}}_FML01-power-smart"

    becomes:

    <ma-point-values point-xid="TER_TRK-6.4_FML01-power-smart"

    but ma-point-values is evaluated just when I switch from a graph type to the other.

    I've tried to use ng-init in an outer div to evaluate the point xid before but the result is always a blank graph.


  • Try using an ng-if, that way it won't load until you have the values in the browser to insert into the chart.
    I do that due to the fact there is always some delay with HTTP requests if you're using everything from the dashboard side without any javascript code.

    Fox


  • It's not working for me, I'll solve this repeating the page for any "trackerRowColumn" in the plant instead of creating a template to use for all the plant, thanks anyway.
    Antonio