• 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

    Mango Beta 12 MA directive not working on mobile at all

    Dashboard Designer & Custom AngularJS Pages
    1
    1
    385
    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.
    • cwangvC
      cwangv
      last edited by

      @CraigWeb @Jared-Wiltshire
      Hi, Guys
      I have tested this sample code provided within Mango on mobile browser, I have the similar problem of the page not showing correctly, all animation/graph are blank:
      I am guessing there could be more directives that may have the same issues. I tested
      the bar charts and they work ok.
      I am a bit concerned about such random undesirable effects. I understand it is still in Beta and I don't know how much code has been changed or re-written. But this is a bit unsettling.

      <h3>Select numeric point and max value:</h3>
      <div layout="row">
          <ma-filtering-point-list flex="75" ng-model="myPoint" data-type="NUMERIC" auto-init="true"></ma-filtering-point-list>
          <md-input-container flex="25">
              <label>Maximum value</label>
              <input type="number" ng-model="max" ng-init="max=1000">
          </md-input-container>
      </div>
      <br>
      
      <ma-get-point-value point="myPoint"></ma-get-point-value>
      
      <h3>Angular Material progress linear bar</h3>
      <md-progress-linear md-mode="determinate" ng-value="myPoint.convertedValue / max * 100" style="height:10px;"></md-progress-linear>
      <br>
      
      <h3>Custom horizontal bar</h3>
      <div class="bar-display" ng-class="{'ma-point-disabled': !myPoint.enabled}">
          <div class="bar-display-fill" ng-style="{width: myPoint.convertedValue / max * 100 + '%'}" style></div>
          <div class="bar-display-text">{{myPoint.renderedValue}}</div>
      </div>
      <br>
      
      <h3>Custom vertical bar</h3>
      <div class="bar-display bar-display-vertical" ng-class="{'ma-point-disabled': !myPoint.enabled}">
          <div class="bar-display-fill" ng-style="{height: myPoint.convertedValue / max * 100 + '%'}" style></div>
          <div class="bar-display-text">{{myPoint.renderedValue}}</div>
      </div>
      

      ceaf688b-078d-4a2d-a917-9426addff12a-image.png

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