• Recent
    • Tags
    • Popular
    • Register
    • Login

    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 Mango 5 Documentation Website

    ma-serial-chart can not set multiple axis and max-min

    Dashboard Designer & Custom AngularJS Pages
    4
    6
    2.0k
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • B
      benaznbe
      last edited by benaznbe

      Hi Support.
      Can I help me please.I can not set the Y axis to the left without the 1 value 1 axis.
      and I want to set the maximum and minimum values for each axes.

      <md-input-container style="position: absolute; left: 0px; top: 0px; width: 150px;">
              <label>Maximum value</label>
              <input type="number" ng-model="max">
      </md-input-container>
          
      <md-input-container style="position: absolute; left: 155px; top: 0px; width: 150px;">
              <label>Minimum value</label>
              <input type="number" ng-model="min">
      </md-input-container>
      
      <div layout="row">
              <div ng-init="myPreset='DAY_SO_FAR'"></div>
              <div ng-init="myInterval='1 minutes'"></div>
                  <ma-date-range-picker from="from" to="to" style="display: none" update-interval="{{myInterval}}" preset="{{myPreset}}"></ma-date-range-picker>
                  <md-input-container flex="" style="position: absolute; left: 320px; top: 0px; width: 240px; height: 100px;">
                      <label>From date</label>
                      <font size="3"><ma-date-picker ng-model="from" mode="both" format="DD-MM-YYYY"></ma-date-picker></font>
                  </md-input-container>
                  <md-input-container flex="" style="position: absolute; left: 565px; top: 0px; width: 240px; height: 100px;">
                      <label>To date</label>
                      <font size="3"><ma-date-picker ng-model="to" mode="both" format="DD-MM-YYYY"></ma-date-picker></font>
                  </md-input-container>
      </div>
              
      <div layout="row" ng-init="points=[]"><font size="3">
                  <md-input-container style="position: absolute; left: 810px; top: 0px; width: 240px; height: 100px;">
                      <label>Search by Name</label>
                      <ma-data-source-list ng-model="myDataSource"></ma-data-source-list>
                  </md-input-container></font>
                  
                  <md-input-container style="position: absolute; left: 1060px; top: 0px; width: 240px; height: 100px;">
                      <label>Add a point</label>
                      <ma-point-list limit="2000" ng-model="point" init-point="false" ng-change="point &amp;&amp;points.push(point); point=null" query="{deviceName:nameFilter}"></ma-point-list> 
                  </md-input-container>
      </div>
              
              <md-whiteframe id="inv11" style="position: absolute; left: 320px; top: 70px; border-width: thin; border-style: solid; width: 980px; height: 0px; border-color: rgb(181, 181, 181); background-color: rgb(255, 255, 255);">
                  
                  <md-chips ng-model="points" name="name" readonly="true" md-max-chips="10">
                      <md-chip-template ng-click="points.splice($$replacedScope.$index,1)">
                          <strong>{{$chip.name}}</strong>
                          <em>({{$chip.deviceName}})</em>
                          <md-icon>close</md-icon>
                      </md-chip-template>
                  </md-chips>
                  
      <div style="position: absolute; left: 0px; top: 50px; height: 0px; width: 100%;">
                      <font size="3">
                      <ma-point-query query="{$and: true, deviceName:points,  name:checkboxModel.value4}" limit="0" points="points"></ma-point-query>
                      <ma-point-values points="points" values="combined" from="from" to="to"></ma-point-values>
                      <ma-serial-chart style="height: 280px; width: 100%" stack-type="regular" values="combined" series-1-axis="left" series-1-axis="left-2" points="points" legend="true" options="{synchronizeGrid: false, valueAxes:[{ minimum:min, maximum:max}]}"></ma-serial-chart></font>
      </div>
      

      Thank you for support.

      0_1522977216625_Untitled.png

      B 1 Reply Last reply Reply Quote 0
      • B
        benaznbe @benaznbe
        last edited by

        This post is deleted!
        1 Reply Last reply Reply Quote 0
        • Jared WiltshireJ
          Jared Wiltshire
          last edited by

          @benaznbe said in ma-serial-chart can not set multiple axis and max-min:

          Can I help me please.I can not set the Y axis to the left without the 1 value 1 axis.

          You're going to have to try and re-phrase that, I don't understand what you are asking.

          @benaznbe said in ma-serial-chart can not set multiple axis and max-min:

          I want to set the maximum and minimum values for each axes.

          You can set options for each axis via the options attribute as you already had in your code. Each item in the valueAxes array corresponds to the y-axes 'left', 'right', 'left-2', 'right-2' respectively. e.g. you can do something like this.

          options="{valueAxes:[{minimum:0, maximum:100}, {minimum:0, maximum:100}, {minimum:-50, maximum:150}, {minimum:0, maximum:200}]}"

          See here for all of the documentation for the value axes - https://docs.amcharts.com/3/javascriptcharts/ValueAxis

          Developer at Radix IoT

          1 Reply Last reply Reply Quote 0
          • CraigWebC
            CraigWeb
            last edited by

            @Jared-Wiltshire
            Hi Jared
            I just cant get my left axis to be 0-100.Really not sure what i'm doing wrong. BTW it would be really great if we could we could set the axis of the watch list charts. I get asked on a weekly bases from clients how to do it.
            Would of preferred to use the watch list chart but instead used <ma-serial-chart> so that I can set the axis, but still not winning. Any help will be appreciated!

             <div flex="66"  flex-xs="100" ng-if="designer.points | filter:{deviceName:'Reservoir'}:false | maFirst">
                                <ma-calc input="designer.points | filter:{deviceName:'Reservoir'}:false | maFirst" output="res1" on-change="myVar = $value">
                                </ma-calc>
                                <ma-point-values point="res1" values="res1Values" from="dateBar.from" to="dateBar.to" rollup="{{dateBar.rollupType}}" rollup-interval="{{dateBar.rollupIntervals}} {{dateBar.rollupIntervalPeriod}}">
                                </ma-point-values>
                                <ma-calc input="designer.points | filter:{deviceName:'Reservoir 2'}:false | maFirst" output="res2" on-change="myVar = $value">
                                </ma-calc>
                                <ma-point-values point="res2" values="res2Values" from="dateBar.from" to="dateBar.to" rollup="{{dateBar.rollupType}}" rollup-interval="{{dateBar.rollupIntervals}} {{dateBar.rollupIntervalPeriod}}">
                                </ma-point-values>
                                 <ma-calc input="designer.points | filter:{deviceName:'Reservoir 3'}:false | maFirst" output="res3" on-change="myVar = $value">
                                </ma-calc>
                                <ma-point-values point="res3" values="res3Values" from="dateBar.from" to="dateBar.to" rollup="{{dateBar.rollupType}}" rollup-interval="{{dateBar.rollupIntervals}} {{dateBar.rollupIntervalPeriod}}">
                                </ma-point-values>
                                <ma-serial-chart flex style="height: 300px; width: 100%" series-1-point="res1" series-1-values="res1Values"  series-1-color="rgb(45,197,255)"  series-1-type="line" series-1-axis="left" series-2-point="res2" series-2-values="res2Values"  series-2-color="blue"  series-2-type="line" series-2-axis="left" series-3-point="res3" series-3-values="res3Values"  series-3-color="green"  series-3-type="line" series-3-axis="left" legend=" true" balloon="true" options="{valueAxes:[{minimum:0, maximum:100}]}" default-balloon-text="[[title]]: [[value]]" export="true" stack-type="none">
            			        </ma-serial-chart>
                         </div>
            
            
            1 Reply Last reply Reply Quote 0
            • phildunlapP
              phildunlap
              last edited by

              Hi CraigWeb,

              I suspect the answer is in this thread: https://forum.infiniteautomation.com/topic/2863/set-chart-minimum-and-maximum-axes-values-ignored/3

              TLDR: Try turning off synchronizeGrid in the options, like,

              options="{synchronizeGrid: false, valueAxes:[{ minimum:0, maximum:100,title:'Your axis title here'}]}"
              
              1 Reply Last reply Reply Quote 0
              • CraigWebC
                CraigWeb
                last edited by

                Spot on thank you!

                1 Reply Last reply Reply Quote 0
                • First post
                  Last post