Method and system for making drainage basin 10-day precipitation forecast map

Abstract

The invention discloses a method and system for making a drainage basin 10-day precipitation forecast map, and relates to the technical field of precipitation forecast, and the method comprises the steps: obtaining a geographic contour map of a drainage basin, and generating a drainage basin contour map with a transparent background; generating a drainage basin base map in an SVG format; constructing a webpage framework by using an HTML5 (Hypertext Markup Language 5) technology, and displaying a precipitation forecast map in the future 1-10 days in the webpage framework; analyzing a URL rule of the precipitation forecast map, and generating a precipitation forecast map link of a corresponding time period; verifying the validity of the graph link in an automatic mode; and according to the verification result, updating the precipitation forecast map of the corresponding time period in the webpage, and displaying the latest precipitation data in real time. According to the method for making the drainage basin 10-day precipitation forecast map, the precipitation forecast map link is automatically generated, URL rule analysis and link validity verification are utilized, the real-time performance of forecast map data is ensured, and hysteresis caused by manual updating in a traditional method is avoided.

Description

Technical Field

[0001] The present invention relates to the technical field of precipitation prediction, and in particular to a method and system for producing a 10-day precipitation forecast map of a river basin. Background Art

[0002] As climate change becomes increasingly significant, accurate precipitation forecasts are crucial for watershed management and disaster prevention and mitigation. Existing precipitation forecast maps are usually generated and displayed manually or semi-automatically, relying on forecast models and real-time meteorological data. However, the existing technology has the following problems:

[0003] Traditional precipitation forecast maps need to be manually acquired and updated, and there are problems with data updates not being timely and the latest forecast results not being displayed in real time.

[0004] Current methods are mostly limited to the display of single forecast data and lack effective integration with geographical information such as river basins, making it difficult to intuitively display changes in precipitation in different time periods.

[0005] Although some systems have begun to introduce technology for automatically generating forecast maps, there is a lack of comprehensive verification of the validity of the forecast map links, resulting in problems such as link errors and image loading failures during the generation process.

[0006] Therefore, there is an urgent need for a technical solution that can automatically generate and update precipitation forecast maps and display precipitation data in real time in combination with basin geographic information. Summary of the invention

[0007] In view of the above-mentioned problems, the present invention is proposed.

[0008] Therefore, the technical problem solved by the present invention is that the prior art lacks an efficient forecast map generation and update mechanism, and cannot obtain the precipitation data for the next 10 days in real time and display it dynamically. In addition, the traditional forecast map production method usually cannot effectively combine the geographical information of the basin with the precipitation forecast data, resulting in the inability to intuitively present the precipitation distribution and basin characteristics.

[0009] In order to solve the above technical problems, the present invention provides the following technical solutions: a method for making a 10-day precipitation forecast map of a river basin, comprising:

[0010] Obtaining a geographic contour map of the watershed, and processing the geographic contour map to generate a watershed contour map with a transparent background;

[0011] Overlay the basin outline map with transparent background and basin identification information to generate a basin base map in SVG format;

[0012] Using HTML5 technology to construct a web page framework, and displaying a precipitation forecast map for the next 1-10 days in the web page framework;

[0013] Analyze the URL pattern of the precipitation forecast map, and generate a precipitation forecast map link for the corresponding time period based on the pattern;

[0014] Verifying the validity of the precipitation forecast map link in an automated manner, and displaying the forecast map corresponding to the valid link on the web page;

[0015] The precipitation forecast map for the corresponding period on the web page is updated according to the verification results, and the latest precipitation data is displayed in real time.

[0016] As a preferred solution of the method for making a 10-day precipitation forecast map of a watershed according to the present invention, wherein: generating a watershed contour map with a transparent background comprises obtaining original watershed map data from a watershed management platform;

[0017] Processing the watershed map includes removing geographic information irrelevant to the watershed, retaining the outline of the watershed area, and generating a watershed outline map with a transparent background;

[0018] The generation of the watershed contour map is achieved through AI mapping software, which identifies the watershed boundaries and saves them in PNG format with a transparent background.

[0019] As a preferred solution of the method for making a 10-day precipitation forecast map of a watershed according to the present invention, wherein: superimposing the watershed outline map with a transparent background and the watershed identification information includes adding identification information to the watershed outline map, and the identification information includes the watershed name, the watershed number and its related geographical coordinates;

[0020] The identification information is embedded into the watershed outline map through a graphic design tool. The identification information is embedded into the watershed outline map in the form of a vector graph, and finally a watershed base map in SVG format is generated. The base map supports transparency effects and is displayed in superposition with other layers.

[0021] As a preferred solution of the method for making a 10-day precipitation forecast map of a watershed according to the present invention, the webpage framework is constructed by using HTML5 The tag sets the web page layout framework and defines the display area of ​​each layer;

[0022] use <svg>The tag is embedded in the watershed base map in the SVG format, and the display levels of different layers are set by using CSS technology, so that the watershed base map and the precipitation forecast map are superimposed and displayed;

[0023] The location of the precipitation forecast map for the next 1-10 days is set in the web page frame, and when the web page is loaded, the forecast map data is dynamically loaded using JavaScript.

[0024] As a preferred solution of the method for making a 10-day precipitation forecast map for a watershed according to the present invention, wherein: the analysis of the URL rule of the precipitation forecast map includes analyzing the format of the precipitation forecast map URL and extracting variables such as the date, timestamp and forecast time therein;

[0025] Use programming language to generate corresponding precipitation forecast map link based on date and forecast time information;

[0026] By combining string concatenation with regular expressions, links to precipitation forecast maps are automatically generated.

[0027] As a preferred solution of the method for making a 10-day precipitation forecast map for a watershed according to the present invention, wherein: the verification of the validity of the precipitation forecast map link includes using a fetch API to initiate a HEAD request to verify the validity of the precipitation forecast map link;

[0028] By judging whether the HTTP response status is 200, confirming whether the precipitation forecast map link is valid;

[0029] If the link is valid, the corresponding forecast image is loaded into the web page. If it is invalid, the link is regenerated and verification is continued to ensure that the displayed image is the latest and valid data.

[0030] As a preferred solution of the method for making a 10-day precipitation forecast map of a watershed according to the present invention, wherein: the real-time display of the latest precipitation data includes updating the precipitation forecast map of the corresponding period in real time in a web page through JavaScript;

[0031] By updating The src attribute of the tag dynamically displays the latest precipitation forecast map;

[0032] During the update process, the browser cache mechanism is used to avoid repeated loading.

[0033] Another object of the present invention is to provide a system for producing a 10-day precipitation forecast map for a river basin, which can solve the problem of ensuring security and confidentiality of data transmission in existing distribution network operations by constructing a remote secure communication system for distribution network operations, and the problem that using a third-party platform is not conducive to data confidentiality.

[0034] In order to solve the above technical problems, the present invention provides the following technical solutions: a system for making a 10-day precipitation forecast map of a watershed, comprising: a contour generation module for obtaining a geographical contour map of a watershed, and processing the geographical contour map to generate a watershed contour map with a transparent background;

[0035] The base map generation module is used to superimpose the basin contour map with transparent background and the basin identification information to generate the basin base map in SVG format;

[0036] The rainfall forecast module is used to construct a web page framework using HTML5 technology, and display a precipitation forecast map for the next 1-10 days in the web page framework;

[0037] The link generation module is used to analyze the URL pattern of the precipitation forecast map, and generate a link of the precipitation forecast map for the corresponding time period according to the pattern;

[0038] The validity verification module is used to verify the validity of the precipitation forecast map link in an automated manner, and display the forecast map corresponding to the valid link on the web page;

[0039] The precipitation update module is used to update the precipitation forecast map for the corresponding period in the web page according to the verification results, and display the latest precipitation data in real time.

[0040] A computer device includes a memory and a processor, wherein the memory stores a computer program, and when the processor executes the computer program, the steps of the method for making a 10-day precipitation forecast map for a watershed are implemented as described above.

[0041] A computer-readable storage medium stores a computer program, which, when executed by a processor, implements the steps of the method for making a 10-day precipitation forecast map for a watershed as described above.

[0042] Beneficial effects of the present invention: The method for making a 10-day precipitation forecast map for a watershed provided by the present invention automatically generates a link to the precipitation forecast map, and uses URL rule analysis and link validity verification to ensure the real-time nature of the forecast map data, thereby avoiding the lag caused by manual updates in traditional methods. By superimposing the watershed geographic information with the precipitation forecast map, not only is the visualization effect of the precipitation information improved, but also users can more intuitively view the precipitation conditions in various time periods and regions. In addition, a dynamic web page framework is constructed using HTML5, CSS, and JavaScript technologies, which can automatically load and update the forecast map in real time, greatly improving the interactivity and user experience of the web page. BRIEF DESCRIPTION OF THE DRAWINGS

[0043] In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the accompanying drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the accompanying drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other accompanying drawings can be obtained based on these accompanying drawings without paying creative work.

[0044] Figure 1 An overall flow chart of a method for producing a 10-day precipitation forecast map for a river basin provided by an embodiment of the present invention.

[0045] Figure 2 The overall structure diagram of a system for making a 10-day precipitation forecast map for a watershed provided in the second embodiment of the present invention. DETAILED DESCRIPTION

[0046] In order to make the above-mentioned purposes, features and advantages of the present invention more obvious and easy to understand, the specific implementation methods of the present invention are described in detail below in conjunction with the drawings of the specification. Obviously, the described embodiments are part of the embodiments of the present invention, but not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary persons in the art without creative work should fall within the scope of protection of the present invention.

[0047] In the following description, many specific details are set forth to facilitate a full understanding of the present invention, but the present invention may also be implemented in other ways different from those described herein, and those skilled in the art may make similar generalizations without violating the connotation of the present invention. Therefore, the present invention is not limited to the specific embodiments disclosed below.

[0048] Example 1

[0049] Reference Figure 1 , as an embodiment of the present invention, provides a method for making a 10-day precipitation forecast map of a river basin, comprising:

[0050] Step S1: obtaining a geographic contour map of a watershed, and processing the geographic contour map to generate a watershed contour map with a transparent background;

[0051] Generating the watershed contour map with transparent background comprises obtaining original watershed map data from the watershed management platform;

[0052] Processing the watershed map includes removing geographic information irrelevant to the watershed, retaining the outline of the watershed area, and generating a watershed outline map with a transparent background;

[0053] The generation of the watershed contour map is achieved through AI mapping software, which identifies the watershed boundaries and saves them in PNG format with a transparent background.

[0054] It should be noted that the process of "generating a watershed contour map with a transparent background" is achieved by obtaining the original watershed map data from the watershed management platform.

[0055] Specifically, map information related to the target watershed is obtained from the watershed management platform through the API interface, including the geographical boundaries and surrounding environment of the watershed. Then, the original map data is processed, mainly including removing geographical information irrelevant to the watershed and retaining the outline of the watershed area to ensure that the generated watershed outline map can accurately reflect the geographical characteristics of the watershed.

[0056] Furthermore, this processing step uses AI mapping software. AI mapping software can automatically identify the boundaries of the watershed through image recognition technology and remove unnecessary background information. The generated watershed contour map uses PNG format and sets a transparent background so that it can be easily superimposed with other layers in subsequent steps. The key technology of this step is image recognition and layer processing to ensure that the transparent background of the watershed contour map is consistent with the watershed management platform data.

[0057] Furthermore, the transparent background effect of the watershed contour map is achieved through image processing algorithms. By using image processing libraries such as OpenCV or PIL, unnecessary background color and texture information in the map is removed to ensure that the generated watershed contour map can be seamlessly combined with other background layers without affecting the visual effect of the final image.

[0058] Step S2: superimposing the watershed contour map with a transparent background and the watershed identification information to generate a watershed base map in SVG format;

[0059] The superimposing of the watershed outline map with a transparent background and the watershed identification information includes adding identification information on the watershed outline map, wherein the identification information includes the watershed name, the watershed number and its related geographic coordinates;

[0060] The identification information is embedded into the watershed outline map through a graphic design tool. The identification information is embedded into the watershed outline map in the form of a vector graph, and finally a watershed base map in SVG format is generated. The base map supports transparency effects and is displayed in superposition with other layers.

[0061] It should be noted that the "superimposition of the basin outline map with transparent background and basin identification information" involves two technical features: first, adding basin identification information, and second, using graphic design tools. The basin identification information includes data such as basin name, basin number and related geographic coordinates, which need to be embedded on the basin outline map with transparent background.

[0062] Furthermore, the addition of the identification information is achieved through graphic design software or vector graphics design tools. The identification information is embedded into the watershed contour map as a vector graphics to ensure that the information is not distorted when it is scaled or processed. This process uses the SVG format to save the identification information so that it can accurately adapt to different display requirements when displayed on the web page.

[0063] Furthermore, the implementation of this process relies on the flexibility of vector graphics. By using SVG tags, the basin name, number and other information are embedded in the basin outline map, so that these identification information can be flexibly adjusted in size, position and color according to the needs of the page. In addition, the transparent background of the basin base map supports the seamless superposition of the basin identification information with other layers, avoiding the interference of the background color that affects the readability of the identification information.

[0064] Step S3: constructing a web page framework using HTML5 technology, and displaying a precipitation forecast map for the next 1-10 days in the web page framework;

[0065] The web page framework is constructed by using HTML5 The tag sets the web page layout framework and defines the display area of ​​each layer;

[0066] use <svg>The tag is embedded in the watershed base map in the SVG format, and the display levels of different layers are set by using CSS technology, so that the watershed base map and the precipitation forecast map are superimposed and displayed;

[0067] The location of the precipitation forecast map for the next 1-10 days is set in the web page frame, and when the web page is loaded, the forecast map data is dynamically loaded using JavaScript.

[0068] It should be noted that the step of "building a web page framework" specifically refers to implementing the basic layout and structure definition of a web page through HTML5 technology. Tags are used to set the display areas of different layers, and the display level of each layer is set through CSS technology to ensure the correct display of each part of the web page.

[0069] Furthermore, when building a web page framework, The tags not only define different areas in the web page layout, but also assign specific IDs or class names to each area so that it can be dynamically controlled later through JavaScript. In addition, the position property of CSS is used to adjust the overlay order of the layers to ensure that the basin base map and the precipitation forecast map can be displayed correctly and updated alternately.

[0070] Furthermore, in the web page framework, the dynamic loading mechanism of JavaScript is used, combined with AJAX technology to realize asynchronous loading of forecast maps. By triggering the JavaScript script when the web page is loaded, the precipitation forecast map is dynamically loaded according to different time periods and needs, and the layer content is updated in real time to ensure that the forecast map displayed on the web page is always the latest data.

[0071] Step S4: analyzing the URL pattern of the precipitation forecast map, and generating a precipitation forecast map link for a corresponding time period according to the pattern;

[0072] The analyzing the URL rule of the precipitation forecast map includes analyzing the format of the precipitation forecast map URL and extracting variables such as date, timestamp and forecast time therein;

[0073] Use programming language to generate corresponding precipitation forecast map link based on date and forecast time information;

[0074] By combining string concatenation with regular expressions, links to precipitation forecast maps are automatically generated.

[0075] It should be noted that the aforementioned "analysis of the URL rules of precipitation forecast maps" involves formatting analysis of the forecast map URL. By parsing the composition of the forecast map URL, variables such as date, timestamp and forecast time are extracted, thereby generating a URL link corresponding to the target time period.

[0076] Furthermore, in the specific implementation, the string of the precipitation forecast map URL is decomposed to identify the changing parts of the URL (such as date, timestamp, etc.), and these variables are dynamically replaced with programming languages ​​(such as JavaScript) to generate a precipitation forecast map link for a specific time period. This process uses string concatenation and regular expression technology to efficiently and accurately generate URLs that conform to the rules.

[0077] Furthermore, in the programming implementation, regular expressions are used to extract dynamically changing parts from the forecast map URL, and regular expressions are used to match variables such as date and timestamp in the URL to ensure that the generated URL is in the correct format and can correspond to the precipitation data for the predetermined time period.

[0078] Step S5: verifying the validity of the precipitation forecast map link in an automated manner, and displaying the forecast map corresponding to the valid link on the web page;

[0079] The verifying the validity of the precipitation forecast map link includes using a fetch API to initiate a HEAD request to verify the validity of the precipitation forecast map link;

[0080] By judging whether the HTTP response status is 200, confirming whether the precipitation forecast map link is valid;

[0081] If the link is valid, the corresponding forecast image is loaded into the web page. If it is invalid, the link is regenerated and verification is continued to ensure that the displayed image is the latest and valid data.

[0082] It should be noted that the "verification of the validity of the precipitation forecast map link" is achieved through an HTTP request. Specifically, a HEAD request is initiated through fetchAPI to check the validity of the forecast map link.

[0083] Furthermore, during the verification process, the response status code is the key judgment criterion. If the HTTP status code returned by the server is 200, it means that the link is valid and the forecast map data can be loaded; if the status code returned is 404 or other error code, it means that the link is invalid and needs to be regenerated and verified. This process can automatically determine the validity of the link and verify the link through a program loop until a valid forecast map link is found.

[0084] Furthermore, during implementation, asynchronous operations are written in JavaScript so that the verification process of the HEAD request does not affect other functions of the web page. Through the Promise or async / await mechanism, the link verification process is executed smoothly, ensuring the smoothness of the user experience when the page is loaded.

[0085] Step S6: Update the precipitation forecast map for the corresponding period in the webpage according to the verification result, and display the latest precipitation data in real time.

[0086] The real-time display of the latest precipitation data includes updating the precipitation forecast map for the corresponding period in real time on the web page through JavaScript;

[0087] By updating The src attribute of the tag dynamically displays the latest precipitation forecast map;

[0088] During the update process, the browser cache mechanism is used to avoid repeated loading.

[0089] It should be noted that the "real-time display of the latest precipitation data" is achieved by dynamically updating the image source (src) through JavaScript. Specifically, The src attribute of the tag will be updated to the new forecast image URL, thereby replacing the image.

[0090] Furthermore, during the image update process, the browser will automatically cache the loaded image. Therefore, in order to ensure that the image is the latest precipitation data, the query string of the src attribute can be dynamically adjusted or the cache control header can be used to prevent the browser from caching the old image. In this way, the user can see the latest forecast map every time he visits the page.

[0091] Furthermore, during the update process, the browser's cache mechanism and the Cache-Control setting of the HTTP request header are combined to ensure that no cache conflict occurs when the image is updated, thereby improving the loading efficiency of the web page and reducing the loading of invalid data.

[0092] Example 2

[0093] Reference Figure 2 , as an embodiment of the present invention, provides a system for making a 10-day precipitation forecast map of a river basin, comprising:

[0094] The contour generation module 100 is used to obtain a geographical contour map of a watershed, and process the geographical contour map to generate a watershed contour map with a transparent background;

[0095] The base map generation module 200 is used to superimpose the watershed contour map with a transparent background and the watershed identification information to generate a watershed base map in SVG format;

[0096] The rainfall forecast module 300 is used to construct a web page framework using HTML5 technology, and display a precipitation forecast map for the next 1-10 days in the web page framework;

[0097] The link generation module 400 is used to analyze the URL pattern of the precipitation forecast map, and generate a link of the precipitation forecast map for the corresponding time period according to the pattern;

[0098] The validity verification module 500 is used to verify the validity of the precipitation forecast map link in an automated manner, and display the forecast map corresponding to the valid link on the web page;

[0099] The precipitation update module 600 is used to update the precipitation forecast map for the corresponding period in the web page according to the verification result, and display the latest precipitation data in real time.

[0100] Specifically, 1. Make a basin base map

[0101] Make a Wujiang River Basin outline map ly_map.png. The reservoir dispatching automation system of the Wujiang Central Control Center has a GIS map of the entire basin. In order to obtain the basin outline map, it is necessary to remove irrelevant internal information. The author used AI mapping software. After intercepting the basin map, the software was used to draw the outer contour of the basin on a new layer, and Guiyang's geographical location was simply marked. It was saved as a PNG format image that supports transparent effects and named lk.png. The scale of the outline map is consistent with the scale of the Central Meteorological Observatory's forecast map, with a larger blank area, and the length and width of the entire image are consistent with the length and width of the Central Meteorological Observatory's forecast map. Except for the prominent marking of the basin boundary line, the rest of the picture is transparent. The Central Meteorological Observatory's forecast map and lk.png are superimposed to overlap Guiyang's position, and the position of the basin outline on the picture is determined, and saved as ly_map.png. A Wujiang River Basin outline map is completed.

[0102] 2. Create a basin base map with labels

[0103] Make the logo, ly_map.png, Spark Studio text, and release time mark box into an SVG file: ly_map_2.svg.

[0104] 3. Write the main file weather_forecast.html:

[0105] Written in HTML5. The label sets the position of the 1-10 day forecast map and places it on the upper layer.

[0106] <svg>The label draws the picture title and is placed on the upper layer of the layer.

[0107] exist Insert in tag Label, placed at the bottom of the layer, default attribute src="", set width and height.

[0108] use <object>Insert the tag into ly_map_2.svg and place it in the middle layer as the base map of the web page.

[0109] 4. The above steps build the web page framework, and the following generates the image link

[0110] 4.1 Analyze the rules of image addresses

[0111] Collect the precipitation forecast map for 1-10 days from the Central Meteorological Observatory. Method:

[0112] The link address format of the precipitation forecast map is as follows:

[0113] http: / / image.nmc.cn / product / 2024 / 07 / 18 / STFC / medium / SEVP_NMC_STF C_SFER_ER24_ACHN_L88_P9_20240718060002400.JPG? v=1721269802807

[0114] The link address format of the Central Meteorological Observatory's precipitation forecast map remains basically unchanged.

[0115] The format is "http: / / image.nmc.cn / product / "+date+" / STFC / medium / SEVP_NMC_STFC_SFER_ER24_ACHN_L88_P9_"+date+release time+forecast time+".JPG".

[0116] The forecast time will change, which are 024, 048, 072, 096, 120, 144, 168, 192, 216, 240, corresponding to 24h, 48h, etc. forecasts. The image format is always JPG, and the suffix may be JPG or jpg. The number after "?v=" is the timestamp.

[0117] Use JavaScript to generate dates in two formats, "2024 / 07 / 18" and "20240718".

[0118] 4.2 Set the web page layout

[0119] Use on the web The label sets 10 positions to store the forecast map and set The position attribute of the tag is relative. When the web page is zoomed, the image can be automatically arranged according to the window size. Add in tag Tag, set the id attribute in chronological order, and the initial link address of the image is empty.

[0120] 4.3 Generate various possible forecast link addresses:

[0121] Generate a JavaScript array of possible release times;

[0122] varpredix = newArray();

[0123] predix[0] = "00";

[0124] predix[1] = "01";

[0125] predix[2] = "02";

[0126] predix[3] = "03";

[0127] predix[4] = "06";

[0128] predix[5] = "11";

[0129] predix[6] = "12";

[0130] predix[7] = "13";

[0131] Generate a JavaScript array of possible suffixes, and replace the timestamp with "??????????????????????" or "*". The reason why more formats are set is that when the uppercase and lowercase are inconsistent, the image cannot be obtained, sometimes adding * cannot display, and sometimes replacing it with ? will display normally. However, at least one of the following formats will correctly parse the image address.

[0132] var myjpgs = newArray();

[0133] myjpgs[0] = ".jpg";

[0134] myjpgs[1] = ".JPG";

[0135] myjpgs[2]=".jpg?v=????????????";

[0136] myjpgs[3]=".JPG?v=?????????";

[0137] myjpgs[4] = ".jpg?v = *";

[0138] myjpgs[5] = ".JPG?v=*";

[0139] The longest forecast time currently announced by the Central Meteorological Observatory is 7 days, but this method can detect 8-10 days forecast chart. Generate a JavaScript array with the forecast time.

[0140] var forecastTime=newArray();

[0141] forecastTime[0]="0002400";

[0142] forecastTime[1]="0004800";

[0143] forecastTime[2]="0007200";

[0144] forecastTime[3]="0009600";

[0145] forecastTime[4]="0012000";

[0146] forecastTime[5]="0014400";

[0147] forecastTime[6]="0016800";

[0148] forecastTime[7]="0019200";

[0149] forecastTime[8]="0021600";

[0150] forecastTime[9]="0024000";

[0151] Generate an array of all strings in the link address format according to the above array, named myurls. myurls contains various possible combinations of image links.

[0152]

[0153] 4.4 Get the correct address of the image and place it in a fixed position.

[0154] Write a function isLinkValid, which checks the string in the link for valid links and gives different IDs Assign a value to the SRC attribute of the tag.

[0155] The address of the first day contains "0002400", and the address of the tenth day contains "0024000". If the forecast map for the next 10 days is released at 0:00, the address of the tenth day is very similar to that of the first day.

[0156] It is necessary to add judgment conditions to distinguish the pictures on the first day and the tenth day.

[0157] The function isLinkValid uses the Ajax method to test the server's response and verify the validity of the link. Use the fetch API to initiate a HEAD request, which is mainly used to obtain the address information of the image without downloading the image itself. After the link is valid, the link address of the image is assigned to the corresponding time period. The src of the tag is updated, and the precipitation forecast map for the next 10 days can be displayed on one page.

[0158]

[0159]

[0160]

[0161] 4.5 Checking for valid links

[0162] This method uses trial and error to detect the image address predicted at that time. Use JavaScript's forEach() traversal function to check the validity of each link in myurls.

[0163] myurls.forEach(function(item,index,myurls){

[0164] isLinkValid(item);

[0165] })

[0166] This method will detect the first and second forecast images released on the day, but as the program runs, the latest image address will be automatically passed in, so updated changes to the image can be seen on the web page.

[0167] Example 3

[0168] An embodiment of the present invention is different from the first two embodiments in that:

[0169] If the functions are implemented in the form of software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present invention, or the part that contributes to the prior art or the part of the technical solution, can be embodied in the form of a software product. The computer software product is stored in a storage medium, including several instructions for a computer device (which can be a personal computer, a server, or a network device, etc.) to perform all or part of the steps of the methods described in each embodiment of the present invention. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (ROM, Read-Only Memory), random access memory (RAM, Random Access Memory), disk or optical disk, etc., which can store program codes.

[0170] The logic and / or steps represented in the flowchart or otherwise described herein, for example, may be considered as an ordered list of executable instructions for implementing logical functions, and may be embodied in any computer-readable medium for use by an instruction execution system, apparatus or device (such as a computer-based system, a system including a processor, or other system that can fetch instructions from an instruction execution system, apparatus or device and execute the instructions), or in conjunction with such instruction execution system, apparatus or device. For purposes of this specification, "computer-readable medium" may be any device that can contain, store, communicate, propagate or transmit a program for use by an instruction execution system, apparatus or device, or in conjunction with such instruction execution system, apparatus or device.

[0171] More specific examples of computer-readable media (a non-exhaustive list) include the following: an electrical connection with one or more wires (electronic device), a portable computer disk case (magnetic device), a random access memory (RAM), a read-only memory (ROM), an erasable and programmable read-only memory (EPROM or flash memory), an optical fiber device, and a portable compact disk read-only memory (CDROM). In addition, the computer-readable medium may even be a paper or other suitable medium on which the program is printed, since the program may be obtained electronically, for example, by optically scanning the paper or other medium, followed by editing, deciphering or, if necessary, processing in another suitable manner, and then stored in a computer memory.

[0172] It should be understood that the various parts of the present invention can be implemented by hardware, software, firmware or a combination thereof. In the above-mentioned embodiments, a plurality of steps or methods can be implemented by software or firmware stored in a memory and executed by a suitable instruction execution system. For example, if implemented by hardware, as in another embodiment, it can be implemented by any one of the following technologies known in the art or their combination: a discrete logic circuit having a logic gate circuit for implementing a logic function for a data signal, a dedicated integrated circuit having a suitable combination of logic gate circuits, a programmable gate array (PGA), a field programmable gate array (FPGA), etc.

[0173] Example 4

[0174] As an embodiment of the present invention, a method for producing a 10-day precipitation forecast map for a river basin is provided.

[0175] This embodiment aims to address the limitations of traditional weather forecast map display methods by constructing a dynamically updated forecast map display system to achieve real-time updating and display of basin precipitation forecast maps, especially for the display of precipitation forecast maps for the Wujiang River Basin and its surrounding areas.

[0176] Step 1: Create a watershed base map

[0177] First, obtain the GIS map of the entire Wujiang River Basin, which is provided by the reservoir dispatching automation system of the Wujiang River Central Control Center. Use AI mapping software to remove parts that are not related to the basin from the GIS map, and only retain the regional outline of the Wujiang River Basin. In the software, use a new layer to depict the outer contour of the basin, and simply mark the geographical location of Guiyang on the basin outline map. The map is saved in PNG format that supports transparent background effects and is named lk.png. The scale of this map is consistent with the precipitation forecast of the Central Meteorological Observatory. Figure 1 The length and width of the entire image are the same as the forecast map of the Central Meteorological Observatory.

[0178] Use AI mapping software to process the original GIS map through layer overlay and contour drawing technology to ensure that the image background is transparent and only the main geographic information and annotation content of the basin are displayed to facilitate overlay with other forecast maps.

[0179] Step 2: Create a watershed base map with labels

[0180] Based on the watershed outline map lk.png produced in step 1, add identification elements, including watershed logo, watershed name, release time and other information. Draw these elements in SVG format and overlay them with the base map to generate a new SVG file named ly_map_2.svg.

[0181] Use the SVG format to store identification information to ensure that the image elements have good scalability and operability. In the SVG file, use <text>Labels add text annotations. <image>Labels are embedded in the base map to ensure that identification information and basin contour map content are clearly presented.

[0182] Step 3: Write the web page framework

[0183] Use HTML5 to build a web page framework and set the area for displaying the basin precipitation forecast map. The location is set in the tag to store the 1-10 day precipitation forecast map, and the location and size of these areas are adjusted through CSS to adapt them to different display environments. <svg>Insert title information into the tag to ensure that the content of the web page is clear and easy to understand.

[0184] pass The tag defines the layer layout and uses position:relative to ensure that the layer position can adapt when the page is resized. <svg>The label is used to draw the title, and The tag is responsible for loading the dynamically updated precipitation forecast map. The basic framework of the web page provides support for dynamically loading forecast maps.

[0185] Step 4: Generate image link

[0186] By analyzing the link format of the Central Meteorological Observatory's precipitation forecast map, the URL structure pattern of the forecast map is extracted. The URL format is:

[0187] http: / / image.nmc.cn / product / [date] / STFC / medium / SEVP_NMC_STFC_SFER_ER24_ACHN_L88_P9_[date][release time][forecast time].JPG?v=[timestamp].

[0188] According to this rule, JavaScript is used to generate URLs for different dates and times, and a set of possible links is generated by combining different prefixes, forecast times and suffixes.

[0189] Use JavaScript to write date formatting and URL concatenation code to generate all possible URLs. Create an array to store possible links and generate a set of URL links based on the timestamp.

[0190] Step 5: Verify the validity of the image link

[0191] Use JavaScript's fetchAPI to initiate a HEAD request to check whether each generated URL is valid. If the URL is valid, assign the corresponding precipitation forecast map link to the corresponding position in the web page. Tag. Through asynchronous requests, it is ensured that other functions of the page will not be affected, and the page can automatically update the precipitation forecast map without refreshing the page.

[0192] Use the fetch method to check the response status of each URL. If the response status code is 200, it means the link is valid, and assign it to the corresponding The src attribute of the tag ensures that the precipitation forecast map is displayed correctly on the web page.

[0193] Step 6: Real-time display of precipitation forecast map

[0194] Use the isLinkValid function to check the validity of the generated forecast map links one by one. By traversing all possible links and assigning valid links to the corresponding The updated image will automatically appear on the web page, corresponding to the 1-10 day precipitation forecast.

[0195] In the isLinkValid function, the validity of each link is judged, and the display position of each image is distinguished according to the forecast time. For example, the forecast image for the first day contains "0002400", and the forecast image for the tenth day contains "0024000". After verifying that the link is valid, update the corresponding time period. The src attribute of the tag ensures that the forecast image is displayed accurately.

[0196] Step 7: Dynamically update the forecast map

[0197] After the page is loaded, the isLinkValid function will automatically detect the valid links of all forecast maps and update the latest image to the web page. This method can dynamically display the precipitation forecast map for the next 1-10 days and automatically replace it with the latest forecast map every time it is updated.

[0198] Use JavaScript's forEach() function to traverse all generated URLs, verify the validity of the links one by one, and periodically check the validity of the links through methods such as setInterval() to ensure that the forecast map on the page is always up to date.

[0199] Example 5

[0200] As an embodiment of the present invention, a method for making a 10-day precipitation forecast map for a river basin is scientifically demonstrated through simulation experiments in order to verify the beneficial effects of the present invention.

[0201] In this experiment, 10 different river basins were first selected as experimental objects, and the precipitation forecast maps were generated and updated using the traditional method and the method of the present invention. The precipitation data of each river basin comes from the same meteorological service platform to ensure the consistency of the data. In the traditional method, image processing, data verification, and updating of precipitation forecast maps all require manual operations. Specifically, the traditional method manually downloads the precipitation forecast map, converts it into SVG format, and then uses graphic design tools to manually adjust the river basin contour map and add identification information. When updating the forecast map, the validity of the image link needs to be manually verified, and the forecast map in the web page needs to be manually updated through JavaScript. The whole process takes a long time and is prone to manual operation errors.

[0202] In contrast, the present embodiment greatly simplifies the process of making forecast maps through automation technology. In the present embodiment, the generation process of the precipitation forecast map is automatically completed by the system. First, the precipitation data is automatically obtained from the meteorological service platform. Subsequently, the system automatically generates a watershed contour map with a transparent background, and superimposes it with the watershed identification information, and finally outputs the watershed base map in SVG format. After the image superposition is completed, the system analyzes the URL pattern of the precipitation forecast map through an automated script, and automatically generates a forecast map link for the next 1 to 10 days. The link validity is automatically verified through programming to ensure that only valid links will be loaded into the web page, and users can view the latest precipitation forecast map in real time on the web page. The experimental results are shown in Table 1.

[0203] Table 1 Comparison of experimental results.

[0204] Comparison Items Traditional methods The method of this embodiment Time required for each update 60 minutes 15 minutes Forecast map accuracy 87％ 98％ Labor costs 36 hours 6 hours User loading waiting time 28 seconds 5 seconds

[0205] By automatically generating a link to a precipitation forecast map and verifying its validity, delays and errors in manual operation are avoided. In traditional methods, when manually updating a forecast map, improper operation or information lag often causes image update delays or inability to display the latest forecast map in a timely manner. The complexity and instability of such manual operation often affect the real-time and accuracy of the forecast map. The present invention ensures the timely update of the precipitation forecast map by setting a clear URL rule and performing automatic link generation and verification, avoiding omissions and mistakes in manual operation, and improving the accuracy and timeliness of the forecast map.

[0206] The work efficiency is greatly improved through automated processing. In the traditional method, the production of precipitation forecast maps requires manual editing and updating of each layer, and each operation may involve a large number of repeated steps, which consumes time and energy. After adopting the technology of the present invention, the layers are generated and updated through a preset automated process, which reduces the manual operation time and improves the speed and efficiency of the entire forecast map update process. This technological innovation shortens the update cycle of precipitation forecast maps, greatly improves the timeliness of forecasts, and meets the demand for real-time data updates.

[0207] The real-time loading and caching mechanism solves the problem of slow image loading in traditional methods. In traditional methods, forecast images are frequently updated and loaded slowly, and it often takes a long time to obtain the latest images, resulting in a poor user experience. After adopting the dynamic loading technology and caching mechanism of the present invention, the loading speed of forecast images is greatly improved, the user's waiting time is reduced, and the user interaction experience is optimized. This technical feature significantly improves the response speed of the system and improves user satisfaction with the system.

[0208] Automated operation reduces reliance on manual labor and reduces labor costs. Manual operation in traditional methods not only requires a large workload, but is also prone to human errors, resulting in untimely or erroneous image updates, increasing labor costs and management difficulties. Through the automation solution of the present invention, the system can independently complete the update and verification of forecast maps, reducing the need for manual intervention, reducing labor costs, and also reducing the risks caused by human errors.

[0209] It should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention rather than to limit it. Although the present invention has been described in detail with reference to the preferred embodiments, those skilled in the art should understand that the technical solutions of the present invention may be modified or replaced by equivalents without departing from the spirit and scope of the technical solutions of the present invention, which should all be included in the scope of the claims of the present invention.< / svg> < / svg> < / image> < / text> < / object> < / svg> < / svg> < / svg>

Claims

1. A method for preparing a 10-day precipitation forecast map for a river basin, characterized in that: include: Obtaining a geographic contour map of the watershed, and processing the geographic contour map to generate a watershed contour map with a transparent background; Overlay the basin outline map with transparent background and basin identification information to generate a basin base map in SVG format; Using HTML5 technology to construct a web page framework, and displaying a precipitation forecast map for the next 1-10 days in the web page framework; Analyze the URL pattern of the precipitation forecast map, and generate a precipitation forecast map link for the corresponding time period based on the pattern; Verifying the validity of the precipitation forecast map link in an automated manner, and displaying the forecast map corresponding to the valid link on the web page; The precipitation forecast map for the corresponding period on the web page is updated according to the verification results, and the latest precipitation data is displayed in real time.

2. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 1, characterized in that: Generating the watershed contour map with transparent background comprises obtaining original watershed map data from the watershed management platform; Processing the watershed map includes removing geographic information irrelevant to the watershed, retaining the outline of the watershed area, and generating a watershed outline map with a transparent background; The generation of the watershed contour map is achieved through AI mapping software, which identifies the watershed boundaries and saves them in PNG format with a transparent background.

3. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 2, characterized in that: The superimposing of the watershed outline map with a transparent background and the watershed identification information includes adding identification information on the watershed outline map, wherein the identification information includes the watershed name, the watershed number and its related geographic coordinates; The identification information is embedded into the watershed outline map through a graphic design tool. The identification information is embedded into the watershed outline map in the form of a vector graph, and finally a watershed base map in SVG format is generated. The base map supports transparency effects and is displayed in superposition with other layers.

4. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 3, characterized in that: The web page framework is constructed by using HTML5 The tag sets the web page layout framework and defines the display area of ​​each layer; use <svg> The tag is embedded in the watershed base map in the SVG format, and the display levels of different layers are set by using CSS technology, so that the watershed base map and the precipitation forecast map are superimposed and displayed;< / svg> The location of the precipitation forecast map for the next 1-10 days is set in the web page frame, and when the web page is loaded, the forecast map data is dynamically loaded using JavaScript.

5. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 4, characterized in that: The analyzing the URL rule of the precipitation forecast map includes analyzing the format of the precipitation forecast map URL and extracting variables such as date, timestamp and forecast time therein; Use programming language to generate corresponding precipitation forecast map link based on date and forecast time information; By combining string concatenation with regular expressions, links to precipitation forecast maps are automatically generated.

6. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 5, characterized in that: The verifying the validity of the precipitation forecast map link includes using fetchAPI to initiate a HEAD request to verify the validity of the precipitation forecast map link; By judging whether the HTTP response status is 200, confirming whether the precipitation forecast map link is valid; If the link is valid, the corresponding forecast image is loaded into the web page. If it is invalid, the link is regenerated and verification is continued to ensure that the displayed image is the latest and valid data.

7. The method for making a 10-day precipitation forecast map for a river basin as claimed in claim 6, characterized in that: The real-time display of the latest precipitation data includes updating the precipitation forecast map for the corresponding period in real time on the web page through JavaScript; By updating The src attribute of the tag dynamically displays the latest precipitation forecast map; During the update process, the browser cache mechanism is used to avoid repeated loading.

8. A system using the method for producing a 10-day precipitation forecast map for a river basin as claimed in any one of claims 1 to 7, characterized in that: include: The contour generation module (100) is used to obtain a geographical contour map of the watershed, and process the geographical contour map to generate a watershed contour map with a transparent background; The base map generation module (200) is used to superimpose the watershed contour map with a transparent background and the watershed identification information to generate a watershed base map in SVG format; The rainfall forecast module (300) is used to construct a web page framework using HTML5 technology, and display a precipitation forecast map for the next 1-10 days in the web page framework; The link generation module (400) is used to analyze the URL pattern of the precipitation forecast map, and generate a link of the precipitation forecast map for the corresponding time period according to the pattern; The validity verification module (500) is used to verify the validity of the precipitation forecast map link in an automated manner, and display the forecast map corresponding to the valid link on the web page; The precipitation update module (600) is used to update the precipitation forecast map for the corresponding period in the webpage according to the verification result, and to display the latest precipitation data in real time.

9. A computer device comprising a memory and a processor, wherein the memory stores a computer program, wherein: When the processor executes the computer program, the processor implements the steps of the method for producing a 10-day precipitation forecast map for a river basin according to any one of claims 1 to 7.

10. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the steps of the method for producing a 10-day precipitation forecast map for a river basin according to any one of claims 1 to 7 are implemented.

Images