[Records of various problems encountered during the project] charts-tips on mschart

After completing the editor, record the problems encountered during the use of the charts and the solutions for the individual.

The following is what we will introduce:

1. mschart overview.

2. Problems Encountered during development and solutions.

 

1. Overview of mschart

When developing some management systems, you will always encounter some requirements that require graphical presentation of reports-charts, before Microsoft's mschart comes out.In. Net winforms, many chart controls do not charge fees, they do not have to use a small number of chart types, or have too little data (or I know too little)However, since Microsoft launched mschart on vs2008, it is much easier to perform graph statistics on winforms.

Mschart is divided into two parts: winforms and webform. corresponding examples are provided.Program(Over 200 examplesCode, Including C # and VB. net version, which has a variety of built-in chart types, basically covering all types of charts required by various industries), allows developers to quickly find their desired chart types, you can view the sample code to get started with development immediately, for example:

Of course, this article does not introduce how mschart is used. The above is just an introduction to the simplicity of mschart. The main content of this article is that I encountered problems during the development process.

 

Ii. Problems Encountered during development and Solutions

Now I will introduce some of my problems:

1. How can we solve the problem of different columns in each generated category when the number of statistical categories is unmeasurable?

In a winforms program developed at the beginning of the year, you need to collect statistics on the user-defined category data, and the number of categories created by the user is variable (but cannot exceed 10 ),In this case, a problem occurs: If the columns in the mschart want to be nice, a lot of configuration is required to attract the eye, such as the column color, Border width, and shadow, the classification created by each user corresponds to a column. The original idea is to dynamically generate the corresponding column according to the quantity. However, in the actual development process, if you want to ensure that the style of each column is uniform and the color is differentiated, it is too complicated to use code to dynamically generate.

I came up with a solution, that is, because the number of user-defined categories cannot exceed 10, so I have created 10 columns in the icon in advance, data is filled with the created columns based on the number of types created by the user, and those columns that do not have data to be filled will not appear. Although this solution is silly, however, the actual results are quite good. After all, it takes time to debug the dynamic creation of columns to ensure unified styles. It is not as intuitive as creating columns directly through configuration. For details, see:

 

2. Click classification display similar to cnzz traffic statistics

If you have used cnzz statistics, you must know that cnzz displays the visitor's source statistics in a pie chart. In addition, you can highlight this area in a region, for example:

As you can see, I click [Jiangsu Province] to highlight this area. Although this feature is inconspicuous, it is used by the actual company, for example, a specific piece of content will be used during a meeting. How can mschart be used in winforms?

To achieve this through mschart, You need to implement the customproperties of the specific value (datapoint) in the data column. The Code is as follows (VB. NET ):

 private void chartperformance_mousedown (Object sender, system. windows. forms. mouseeventargs e) {hittestresult result = chartperformance. hittest (E. x, E. y); If (result. pointindex =-1) {return;} bool exploded = (chartperformance. series (0 ). points (result. pointindex ). customproperties = "exploded = true "? True: false); datapoint point = default (datapoint); foreach (point in chartperformance. series (0 ). points) {point. customproperties = "" ;}if (exploded) {return ;}// click the specific column if (result. chartelementtype = chartelementtype. datapoint) {datapoint dpoint = chartperformance. series (0 ). points (result. pointindex); dpoint. customproperties = "exploded = true"; if (list 
  
   ) dpoint. tag ). count = 0) {return ;}// click the legend if (result. chartelementtype = chartelementtype. legenditem) {datapoint dpoint = chartperformance. series (0 ). points (result. pointindex); dpoint. customproperties = "exploded = true"; if (list 
   
    ) dpoint. tag ). count = 0) {return ;}}
   
  

The main steps of this Code are as follows:

1. Add a mousedown event to the chart control.

2. Obtain the coordinates of the currently clicked widget and determine whether the widget exists.

3. Determine whether the clicked object is a specific column or legend, and add the corresponding attribute for the clicked Legend: customproperties = "exploded = true ";

The specific effect is as follows:

You can see that the [excellent] column in the chart has been separated and highlighted.

At this point, we can also add some effects similar to Mouseover and mouseleave in Web Development for this table to achieve a better user experience, such:

You can see that there is a grid-like network cable on the [medium] column and the figure above. This will tell the user to select the column first. The implementation code is as follows:

Private void chartperformance_mousemove (system. object sender, system. windows. forms. mouseeventargs e) {hittestresult result = chartperformance. hittest (E. x, E. y); If (result = NULL) {return;} datapoint point = default (datapoint); foreach (point in chartperformance. series (0 ). points) {point. backsecondarycolor = color. black; point. backhatchstyle = charthatchstyle. none; point. borderwidth = 1;} If (result. chartelementtype = chartelementtype. datapoint | result. chartelementtype = chartelementtype. legenditem) {This. cursor = cursors. hand; datapoint dpoint = chartperformance. series (0 ). points (result. pointindex); dpoint. backsecondarycolor = color. white; dpoint. backhatchstyle = charthatchstyle. percent25; dpoint. borderwidth = 2;} else {This. cursor = cursors. default ;}}
 

The implementation steps of this Code are as follows:

1. Obtain the coordinates of the current click.

2. traverse all the vertices and legends to add a background style and a mouse gesture.

 

The above is all the content in this article. Thank you for your advice! :)

 

In other words, if you think this article is useful or valuable, move the cursor over [recommendation] and click it for me. Thank you very much!

 

Records of various problems encountered during the project process

Editor:

FCKeditor related knowledge and various common usage Problems

FCKeditor custom upload path Configuration

Use FCKeditor to generate static paging html

Chart:

Tips on mschart

Good chart selection on ASP.net-funsioncharts

Orm:

Some minor issues with using nhib.pdf to configure object entities

About Nhibernate query Encapsulation

Deployment:

Problems related to project deployment-IIS

The tangled problems during project deployment-sqlserver

Tools:

. Net tool library frequently used for development