Research and Development of distribution network WebGIS [4]

 

Distribution NetworkWebGISResearch and developmentIssue [4]

Author: 1.1 drops of beer http://beer.cnblogs.com/

3.2Display of WebGIS power failure Area 

A power outage area refers to a power outage in a certain area of the power supply company in a certain day. All table boxes in the area are affected. This is a regional issue. Therefore, by marking these areas on a map, you can visually display the data in front of the analysts and intuitively see the affected area of the power outage on the day, this greatly facilitates the subsequent work.

Requirement: the staff enter the power outage plan into the SQL database and instruct the power outage plan for the current day. Some stations may have a series of subordinate table boxes, each of which corresponds to a geographical coordinate, the table box scatter plots form an area. The "Blackout area display" is to highlight these affected areas on the map for the staff to view, at the same time, it also provides the basic query function for the power outage area, so that the staff can learn more detailed data about the power outage area.

The application system developed based on web adf has three structures: client, web, and GIS server, therefore, drawing a graph in a web ADF map can be implemented at any of the three layers. The development environment for each layer is different, so the methods for converting and rendering graphic elements on the map are different. Because the purpose of Web ADF is to be in the same applicationProgramMultiple data sources are used, so it provides more ways to create and manage images on the web side.

It is very important for developers to understand where they usually need to create a graph and how the Web ADF integrates a graph at each level. Specifies where to create a graphic layer at each level. WAF manages a series of data sources, such as web ADF graphics, ArcGIS Server, and ArcIMS. Web ADF graphic resources use the Web ADF function to create graphic layers and generate map images. ArcGIS Server and ArcIMS resources use their respective service functions on the GIS server to create graphic layers and combine them with other layer data in the map to generate a map image. If you set the imageblendingmode attribute of the map control to browser, which is usually the default value, All map images are superimposed in the browser based on the resource order. In addition, the client browser can use the browser function to create images.

Figure3.16How to Create a graph at different layers

Client: 

For Web applications, the client is always a browser. Generally, Browser display and interaction are always associated with some web standards, such as HTML, CSS, and JavaScript. In its development environment, available tools are limited by the support of browsers. CSS allows you to place page elements, ratios, and other page elements. The support for vector graphics by browsers is also quite different, but SVG (Scalable Vector Graphics, Scalable Vector Graphics) and VML (Vector Markup Language, Vector Markup Language) draw vector graphics on top of other elements on the web page.

WebTerminal:

ArcGIS provides a resource-rich and comprehensive development environment on the Web end and can directly access the data source on the server side. ASP. NET web applications directly inherit the Microsoft. NET Framework framework and all its advantages .. The net environment provides some methods for drawing maps, but the implementation method is cumbersome. However, the. NET Framework provides a series of web ADF objects to expand their functions through simple APIs to create layers on the map.

Server:

Generally, processing images on the server means that you need to use the server to create a map image. This image may then be used by the web ADF. The ability to create images on the server depends on the ability of the data source service on the server. Both ArcIMS and ArcGIS Server can create general map images. However, since different interfaces can be provided to create images, they will also use different api interfaces. Images added to the server will become part of the map image and be returned to the client. Since another data source may overwrite the images generated by the server, you must consider the rules of the map data source to determine whether the images are visible.

Each of the three methods has its own characteristics. Because the power outage area to be drawn in this graduation project is a dynamic area, it is best to use a Virtual Layer. Therefore, the possibility of server creation is ruled out first. In addition to dynamically drawing a region, you also need to provide regional point query and other functions. Therefore, you can select to operate the image on the web side.

WAF provides a unique graphical data source. The graphic data source can be added to the mapresourcemanager control in the form of a layer (Graphics layer), and then associated with the map control and displayed. A layer data source is a system. Data. dataset type that can contain many Ables. You can use the graphics attribute of the graphics layer data source to access the graphicsdataset

The Web ADF defines two layers: elementgraphicslayer and featuregraphicslayer. Both are system. Data. able structure types, so they can be added to the graphicsdataset table set. The layer content is stored in memory by web applications. Therefore, the total amount of content in the layer must be compatible with the memory occupied by web applications. Note that the layer type must be created and managed by a program.

Elementgraphicslayers: contains only basic graphic elements, geometric information, and style sheets. A ry layer can store different geometric elements. In general, the ry layer can be used to display elements selected on a map. Note: The ry layer cannot contain any attribute information during design.

Featuregraphicslayers: A Virtual Layer designed to fully simulate a real element layer. Each layer supports only one type of ry. The web ADF Renderer can read the Attribute Table of this layer and apply a special identifier to this layer. The element graphics layer also supports query.

After creating a power outage area, you also need to render different colors for different areas according to the power outage period, this requires the Virtual Layer to have some attribute information for the coloring tool to read and perform special coloring. Therefore, featuregraphicslayers was selected as the vehicle for drawing the power outage area. The Web ADF provides a series of geometric types, which can be used to process layers by the identifier symbol and some Renderer. In addition, the web ADF symbol system supports different transparency display, this prevents the highlighted area of the power outage area from completely overwriting the following layers.

When you prepare a basic template (including basic controls such as navigation toolbar and map display box), you can display the map on the page and provide basic functions, add a virtual layer to the mapresourcemanager control, as shown on the left:

Figure3.17Add Virtual Layer

The type of the Virtual Layer is graphicslayer. The data storage type is "in memory", which is different from the type and storage of the local map data source, as shown on the right.

The following figure shows how to plot the power failure area:

Figure3.18Drawing Process of the power outage Area

One of the most important steps in the above process is to query the SQL database to obtain the affected area of the power outage. This involves calculating the outsourcing area based on the scatter group.Algorithm:

By querying the database, we can obtain the table box data of a certain power-off area. Each table box has a coordinate attribute, to draw a power-off area, you need to calculate the "coverage area" of the scatter group corresponding to these coordinates on the map. Select the maximum and minimum latitudes from the latitude values of the table box, and then classify the latitudes (the more grades, the smoother the region boundary is, but the calculation is more complex, so how to group depends on the needs), after classification, the table box coordinates are distributed in some horizontal latitude band areas. Then, select the maximum and minimum values of the longitude values for the table box coordinate set in each band area, so that a "covered area" of the table box in the band area is found, and so on, in the end, find the overall "coverage area" of all the table boxes, that is, the power outage area.

In addition to the above algorithm, you should also note that in mapresourcemanager, mapresourceitem sets the image format to png24 for displaysetting. Otherwise, even if the Virtual Layer is transparent to each other, it will completely block the object map layer, in addition to the above problems, there are some SQL query single technical issues, so I will not detail them. The query and query results for the power-off areas are displayed in a similar way as in the previous section "power parameter query. Run the following command:

Figure3.19"Draw a power outage area" for running

3.3WebGIS device statistics 

Requirements on the device statistics page: select a search condition, or enter a filter field, and then submit a search condition set to the server, the server queries the device results required by symbols from the SQL database and sends them to the client. The client browser displays these results and displays the statistical results in a statistical chart.

The "device statistics page" mainly involves database programming. In addition to the database query technology, the most important technology to complete the functions of this page is Ajax technology. The basic Ajax technology is briefly introduced in chapter 3. The Ajax framework used in this module is mainly "ASP.. Net client callback framework. data encoding and decoding mainly adopts the josn method.

ASP. net client callback (Asp. net client callback. in the. NET environment, developers can use the icallbackeventhandler interface to Implement Asynchronous Communication between client pages and servers. Note: In some cases, "ASP. NET client callback" is also called "ASP. NET script callback (ASP. NET script callbacks )"

During asynchronous communication through XMLHttpRequest, you must declare an asynchronous communication request object through JavaScript on the client. This object is related to the browser kernel. For example, activexobject ("msxml2.xmlhttp") in IE "). For Asynchronous Communication through icallbackeventhandlerCodeTo enable the icallbackeventhandler interface on the page, you only need to add the icallbackeventhandler class to the page inheritance class.

After the icallbackeventhandler class is added to the inheritance class of the page, there are two functions on the page that can be directly used: Public void raisecallbackevent (string eventargument) and Public String getcallbackresult ().

Raisecallbackevent is a function used by the server to receive data from the client. Its eventargument parameter is a data interface used to receive data sent from the client to the server during request (as I have learned so far, this data format seems to be limited to strings ). Getcallbackresult returns the data, which is directly returned to the client. These two functions are the data communication interfaces of the server.

Clientscript = page. clientscript. getcallbackeventreference (this, "Arg", "ajaxcallbackcomplete", null) on the server side. The statement is defined to generate client scripts. You can see from msdn that the second parameter "Arg" refers to the javascript string variable to be sent by the client. This variable is undertaken by the eventargument of raisecallbackevent (string eventargument) on the server, the third parameter is the javascrpipt function that the client receives and processes data from the server after the server completes the callback.

The callback process is as follows:

1. the user clicks the Page Link to trigger the JS function docallback.

2. docallback prepare the data to be stored in the ARG variable and call the client script generated by the server <% = clientscript %>

3. The server raisecallbackevent receives the data, calls the relevant server functions for processing, and assigns a value to a global string variable.

4. The getcallbackresult function returns the string data prepared by the server to the client.

5. The client receives the string data returned from the server by the JS function set by getcallbackeventreference (), and then processes the data and operates the page elements to display the data.

The above is the complete process of ASP. NET client callback. Developers only need to let the page inherit an icallbackeventhandler class, and then find the data interface and function interface to Implement Asynchronous Communication easily. The process of this method is clear, and many issues that developers do not care about, such as communication process and waiting for communication, are encapsulated, this asynchronous communication method is used on the device statistics page designed for this graduation project. The third chapter introduces three data encoding and decoding methods. on this page, data communication is lightweight, therefore, JSON encoding and decoding are adopted (of course, XML technology can also be used ).

Problems that need to be solved through Ajax technology:

3.3.1 Multi-level drop-down box without refreshing

When making the page, ASP is used. NET Server Control dropdownlist, can achieve multi-level drop-down box linkage effect, but each time the first level drop-down box content changes, in order to update the second level drop-down box content, the page will be refreshed once, this results in poor page experience. As described in Chapter 3, Ajax is generated to enhance the interactive experience of client pages. A typical application of AJAX is "multi-level drop-down box without any new links ".

Although it is mentioned above that asp should be avoided on the page to achieve better client experience. NET Server Control, but should try to use HTML control, but considering the server control after rendering to reach the client page, it actually corresponds to a certain HTML control, such as: Asp. net dropdownlist corresponds to the select control of HTML, and the initial status page of the server control (the page is generated on the client for the first time) is easier to set on the server. Therefore, the dropdownlist control is still used for the control of the drop-down box option used to select statistical conditions on the page, but the initialization operation is only performed on the server when the page is initialized for the first time, during the later running of the page, only Javascript is used on the client side to perform operations on the page, such as reading numeric values and setting data. The server is only responsible for receiving, calculating, and sending data. The specific process is as follows (the Ajax-related part is omitted ):

Figure3.20"Client drop-down box refreshing" Process

3.3.2 The Grid Control on the client displays the query results.

After the user clicks the "query" button on the page, the client uses js to encode the client form data into a JSON string, then submits it to the server, and the server decodes the data to obtain the search conditions, then, retrieve the device record table that meets the requirements from the SQL database, and then return it to the client. The process is exactly the same as that of the "drop-down box" without refreshing the new link, but the data size of the Code is a little large. However, in the end, how to display the table data on the client is a difficult issue. I first tried to use the Server Control gridview, but later I found that there were too many disadvantages to use the Server Control (maybe I didn't do any further research ), for example, the problem of page refresh and cell deformation. Finally, I found a javascript framework on the Internet-activewidget provides a grid control written in JavaScript on the client side, developers only need to pass a JavaScript array to the data interface of this JS table. Such a client Grid Control supports the scroll bar. When the cell data length is long, part of the data is automatically hidden, and the cell width can be dragged to change ......

This page also uses the JS control-tab control provided by the activewidget framework to implement the tab effect similar to the desktop application on the page, and it is easy to use.

3.3.3 Generate statistical charts

When solving the problem of how to generate a statistical chart, I have tried a variety of methods, such as programming using the Excel chart plug-in, or drawing using GDI, and then referencing it on the page, however, the results are not satisfactory and the programming process is cumbersome. Then I came to the Internet to find a professional statistical chart generation control: dotnetcharting. After the dotnetcharting control is referenced in the program, you only need to pass a two-column datatable as the data source to the chart in dotnetcharting. This will automatically generate a visual Statistical Chart, as shown in.

Figure3.21Statistical Chart Effect

The third chapter describes how to asynchronously refresh image resources on the client. Each time you click the "generate Statistical Chart" button, the client will generate a new statistical chart without looking at the second tab page of the client.

Page running:

Figure3.22Query result data table

Figure3.23Query Result Statistics

------------------------------------------------------------------

Author: 1.1 drops of beer

Email/Gtalk: dreamzsm@gmail.com

From: http://www.cnblogs.com/beer

Notes:You are welcome to paste it, but please add a link on the page to indicate the source