• 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

    Issues with Dashboard PointValue Colors

    Dashboard Designer & Custom AngularJS Pages
    4
    11
    1.4k
    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.
    • M
      mihairosu
      last edited by

      I have a lot of data points that come via PersistentTCP Sync to our enterprise install where the dashboards are hosted.

      I want all of the dashboards to have a black background.

      The ones that are giving me issues have templates with Text Render Properties.

      At first, all of the text was originally in black and when I added these points to the dashboard, I chose a text color of white.

      This worked well. What was originally a black color, was not transformed into white.

      I went back to edit these templates and the Text Render Properties to give some different colors to the text to differentiate between normal and alarm statuses.

      This is where the issue comes in.

      Previous text where color was transformed into white is now black and of course will not be visible. The other text render properties are all good.

      Ideally I'd like to keep the black text render because otherwise it will not be visible on the UI.

      Is there a way to transform only black to white in the elements?

      What are my options?

      text render issues.png

      MattFoxM 1 Reply Last reply Reply Quote 0
      • MattFoxM
        MattFox @mihairosu
        last edited by

        @mihairosu I'd need to see your markup, and likely the styling you have applied

        If you can see what it is using the developer's console and add the CSS styling you require, we can probably override whatever is causing the issue for you

        Fox

        Do not follow where the path may lead; go instead where there is no path.
        And leave a trail - Muriel Strode

        M 1 Reply Last reply Reply Quote 0
        • M
          mihairosu @MattFox
          last edited by

          @MattFox
          I just used the built- in GUI tools.

          Sorry this isn't formatted well. It's what the GUI editor spits out.

          link text

          The other thing that confuses me, is why some of the items are not getting the right formatting, even though they share the same exact template.

          See "Water Flow Sw", "Drain Blocking Sw" items.

          72a274d7-2702-4bf6-a201-3d7f264290b5-image.png

          I'll try re-creating the items in the GUI.

          P.S. I am not allowed to attach files :

          bb5bb2c9-cbfe-451c-acbe-057a11ba34fe-image.png

          T 1 Reply Last reply Reply Quote 0
          • T
            tungthanh500 @mihairosu
            last edited by

            @mihairosu You can try copy the Markup content here

            M 1 Reply Last reply Reply Quote 0
            • M
              mihairosu @tungthanh500
              last edited by

              @tungthanh500

              d726c25f-be41-420e-b019-57a6e42aec51-image.png

              M 1 Reply Last reply Reply Quote 0
              • M
                mihairosu @mihairosu
                last edited by

                @mihairosu

                I think part of my issue is that the dashboard elements formatting are fighting with what is provided by the point value(s), so I may have to stick with one or the other to do the formatting.

                However, I cannot see an easy way to format the element text, depending on its value using the dashboard designer, so if I want that I may have to stick with the point render method.

                Any recommendations?

                CraigWebC M 2 Replies Last reply Reply Quote 0
                • CraigWebC
                  CraigWeb @mihairosu
                  last edited by

                  @mihairosu

                  Here is an example of formatting the text based on the point value:

                  <ma-point-value enable-popup="left" point="p" style=" font-size: 19px; " ng-style="{'color': p.value >= 60 ? '#00ff00' : p.value >= 35 ? 'yellow' : 'red' }"></ma-point-value>
                  
                  M 1 Reply Last reply Reply Quote 0
                  • M
                    mihairosu @mihairosu
                    last edited by

                    @mihairosu
                    Another update.

                    I re-checked the templates for the Text Render Properties, and some didn't save properly for some reason, once I fixed them, the colors appeared correct on all of the elements.

                    1 Reply Last reply Reply Quote 0
                    • M
                      mihairosu @CraigWeb
                      last edited by

                      @CraigWeb

                      Thanks for the example. For now I'd prefer to stick to GUI as much as possible and therefore to the text render properties, but where it's absolutely required and there's no other way, I'll switch over to editing the HTML.

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

                        @mihairosu
                        So it looks like you cannot override the text renderer color on the point-value component I have tried a few times and cannot get it right. Here is a workaround you can do without editing HTML

                        Screen Shot 2023-02-22 at 9.54.42 AM.png

                        The <ma-get-point-value> brings in a point by XID and assigns it to a local scope variable:
                        Screen Shot 2023-02-22 at 9.54.53 AM.png
                        P is nowusable on other elements
                        So I add a text box and in the text content I interpolate the rendered value with double curly brackets and set a color:
                        Screen Shot 2023-02-22 at 9.55.04 AM.png

                        M 1 Reply Last reply Reply Quote 0
                        • M
                          mihairosu @CraigWeb
                          last edited by

                          @CraigWeb

                          That's pretty nice, I was actually wondering if it was possible to do something like that. I have some ideas on using a point value to do things to other elements, which would add a lot of value to the dashboards.

                          Thank you!

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