System and method for displaying high-resolution liver cancer pathological image based on image pyramid

A system for displaying a high-resolution liver cancer pathological image based on an image pyramid, comprising:

• a data source processing module configured for acquiring original images in various states, processing the original images, acquiring an image pyramid, naming image blocks in the image pyramid and storing the image blocks in a folder set for the image pyramid in a corresponding server;
• wherein the data source processing module comprises:
• a data source processing unit configured for acquiring the original images in various states from an original image database, setting a size threshold, calculating a size of the original images, calculating a maximum number of levels of the image pyramid according to the size threshold and the size of the original images, and calculating an image cutting size from the maximum number of levels of the image pyramid;
• wherein a process of the data source processing unit is as follows:
• the original images in various states are acquired from an original image database, the size, comprising a width of the original images and a height of the original images, of the original images is calculated, and the size threshold is set;
• when the size threshold is 500×500, the width of the original images is Width, the height is Height, and the maximum number of levels of the image pyramid is N;
• the images are continuously downsampled until the width reaches the size threshold, and accordingly a number of times of downsampling i shall satisfy
• Width
• 2
• i
• ≤
• 500
• ,
• i
• ∈
• N
• ;
• i
• ≥
• log
• 2
• ⁢
• Width
• 500
• ,
• i
• ∈
• N
• ,
• is calculated, and a minimum value that meets the condition is taken to obtain the number of times of downsampling, which is the maximum number of levels of the image pyramid, and then the calculated i is substituted into
• ⌈
• Width
• 2
• i
• ⌉
• to obtain the image cutting size
• ⌈
• Width
• 2
• i
• ⌉
• ×
• ⌈
• Width
• 2
• i
• ⌉
• ;
• when the width of the original images is less than or equal to the height of the original images, the original images are downsampled until the width of the original images reaches the size threshold, the downsampling is stopped, the number of times of downsampling is calculated, which is the maximum number of levels of the corresponding image pyramid, and the image cutting size is calculated from the number of times of downsampling;
• when the width of the original images is larger than the height of the original images, the original images are downsampled until the height of the original images reaches the size threshold, the downsampling is stopped, the number of times of downsampling is calculated, which is the maximum number of levels of the corresponding image pyramid, and the image cutting size is calculated from the number of times of downsampling;
• an image block processing unit configured for preprocessing the original images and cutting the preprocessed original images according to the image cutting size to obtain a plurality of image blocks, wherein each level of the image blocks together forms an image pyramid, and each image block is named and stored in the folder set for the image pyramid in the corresponding server;
• wherein a process of the image block processing unit is as follows:
• step S1, performing Gaussian blur processing on the original image as a target image to obtain a filtered image subjected to Gaussian blur;
• step S2, downsampling the filtered image to obtain an approximate image;
• step S3, cutting the target image according to the image cutting size to obtain a plurality of image blocks;
• step S4, each level of the image blocks forming an image pyramid together, naming each image block and storing each image block in the folder set for the image pyramid in the corresponding server;
• step S5, when a width of the approximate image is larger than a width of the image cutting size, taking the approximate image as the target image in step S1 and traversing step S1 to step S5;
• otherwise, cutting a last approximate image obtained in step S2 according to the image cutting size, naming each cut image block and stored each cut image block in the folder set for the image pyramid in the corresponding server;
• wherein each image block in the image block processing unit is named as n_m according to a character string obtained by splicing a row number n and a column number m in the image pyramid with an underline, and the image block is stored in the folder set for the image pyramid in the corresponding server;
• an image display module configured for acquiring the image blocks in the folder set for the image pyramid in the server, zooming in, zooming out and translating the image blocks according to a user's request, and splicing the image blocks and displaying the image blocks in an image display area;
• wherein the image display module comprises:
• a client-side configured for initiating a request for obtaining basic information of an image to a server-side, and simultaneously monitoring user mouse events, asynchronously requesting image blocks to be loaded to the server-side according to a user's operation, requested input parameters being a state of the liver cancer pathological image where the image blocks to be obtained are located, a level where the image blocks are located, a row number and a column number, and splicing the obtained image blocks and displaying in the image display area of a browser;
• wherein monitoring of user mouse events comprises:
• an operation of clicking mouse or scrolling down mouse by a user:
• the operation is used for keeping the displayed image skill if the current image pyramid is at the bottom when the user clicks the mouse or scrolls down the mouse;
• otherwise, the operation is used for carrying out a zooming-in operation, and displaying a corresponding image block of an approximate image in a lower level with an area, as a center, where the mouse is clicked or scrolled;
• wherein the zooming-in operation comprises the following steps:
• obtaining the row number and column number of the image block where a mouse action position is located in a current level according to a coordinate of the mouse action position of the current level in the image pyramid, and obtaining the row number and column number of the corresponding image block in a lower level through the corresponding relationship between the image block in the current level and the image block in the lower level, so as to obtain the corresponding requested input parameters;
• the current level is p, the coordinate of the mouse action position is (i,j), and the row of the corresponding image block is
• ⌊
• j
• a
• ⌋
• ,
• and the column thereof is
• ⌊
• i
• a
• ⌋
• ;
• there are four image blocks corresponding to the lower level, and pairs of the row number and column number thereof are
• [
• 2
• ×
• ⌊
• j
• a
• ⌋
• ,
• 2
• ×
• ⌊
• i
• a
• ⌋
• ]
• ,
• [
• 2
• ×
• ⌊
• j
• a
• ⌋
• ,
• 2
• ×
• ⌊
• i
• a
• ⌋
• +
• 1
• ]
• ,
• [
• 2
• ×
• ⌊
• j
• a
• +
• 1
• ,
• 2
• ×
• ⌊
• i
• a
• ⌋
• ]
• ⁢
• and
• [
• 2
• ×
• ⌊
• j
• a
• ⌋
• +
• 1
• ,
• 2
• ×
• ⌊
• i
• a
• ⌋
• +
• 1
• ]
• respectively, then the client-side needs to request for the addresses of these four image blocks from the server-side, and the requested input parameters are:
• 1) Level p, row:
• 2
• ×
• ⌊
• j
• a
• ⌋
• ,
• column:
• 2
• ×
• ⌊
• i
• a
• ⌋
• ;
• 2) level p, row:
• 2
• ×
• ⌊
• j
• a
• ⌋
• ,
• column:
• 2
• ×
• ⌊
• i
• a
• ⌋
• +
• 1
• ;
• 3) level p, row:
• 2
• ×
• ⌊
• j
• a
• ⌋
• +
• 1
• ,
• column:
• 2
• ×
• ⌊
• i
• a
• ⌋
• ;
• 4) level p, row:
• 2
• ×
• ⌊
• j
• a
• ⌋
• +
• 1
• ,
• column:
• 2
• ×
• ⌊
• i
• a
• ⌋
• +
• 1
• ;
• an operation of upward scrolling mouse by a user:
• the operation is used for keeping the displayed image skill if the current image pyramid is at a top level when the user scrolls the mouse upward;
• otherwise, the operation is used for carrying out a zooming-out operation, and displaying a corresponding image block of an approximate image an upper level with an area where the mouse is scrolled as a center;
• the zooming-out operation comprises the following steps:
• acquiring the row number and column number of the image block where the mouse action position is located in the current level according to the coordinate of the mouse action position of the current level in the image pyramid, and acquiring the row number and column number of the image block corresponding to the upper level through the corresponding relationship between the image block in the current level and the image block in the upper level, so as to obtain the corresponding requested input parameters;
• the current level is p, the coordinate of the mouse action position is (i,j), and the row number of the corresponding image block is
• ⌊
• j
• a
• ⌋
• and the column number thereof is
• ⌊
• i
• a
• ⌋
• ;
• if a pair of row number and column number of the corresponding image block is in the upper level is
• [
• ⌊
• j
• 2
• ⁢
• a
• ⌋
• ,
• ⌊
• i
• 2
• ⁢
• a
• ⌋
• ]
• ,
• the client-side needs to request for the address of the image block from the server-side, and the requested input parameters are level p, row:
• ⌊
• j
• 2
• ⁢
• a
• ⌋
• ;
• column:
• ⌊
• i
• 2
• ⁢
• a
• ⌋
• ;
• a translation operation by a user:
• the operation is used for keeping the displayed image still if the current image pyramid is on an edge or can no longer move;
• otherwise, the operation is used for continuing the translation operation, and acquiring the image blocks to be displayed as needed, and then splicing and displaying;
• wherein the translation operation comprises the following steps:
• setting a variable S, which is used for marking and storing the requested image blocks, wherein the storage content is the level, row number and column number of the image block;
• circularly traversing a row range and a column range of the image blocks in the display area at the client-side, respectively, and combining the row number and column number to obtain the parameters of the image block to be requested, wherein when the image block has been marked by the variable S, there is no need to repeat the request;
• otherwise, requesting for the image block from the server-side;
• a cutting size is a×a, wherein a is a positive integer greater than 0;
• a translation distance of the current image is (tx,ty), and the size of the image display area at the client-side is W×H;
• at an initial stage, a total size of the image blocks displayed in the image display area at the client-side is the size W×H of the image display area at the client-side;
• the row range and the column range of the image blocks in the display area are respectively
• 0
• ∼
• ⌊
• H
• a
• ⌋
• ⁢
• and
• ⁢
• 0
• ∼
• ⌊
• W
• a
• ⌋
• ;
• after translation by (tx,ty), the row range and the column range of the image blocks displayed to the user in the image display area at the client-side are respectively
• ⌊
• ❘
• "\[LeftBracketingBar]"
• ty
• ❘
• "\[RightBracketingBar]"
• a
• ⌋
• ∼
• ⌊
• ❘
• "\[LeftBracketingBar]"
• ty
• ❘
• "\[RightBracketingBar]"
• +
• H
• a
• ⌋
• ⁢
• and
• ⁢
• ⌊
• ❘
• "\[LeftBracketingBar]"
• tx
• ❘
• "\[RightBracketingBar]"
• a
• ⌋
• ∼
• ⌊
• ❘
• "\[LeftBracketingBar]"
• tx
• ❘
• "\[RightBracketingBar]"
• +
• W
• a
• ⌋
• ;
• the server-side configured for obtaining information comprising the size of the original images in each state, the maximum number of levels of the image pyramid, the image block and/or the image cutting size from the data source processing unit and responding to the client-side with the information;
• and obtaining responded image blocks according to the state of the liver cancer pathological image where the image block is located, the level, the row number and the column number and returning the responded image blocks to the client-side.