jqChart for ASP.NET MVC

===========================
Installlation
===========================

Download and unzip the contents of the archive to any convenient location. The package contains the following folders:

- [bin] - Contains the assembly DLLs of the product (JQChart.Web.Mvc.dll) for ASP.NET MVC2, MVC3 and MVC4. This is the assembly that you can reference directly in your MVC project.

- [js] - The javascript files of jqChart and jqRangeSlider (and the needed libraries). You need to include them in your ASPX or Razor page, in order to gain the client side functionality of the chart. 
The first file is "jquery-1.5.1.min.js" - this is the official jQuery library. jqChart is built upon jQuery library version 1.4.3.
The second file you need is the "excanvas.js" javascript file. It is used from the versions of IE, which dosn't support canvas graphics.
The third is the jqChart javascript code itself, located in "jquery.jqChart.min.js".
The last one is the jqRangeSlider javascript, located in "jquery.jqRangeSlider.min.js". It is used when the chart zooming is enabled.

- [css] - Contains the Css files that the jqChart and the jqRangeSlider need. 

- [samples] - Contains some examples that use the jqChart. For full list of samples plese visit - http://www.jqchart.com/samplesaspnetmvc

- [themes] - Contains the themes shipped with the products. It is used from the jqRangeSlider.

Since jqRangeSlider supports jQuery UI Themeroller, any theme compatible with jQuery UI ThemeRoller will work for jqRangeSlider as well. 
You can download any additional themes directly from jQuery UI's ThemeRoller site available here: 

http://jqueryui.com/themeroller/

or reference them from Microsoft's / Google's CDN.

<link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.21/themes/smoothness/jquery-ui.css" />


The final result you will have in an ASPX page containing jqChart would be something similar to that (assuming you have copied the [js] to the Script folder and [css] to Content folder of your ASP.NET MVC site respectively).

<%@ Page  Language="C#"  Inherits="System.Web.Mvc.ViewPage<IEnumerable<SamplesBrowser.Models.ChartData>>" %>
<%@ Import Namespace="JQChart.Web.Mvc" %>

<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="~/Content/jquery.jqChart.css" />
    <link rel="stylesheet" type="text/css" href="~/Content/jquery.jqRangeSlider.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.21/themes/smoothness/jquery-ui.css" />
    <script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.jqChart.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.jqRangeSlider.min.js") %>" type="text/javascript"></script> 
    <!--[if IE]><script lang="javascript" type="text/javascript" src="<%: Url.Content("~/Scripts/excanvas.js") %>"></script><![endif]-->
</head>
<body>
    <div>
        <%= Html.JQChart()
                .Chart(Model)
                .ID("jqChart")
                .Width(500)
                .Height(300)
                .Title("Chart Title")
                .Legend(legend => legend.Title("Legend"))
				.Axes(axis =>
                    {
                        axis.CategoryAxis(Location.Bottom).ZoomEnabled(true);
                    }
                )
                .Series(series =>
                    {
                        series.Column().Title("Column")
                                       .XValues(el => el.Label)
                                       .YValues(el => el.Value1);
                            
                        series.Spline().Title("Spline")
                                       .XValues(el => el.Label)
                                       .YValues(el => el.Value2);
                    }
                )
                .Render()%>
    </div>
</body>
</html>

Here is the same sample if you are using the Razor sintax:

@model IEnumerable<SamplesBrowser.Models.ChartData>
@using JQChart.Web.Mvc

<!DOCTYPE html>
<html>
<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="~/Content/jquery.jqChart.css" />
    <link rel="stylesheet" type="text/css" href="~/Content/jquery.jqRangeSlider.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.21/themes/smoothness/jquery-ui.css" />
    <script src="<%: Url.Content("~/Scripts/jquery-1.5.1.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.jqChart.min.js") %>" type="text/javascript"></script>
    <script src="<%: Url.Content("~/Scripts/jquery.jqRangeSlider.min.js") %>" type="text/javascript"></script> 
    <!--[if IE]><script lang="javascript" type="text/javascript" src="<%: Url.Content("~/Scripts/excanvas.js") %>"></script><![endif]-->
</head>
<body>
    <div>
          @(Html.JQChart()
                .Chart(Model)
                .ID("jqChart")
                .Width(500)
                .Height(300)
                .Title("Chart Title")
                .Legend(legend => legend.Title("Legend"))
				.Axes(axis =>
                    {
                        axis.CategoryAxis(Location.Bottom).ZoomEnabled(true);
                    }
                )
                .Series(series =>
                    {
                        series.Column().Title("Column")
                                       .XValues(el => el.Label)
                                       .YValues(el => el.Value1);
                            
                        series.Spline().Title("Spline")
                                       .XValues(el => el.Label)
                                       .YValues(el => el.Value2);
                    }
                )
                .Render() 
          )
    </div>
</body>
</html>


============================
Licensing
============================
This is our evaluation free unlimited in time trial license. We are very helpful to ALL customers, including trial customers and will gladly assist you 
with any problems you might have (send questions to support@jqchart.com). Trial product will show a tiny message pointing to our site every once in a while. 
To remove that, just purchase the single developer versions and we will send you a download link to unrestricted versions. 
You can purchase developer versions here (http://www.jqchart.com/Pricing.aspx)

It's as simple as that, no cryptic settings in configs, no registry settings - complete license freedom (so you can use it on test/deployment servers, have QA look it at without licenses issues, etc)

==

Hope this helps. If you have any questions, just mail them to support@jqchart.com

Regards,
Dragan Matek /jqChart Inc/
