ASP. net mvc 3 BETA: Built-in support for charts (the best way to use charts in mvc3 razor)

Source: Internet
Author: User

After a long selection, I finally found the simplest solution of the Code: the chart that comes with Ms. MS charts have existed for a long time, but in previous usage, IMG needs to be saved, which will lead to MVC access conflicts (which had plagued one of our projects), roughly:

 

The following available:. net3.5 + MVC + MS chart

The following are unavailable:. Net4.0+ MVC + MS chart (MAGIC is that the MS chart comes from. net4.0, it seems that I forgot to test MVC before release)

 

Finally, I found a post about a variant of this usage.. Net4.0 + mvc3 + MS chartThe test is valid in the environment.

Original post in http://weblogs.asp.net/gunnarpeipman/archive/2010/10/10/asp-net-mvc-3-beta-built-in-support-for-charts.aspx

However, the original post is in English. Below is a rough Chinese process. I will take the example further and pass in a title to change the report. Of course, in actual use, it is not just the title, but the reports/anualsales? Year = 2011.

 

Step 1: Write the chart position in the view

<P> </P>

Step 2: implement action in the Controller. Here, homecontroller/Chart (String title) is implemented)

 

Using system. Web. helpers; // chart/charttheme is defined here.

Public actionresult chart (String title)
{
VaR model = new chartmodel ();
VaR DATA = model. getchartdata ();
New chart (400,200, charttheme. Blue)
. Addtitle (title)
. Databindtable (data, "x ")
. Write ("PNG ");
Return NULL;
}
The magic is that you do not need to write a view for this action and return null. I don't know why, but it's enough to use it :)

Step 3: implement the unique suspense chartmodel class and its method getchartdata:

 

Using system. collections; // ilist/arraylist defined here

Public class chartmodel
{
Public ilist getchartdata ()
{
Return new arraylist
{
New {x = datetime. Now. addmonths (-2), Y = 200 },
New {x = datetime. Now. addmonths (-1), Y = 300 },
New {x = datetime. Now, y = 500}
};
}
}

Of course, the chartmodel here is a test class. If you return to the sales scenario just now, this class does not need to exist and Step 2 is changed:

 

Using MyApp. Models; // sales is defined here, which is originally in your own code.

 

Public actionresult anualsales (INT year)
{
New chart (400,200, charttheme. Blue)

. Addtitle (title)
. Databindtable (sales. Data (), "x ")
. Write ("PNG ");
Return NULL;
}

Public ilist data () must be implemented in sales (normally this is an existing interface ).

The entire process is one step less than putting an elephant in the refrigerator.

 

However, this helper has many restrictions. For example, there are only addtitle/addserise/addlegend functions, so you cannot add marker/adjust the color width of each line/not ...... In short, compared with non-MVC charts (System. Web. UI. datavisualization. charting. Chart), But it is easy to use. We expect several new functions to be added in mvc4.

 

For how to use MS chart, see: http://weblogs.asp.net/scottgu/archive/2008/11/24/new-asp-net-charting-control-lt-asp-chart-runat-quot-server-quot-gt.aspx

Charttheme is actually the aspx Code mentioned in this link (the Code itself can be seen in the charttheme definition). As long as it is reloaded, it can be its own theme, implement some simple functions (such as moving legend locations ).

 

. Net 3.5 routines: http://archive.msdn.microsoft.com/mschart/Release/ProjectReleases.aspx? Releaseid = 1591

. Net 4.0 routines: http://archive.msdn.microsoft.com/mschart/Release/ProjectReleases.aspx? Releaseid = 4418

 

Click to download the free agile development textbook: Martian agile development manual

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.