When analyzing a large amount of data, the most commonly used performance method is also more straightforward. In general, we use Excel to make various types of trend charts, but they are all based on static data, that is, data is in advance instead of dynamic generation. If you are published online, you can only post the drawing chart in a static GIF image, which cannot fundamentally meet the needs of different users on different data.
ASP is good at server-side Web programming, and the background database is its strength. But use ASP to make a real-time database chart is a bit difficult because the ASP itself does not support chart feature, which can only be developed with third-party controls, such as VB's MSChart control. Microsoft launched .NET Framework better solved this problem. Microsoft integrates real-time database chart production components - WEC (Microsoft Office Web Components) on the .NET platform. By calling OWC in the ASP.NET page, we can easily draw various types of real-time charts. OWC supports nearly 50 kinds of chart types, including graphs, line charts, histograms, area diagrams, K-line maps, etc. Compared with Mschart, the OWC is powerful and easy to operate. In addition, since the OWC is based on the server, Mschart can only be applied to the client, so Mschart is inferior to OWC in Web development.
The following author will specifically explain the application in the ASP.NET page, this example is a subsystem in the project "Chemical Fiber Products and Raw Material Market Analysis System" developed by the author, and the author uses OWC in the project. Fully enjoy the convenience of the power of OWC to development work.
Three-tier structure
The overall system of the system uses the B / S three-layer structural mode, divided into user interface layers (also known as a performance layer), and the business logic layer (also known as functional layer) and database service layer (also known as data layers). The development platform uses .NET Framework, effectively reduces the requirements of the system to clients, avoiding difficulties in distributing applications and version control on clients.
● User interface layer: User interface is ASP.NET technology. The application of ASP.NET technology enhances the versatility of the system, and the client needs to install any of the browsers such as IE or Netscape, without having to load any components.
● Business Logic Layer: The technology of the .NET Framework calls OWC can quickly obtain the data dynamically generated chart in the database according to the user's requirements. The system can support complex retrieval conditions, the retrieval speed is fast, and the response time is short.
● Database service layer: Database service layer can use any relational database. In this project, the author uses SQL Server, which can be seamless with .NET Framework. ADO.NET is used in data inventory.
Here we will focus on the implementation of business logic layers.
Introduction to chart elements
A complete chart consists of several elements, we must understand them, in order to make a full-time control of the chart, and can better understand this procedure. The author makes a simple chart, labeled the program's name and the name of the main parts and elements involved in the figure, thereby helping the reader to master the OWC and understand the code referenced herein.
Use OWC components
The source code involved in this section is taken from the "Chemical Fiber Products and Raw Material Market Analysis System", which is passed in the Window 2000 / XP Simplified Chinese Professional Edition, .NET Framewrok 1 .0 environment. The steps to use the OWC component are as follows:
1. Newly built a subdirectory Chart of the chart file in the current directory, simultaneously assign the "modification" permission to the directory to the ASP.NET account. The specific steps are as follows: Right-click the Chart directory name, select the "Properties" menu item, click the "Security" tab in the "Chart" property dialog box, then click the Add button, find ASP.NET Account, give "Modify" permissions, click the "OK" button to end. This way, ASP.NET can be written to the chart file in the chart directory. 2. Define a server-side image image control that attribute ImageURL is directed to dynamically generated chart file at the end of the program, so there is no need to assign it for it.
3. Add an OWC reference.
Before using OWC, you must first add an OWC's reference to the Solution Explorer. The specific steps are as follows: Open the Solution Explorer panel, right-click "Reference", select Add Reference menu, click "COM" card in the "Add Reference" dialog box, find "Microsoft Office Web Components 9.0 ", click" Select "and" OK "buttons, OWC is added to the reference.
4. Define the OWC space and add an OWC chart OWCCHART in this space.
DIM OWCCHARTSPACE As Owc.ChartSpace = new OWC.CHARTSPACE ()
Dim Owcchart As Owc.wcchart = OWCCHARTSPACE.CHARTS.ADD
5. Use the SQL search criteria to retrieve the database, and assign the search results in the RECORDSET data set to OWCCHART.
OWC only supports the Recordset dataset, does not support the DataSet dataset, so you cannot use SQLCommand, SqlDataAdapter, etc. when retrieved, you can only use the RecordSet object to retrieve.
'Open Connection connection
Connado.open (Connectionstring)
RecordSetado.activeConnection = Connado
'Set the cursor as a static cursor
Recordsetado.cursortype = adodb.cursortypeenum.adopenStatic
Recordsetado.cursorLocation = adodb.cursorlocationenum.aduseclient
The standard SQL retrieval condition is stored in the 'variable strsql.
Recordsetado.open (strsql)
Then assign the Recordset data to the OWC object:
OWCCHARTSPACE.DataSource = RecordSeto
In this example, we assume that the data retrieved with the SQL statement has three fields: product, date and price. The values of these three fields correspond to the curves in the chart, and the data classified (X) axis and the value (Y) axis corresponds.
6. Determine the curve type and determine the field name that distinguishes different curves.
First determine the type of curve is a smooth curve.
OWCCHART.TYPE = OWC.CHARTCHARTTYPEENUM.CHCHARTTYPESMOOTHLINE
OWC supports two or more curves in the same chart. Therefore, we must give the basis for different curves, which is the value of the "product" field. Specifically, there are several different values in the Product field, and several different curves will be generated. Owcchart.SetData (Owc.Chartdimensionsenum.chdimseriesnames, 0, "Product")
7. Determine the field corresponding to the Classification (X) axis tag and the value (Y) axis tag.
First, you need to define the set of OWCSeries to the OWC, and then traverse each curve in the chart, assign the value of the Date field to the Classification (X) axis as the X-axis scale tag, assign the value of the "Price" field to the value ( Y) axis as a Y-axis scale label. If we can determine that there is only one curve in the chart, it can also save the process of traverse, but this will undoubtedly reduce the versatility of the program.
DIM OWCSERIES AS OWC.WCSERIES
For Each Owcseries In Owcchart.seriesCollection
Owcseries.SetData (Owc.Chartdimensionsenum.chdimcategories, 0, "Date")
Owcseries.SetData (Owc.Chartdimensionsenum.chdimvalues, 0, "Price")
NEXT
8. Set the properties of the coordinate axis.
This part of the code has beautified graphic by setting the text content, color, size, main and secondary scale and its label, mainly and secondary network lines. If the reader is a bit blurred in this paragraph code, you can refer to the chart provided by the previous part. Please refer to the following code.
'Definition AXIS as the coordinate clip collection
Dim Axis as owc.wcaxis
'Traversing the coordinate axis set
For Each Axis in Owcchart.axes
'Display axial title
Axis.hastitle = TRUE
'Set the classification (X) axis first
If Axis.Type = Owc.ChartaxiStypeenum.
Chcategoryaxis kil
Axis.hastickLabels = TRUE
'Display x-axis scale label
Axis.Position = Owc.ChartaxisPositionenum.chaxisPositionBottom
'Tag display location
Axis.title.font.color = "blue"
'X axis title text color
Axis.title.font.size = "9"
'X axis title text
Axis.title.caption = "Date Range"
'X axis title text
Else
'Setting the value (Y) axis
Axis.majorgridlines.Line.Color = "Silver"
'Y axis main network line color
Axis.majortickmarks = Owc.charttickmarkenum.chtickmarknone
'Does not show the main scale mark of Y-axis
Axis.hastickLabels = TRUE
'Show Y-axis scale label
Axis.title.font.color = "blue"
The title text color of 'y axis
Axis.title.font.size = "9"
The title text size of 'Y axis
Axis.title.caption = "Price (thousands / ton)"
The title text content of 'Y axis
END IF
NEXT
9. Output chart in GIF image format and assign the image file name to the Image control.
'Generate random file name with random numbers
Randomize ()
DIM NFILENAMESUFFIX AS INTEGER
Dim sfilenamesuffix as string
NFileNameSuffix = 100000 * rND ()
sfilenamesuffix = system.convert.tostring (nfilenamesuffix)
'Output chart in GIF format, size is 500 * 300, and the file name of the chart is: polyesterprice_ random number .GIF, store in the Chart subdirectory
OWCCHARTSPACE.EXPORTPICTURE (MAPPATH ("Chart / PolyesterPrice_") SFileNameSuffix ".gif", "GIF", 500, 300)
'Point the URL of the image control to this chart file
Imgchart.ImageURL = "Chart / PolyesterPrice_" SFileNameSuffix ".gif"
Through the above nine steps, we have completed the generation and display of a real-time database chart. It should be pointed out here that the above nine steps only generate a basic process of a chart, and can better control the generation and display mode of the chart by setting OWC's other attributes, more accurately controlling the generation and display mode, such as the legend, lines Coarse and color, coordinate axis scale and label display frequency, network line, etc. This part of the author is no longer introduced, please refer to the source code of the fourth part of this article.
The chart effects generated by this document are shown below.
optimization
All real-time chart files in the above are stored in the Chart folder, which is not covered with each other because the random file name is used. But so much month, more and more documents not only occupy hard drive, but also hinder management and reduce performance. Can we automatically delete the previous chart file in the program? The answer is yes. As long as we place the following segment in the Page_Load () function of the code file, the program is automatically deleted when the program is running. In this way, the chart file stored in the Chart folder is always generated on the day, thereby effectively avoiding file garbage.
'Get a list of files in Chart folders first
Dim filentries () as string = system.io.directory.GetFiles (Mappath ("chart"))
DIM SFILE AS STRING
'Traversal file list
For Each Sfile in FileEntries
'Compared to the system date, if it is the file generated before the day, delete it
If DateTime.Compare (System.IO.File.GetcreationTime (sfile) .adddays (1), DateTime.now <0 THEN
System.IO.File.delete (sfile)
END IF
NEXT
