• 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

    Render dynamic graphics in customview

    How-To
    3
    9
    5.5k
    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.
    • F
      ftomiBR
      last edited by

      I've been looking at the customViewExample.jsp page and could not figure out how to render a dynamic graphic there, like dial and bar in the views.

      I believe I will use view:scriptPoint tag but no ideia how.

      thanks,

      1 Reply Last reply Reply Quote 0
      • F
        ftomiBR
        last edited by

        I'm trying to create a dashboard, just need to render the same gauges like in the graphical views, is it possible?

        1 Reply Last reply Reply Quote 0
        • M
          mlohbihler
          last edited by

          Hi Tommy,

          The custom views don't support dynamic graphics yet.

          Best regards,
          Matthew

          1 Reply Last reply Reply Quote 0
          • F
            ftomiBR
            last edited by

            Hi Matthew,

            Thanks for reply.

            I think it should be not too hard to achieve that, look at what I have done in a custom view based on Mango views and using the same wz_jsgraphics script:

            
            <div id="needle"><img src="/graphics/dialCst/dialCst.png"> </div>
            
            <view:scriptPoint xid="numeric" raw="true">	
                var g = new jsGraphics("needle");
                
                g.clear();
                
                var xCenter = 127;
                var yCenter = 128;
                
                var xa = new Array(-3, -1,  1,3,1,-1);
                var ya = new Array( 0,-82,-82,0,3, 3);
                var angle = (value * 2 - 1) * 2.1;
                
                mango.view.graphic.transform(xa, ya, 1, 1, xCenter, yCenter, angle);
                
                g.setColor("#A00000");
                g.fillPolygon(xa, ya);
                
                g.setColor("#202020");
                g.drawPolygon(xa, ya);
                g.drawLine(xCenter, yCenter, xCenter, yCenter);
                g.paint();
            </view:scriptPoint>	
            

            It corretly renders the graphic (at least on FF), but the generated image is never cleaned (even calling g.clear() function) , so it renders the new position without erasing the last one.

            Do I need some server side coding in this case?

            1 Reply Last reply Reply Quote 0
            • M
              mlohbihler
              last edited by

              Try this instead:

              
              &lt;div id="needle"&gt;<img > &lt;/div&gt;
              &lt;script type="text/javascript"&gt;
                var g = new jsGraphics("needle");
              &lt;/script&gt;
              
              &lt;view:scriptPoint xid="numeric" raw="true"&gt;	
                   g.clear();
              ...
              
              

              I'm not sure why your code quote works in graphical views. I recall some kind of issue, but not the details. It's been a while.

              BTW, for M2M2 these kinds of graphics will more likely be done with processing.js. Walter Zorn, bless his soul, seems to have gone missing from the web, so we're not sure if there will be any more work on his stuff.

              Best regards,
              Matthew

              1 Reply Last reply Reply Quote 0
              • F
                ftomiBR
                last edited by

                Thank you, it works now, but only in FF.

                What is M2M2? Is it another solution or kind of Mango 2.0?

                1 Reply Last reply Reply Quote 0
                • M
                  mlohbihler
                  last edited by

                  Mango M2M2. The next generation of Mango M2M.

                  Best regards,
                  Matthew

                  1 Reply Last reply Reply Quote 0
                  • A
                    apl
                    last edited by

                    Maybe this helps:

                    http://wztip.info/index.php/Main_Page

                    Arne

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