Use the mschart control in ASP. NET

Source: Internet
Author: User


Recently, the company asked for a report. displays the annual sales evaluation chart. this suddenly reminds me of Microsoft's mschart control, because I have studied it before. so it is not very laborious. to be accurate, I don't have a different idea once. I have a different feeling. I also hope that the things I have come up with will be good for everyone!

Well, I have never liked to talk nonsense. I suddenly said so much... paste the source code directly from the project! I hope you can give me more advice. Thank you!

 

ASP. NET front-end:

<Div class = "mychartcss"> <br/> <asp: chart id = "chart1" runat = "server" width = "1024px"> <br/> <Series> <br/> <asp: series name = "sales"> <br/> </ASP: Series> <br/> </series> <br/> <chartareas> <br/> <asp: chartarea name = "chartarea1"> <br/> </ASP: chartarea> <br/> </chartareas> <br/> <legends> <br/> <asp: legend alignment = "center" Docking = "bottom" name = "legend1" Title = "sales analysis"> <br/> </ASP: legend> <br/> </legends> <br/> <titles> <br/> <asp: title Font = ", 16pt "name =" title1 "text =" French Royal dragon boat overall sales evaluation form "> <br/> </ASP: title> <br/> </titles> <br/> </ASP: Chart> <br/> </

 

 

Main background source code:

 

 

/// <Summary> <br/> // bind the report control data source <br/> /// </Summary> <br/> Public void binddata () <br/>{< br/> ilist <nop_product> DATA = bindchartproduct (); <br/> # region not used yet <br/> // chartarea = setchartareastyle ("chart1", true); <br/> // list <int> DATA = models. staticmodel. createstaticdata (); <br/> // system. web. UI. datavisualization. charting. chart chart2 = new system. web. UI. datavisualization. charting. chart (); <br/> // chart2.width = 412; <br/> // chart2.height = 296; <br/> // chart2.rendertype = system. web. UI. datavisualization. charting. rendertype. imagetag; <br/> // chart2.palette = chartcolorpalette. brightpastel; <br/> // Title T = new title ("IMG source streamed from controller", docking. top, new system. drawing. font ("trebuchet ms", 14, system. drawing. fontstyle. bold), system. drawing. color. fromargb (26, 59,105); <br/> // chart2.titles. add (t); <br/> // chart2.chartareas. add ("Series 1"); <br/> // populate series with random data <br/> // random = new random (); <br/> // For (INT pointindex = 0; pointindex <10; pointindex ++) <br/> // {<br/> // chart1.series [0]. points. addy (random. next (45, 95); <br/> /// chart1.series ["series2"]. points. addy (random. next (5, 75); <br/> //} <br/> # endregion <br/> for (INT I = 0; I <data. count; I ++) <br/>{< br/> chart1.series [0]. points. addy (data [I]. quantity); <br/>}< br/> chart1.borderskin. skinstyle = borderskinstyle. emboss; <br/> chart1.borderlinewidth = 2; <br/> chart1.bordercolor = system. drawing. color. black; <br/> chart1.borderlinedashstyle = chartdashstyle. solid; <br/> chart1.borderwidth = 2; <br/> chart1.chartareas ["chartarea1"]. axisx. majorgrid. enabled = false; // The split line is not displayed. <br/> chart1.chartareas ["chartarea1"]. axisy. title = "sales quantity (bottle)"; <br/> chart1.chartareas ["chartarea1"]. axisx. title = "Time (yyyy-mm)"; <br/> # region not used yet <br/> // chart1.legends. add ("Wine type"); <br/> // legend = new legend (ddrtypename. selectedvalue); <br/> // 26, 59,105 <br/> // legend. backcolor = color. transparent; // color. fromargb (26, 59,105, 0); <br/> // legend. bordercolor = color. gray; <br/> // legend. font = new system. drawing. font ("trebuchet ms", float. parse ("8.25"), fontstyle. bold, graphicsunit. world); <br/> // legend. isdockedinsidechartarea = true; <br/> // legend. dockedtochartarea = ddrtypename. selectedvalue; <br/> // chart1.chartareas ["chartarea1"]. axisx. interval = 1; // X axis data display interval <br/> // chart1.chartareas ["chartarea1"]. axisx. intervaltype = datetimeintervaltype. days; <br/> // chart1.chartareas ["chartarea1"]. axisx. intervaloffset = 0.0; <br/> // chart1.chartareas ["chartarea1"]. axisx. intervaloffsettype = datetimeintervaltype. days; <br/> # endregion <br/> chart1.chartareas ["chartarea1"]. axisx. labelstyle. format = "YYYY mm Month"; <br/> chart1.chartareas ["chartarea1"]. axisy. interval = 20; // y axis data display interval <br/> chart1.datasource = data; <br/> chart1.series [0]. yvaluemembers = "quantity"; <br/> chart1.series [0]. xvaluemember = "createdon"; <br/> chart1.databind (); <br/> // set series chart type <br/> chart1.series [0]. charttype = seriescharttype. line; <br/> // chart1.series ["series2"]. charttype = seriescharttype. spline; <br/> // set point labels <br/> chart1.series [0]. isvalueshownaslabel = true; <br/> // chart1.series ["series2"]. isvalueshownaslabel = true; <br/> // Enable X axis margin <br/> chart1.chartareas ["chartarea1"]. axisx. ismarginvisible = true; <br/> // enable 3D, and show data point Marker lines <br/> chart1.chartareas ["chartarea1"]. area3dstyle. enable3d = false; <br/> chart1.series [0] ["showmarkerlines"] = "true "; <br/> // chart1.series ["series2"] ["showmarkerlines"] = "Tru

 

The chartarea area can also be dynamically generated. There are a lot of online materials. Here I only post my usage

 

/// <Summary> <br/> // define chartarea <br/> /// </Summary> <br/> /// <Param name = "name"> chartarea name </param> <br/> // <Param name = "area3dstyle"> enable 3D </param> <br/> // <returns> </returns> <br/> Public static chartarea setchartareastyle (string name, bool area3dstyle) <br/>{< br/> chartarea mychararea = new chartarea (name); <br/> mychararea. axisx. linecolor = system. drawing. color. fromargb (64, 64, 64, 64); <br/> mychararea. axisx. labelstyle. font = new system. drawing. font ("trebuchet ms", float. parse ("8.25"), fontstyle. regular); <br/> mychararea. axisx. majorgrid. linecolor = system. drawing. color. fromargb (64, 64, 64, 64); <br/> mychararea. axisy. linecolor = system. drawing. color. fromargb (64, 64, 64, 64); <br/> mychararea. axisy. labelstyle. font = new system. drawing. font ("trebuchet ms", float. parse ("8.25"), fontstyle. regular); <br/> mychararea. axisy. majorgrid. linecolor = system. drawing. color. fromargb (64, 64, 64); <br/> If (area3dstyle) <br/>{< br/> mychararea. area3dstyle. enable3d = true; <br/> mychararea. area3dstyle. isrightangleaxes = false; // whether to tilt <br/> mychararea. area3dstyle. isclustered = false; <br/> // chart1.chartareas ["chartarea1"]. area3dstyle. wallwidth = 0; // controls the 3D display of the wall width </P> <p> mychararea. area3dstyle. inclination = 15; // X skew <br/> mychararea. area3dstyle. rotation = 10; // y skew <br/> mychararea. area3dstyle. perspective = 10; <br/>}< br/> mychararea. backcolor = system. drawing. color. fromargb (64,165,191,228); <br/> // backsecondarycolor = "Transparent" bordercolor = "64, 64, 64" <br/> mychararea. backsecondarycolor = system. drawing. color. transparent; <br/> mychararea. bordercolor = system. drawing. color. fromargb (64, 64, 64, 64); <br/> mychararea. axisy. scalebreakstyle. enabled = true; // enable contrast disparity <br/> // mychararea. axisx. interval = 1; <br/> // mychararea. axisy. interval = 5000; // The minimum unit of the forced Y axis is 5000. <br/> // mychararea. axisx. majorgrid. interval = 1; <br/> // mychararea. area3dstyle. enable3d = true; <br/> // mychararea. alignmentorientation = areaalignmentorientations. horizontal; <br/> // mychararea. axisy. enabled = axisenabled. false; <br/> // mychararea. axisy2.enabled = axisenabled. true; <br/> // mychararea. axisx. labelstyle. isendlabelvisible = false; <br/> return mychararea; <br/>}

 

 

 

Here, I will only write my own research results. If anything is inappropriate, I hope you will give me more advice and make progress together. Thank you.

 

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.