Geeks With Blogs

News profile for Aligned at Stack Overflow, Q&A for professional and enthusiast programmers

Donate Bitcoins

Check out Elapser from T3rse!
"free in Christ Jesus from the law of sin and death." Romans 8:2 (ESV) Check out the Falling Plates video on YouTube.
more about the Gospel
And then listen to Francis Chan speaking at LifeLight in SD.

Programming and Learning from SD

Disclaimer: Infragistics contacted me and asked me to do a review of one of their products. They also paid me, thank you to them Smile.

I had trouble creating an account, so I fired up their chat support and they fixed it for me in a few minutes. That was a great start after the initial frustration with their registration system.

http://www.infragistics.com/products/jquery/

http://www.infragistics.com/products/jquery/whatsnew

MVVM Support with Knockout

http://www.infragistics.com/community/blogs/mihail_mateev/archive/2012/04/24/mvvm-support-with-knouckoutjs-in-netadvantage-for-jquery-2012-vol-1.aspx

http://www.infragistics.com/community/blogs/taz_abdeali/archive/2012/03/13/netadvantage-for-jquery-2012-volume-1-sneak-peek.aspx

“This release, we’ve build bindings around knockoutjs for the jQuery grid, both flat and hierarchical grid. Now, you can use MVVM pattern with the grid using knockout within your client applications.”

I’m definitely happy about Knockout support being added!

Touch Support

There are http://www.infragistics.com/products/jquery/sample/chart/financial-series. I ‘m going to fire this up on my tablet sometime soon and add some thoughts about how that works out.

Charts

Use canvas, not SVG (like Wijmo). Canvas has to re-draw the whole area for every change, where SVG has individual elements that could be selected. Both have their benefits, but I’m thinking canvas will do a better job for a real-time chart.

http://www.infragistics.com/products/jquery/sample/chart/live-data

http://www.infragistics.com/products/jquery/sample/chart/binding-real-time-data

I have a requirement to create a real-time line chart (like the CPU usage chart in the Windows Task Manager) that will be updated with SignalR from the server. I decided to try and take the sample from above and plop it into my MVC4, Knockout, and SignalR project. Here’s my running dialog:

  1. I got my subscription key (thank you Infragistics), logged in and registered my key. I downloaded the p and There was a zip file that had an exe for installation. This was pretty slick, though I would have settled for a NuGet package.
  2. Grab the js and css from C:\Program Files (x86)\Infragistics\NetAdvantage 2012.1\jQuery\
  3. ig.util.js and infragistics.ui.chart.js are needed? I didn’t want everything in the complete javascript file
  4. Following the sample I got the transparent theme .css (
    ig.ui.chart.igtheme.transparent.css). I didn’t find that in the installed files, 
    so I’ll take the metro theme instead (C:\Program Files (x86)\Infragistics\NetAdvantage 2012.1\jQuery\css\themes\metro)
  5. Change the sample to html from the cshtml example (that’s nice there are the multiple examples: html, cshtml, vbhtml, even aspx) 
  6. There are 214 lines of code to wade through, most of it is html.
  7. The Loader looks interesting, but I don’t have time to figure that out at the moment. I’ll just put the references in the html.
  8. The tooltip is created with a template, jQuery Templates??
     <script id="tooltipTemplate" type="text/x-jquery-tmpl">
            <div id="tooltip" class="ui-widget-content ui-corner-all">
                <span id="tooltipValue">$$(lbl_seriesValue): ${item.Value}</span>
            </div>
        </script>
    
  9. Now to move the code into a Knockout ViewModel and an external template file.

  10. I’m getting “Uncaught TypeError: Object [object Object] has no method 'igDataChart'”. When I moved the javascript includes from the external template to my Index.cshtml file this error went away and the javascript files were actually loaded.

  11. I’m still missing some references, adding in the full infragistics.js file makes it work. The example online uses the loader which pulls down more scripts, so that’s an option as well (use the loader or add in these files)

  12. infragistics_references

  13. It’s working when I call the DoGeneration() method they have.

Surprise! Mouse zooming and selection of areas works without any additional work!

Hooking it up to SignalR (see http://www.amazedsaint.com/2011/11/introduction-ksigdo-knockout-signalr-to.html for a good walkthrough of using SignalR with Knokout) was simple as I had the infrastructure already in place.

I have a working real-time chart! It took me about 6 hours in total with distractions in the middle. It is very smooth, even when I’m adding data points at a sub-second rate. I wish I could buy just this control Smile for my current project.

Resizing

You have to manually set the new size and redraw it when the window resizes. This is consistent with what I’ve seen from other controls and Canvas.

Skinning

http://help.infragistics.com/NetAdvantage/jQuery/2012.1/CLR4.0?page=igDataChart_Styling_Themes.html

Theming: “The component suite ties in seamlessly with the jQuery core model and conventions including all styling support via jQuery UI Theme Roller.”

Gauges

Unfortunately for the current project I’m working on, the jQuery suite doesn’t have any gauges, which is something my current project requires. Maybe someday? The ASP.Net product has it, but that’s a separate license to purchase.

Other controls

The showcases show off many of their other controls, including mobile.

The grid also looks very useful and I’d like to look into it more closely some day.

Licensing

http://www.infragistics.com/help/FAQs/

Unser What types of Licensing models does Infragistics offer?

“Infragistics products can be purchased as individual licenses on a per developer basis or multi-user licenses, where a single key is provided for multiple users”

http://store.infragistics.com/Default.aspx?Category=NetAdvantage+for+jQuery

On September 12, 2012 the pricing is:

NetAdvantage for jQuery 2012 Vol. 1 w\Priority Support is $1,095

NetAdvantage for jQuery 2012 Vol. 1 $595

NetAdvantage for jQuery 2012 Vol. 1 w\Community Support #395

Other

Documentation: http://help.infragistics.com/NetAdvantage/jQuery/2012.1/CLR4.0

Suggestion: I wish they would put their samples in jsFiddle.net “fiddles”. I saw another control site that did that and it made it easier to play around with, without having to copy and past code and add all the javascript references.

 

My Take

I’m impressed with the Infragistics suite of tools. I’ve done Silverlight and as more people are asking for HTML5 solutions that will run just as well on an iPad as a desktop computer, it’s important to have good HTML tool sets. I like that it’s based on JQuery, which is very common, and that the controls are implementing Knockout js binding. They also seem to have put a lot of effort in the usability of the controls and everything seems very polished. I’d definitely put this library near the top of my list when working on my next HTML project.

Posted on Wednesday, September 12, 2012 2:25 PM Infragistics | Back to top


Comments on this post: Infragistics NetAdvantage for JQuery Review

No comments posted yet.
Your comment:
 (will show your gravatar)
 


Copyright © Aligned | Powered by: GeeksWithBlogs.net | Join free