Digital pathological image processing method based on OpenSlide and related device

Abstract

The invention belongs to the field of digital pathological image processing, and discloses an OpenSlide-based digital pathological image processing method and a related device, and the method comprises the steps: obtaining a digital pathological image, calling an OpenSlide library to analyze a pyramid structure of the image to generate a multi-resolution hierarchy, and dynamically calculating a loaded image region based on a slice request instruction input by a user; a double-Canvas rendering mode is adopted, a bottom layer Canvas loads an image area in real time, a labeling layer Canvas independently renders a labeling path, and separation of an image and a label is achieved; and generating a closed path based on the superposed image and the annotation mode, and exporting the annotation data in a general format. According to the method, the user interaction experience is improved, the interface operation is more intuitive, the process is simplified, and the drawing mode switching is convenient; the labeling efficiency is improved, real-time adjustment of complex contours is supported, and the workload is reduced; a data export function is enhanced, effective association of annotation information is realized, and multi-format universality is supported; multi-level support is improved, level switching is smooth, loading is fast, and tool performance and user experience are improved.

Description

TECHNICAL FIELD

[0001] The present application belongs to the technical field of digital pathology, specifically to the field of digital pathology image processing, and particularly to an OpenSlide-based digital pathology image processing method and related device. BACKGROUND

[0002] In the field of digital pathology, with the continuous innovation of medical imaging technology, the digital processing and analysis of pathological sections have become a key direction for scientific research and clinical application. By converting traditional glass sections into high-resolution digital images (such as SVS format), the convenient storage, transmission and analysis of pathological images are realized, which are widely used in remote diagnosis, pathological research, medical teaching and artificial intelligence assisted diagnosis, etc. With the progress of technology, the demand for processing and analysis of digital pathology images is increasing, especially in image annotation, region extraction and data export, which puts higher requirements on the performance of related tools.

[0003] However, the existing digital pathology image processing tools have many shortcomings in practical application. In terms of user interaction, the interface design lacks intuitiveness, the operation process is cumbersome, the drawing mode switching is inconvenient and the keyboard shortcut support is scarce, which seriously affects the use efficiency; in terms of annotation efficiency, the complex contour drawing cannot be adjusted in real time, the path management and undo function is inefficient, which increases the annotation workload; the data export function is limited, it is difficult to effectively associate the annotation information with the image region, and the supported data format is single, which limits the data universality; the multi-level image support is insufficient, the level switching needs to be operated manually, the loading speed is slow, and the level transition is not smooth.

[0004] Therefore, the current digital pathology image processing technology faces technical problems such as difficulty in real-time loading of large-size medical images, lack of annotation operation accuracy and management, and asynchronous export affecting user experience, and innovative solutions are needed to improve tool performance and user experience. SUMMARY

[0005] The present application provides an OpenSlide-based digital pathology image processing method and related device, which realizes accurate annotation, efficient management and export of XML and high-definition images of large-size pathological images through layered loading, multi-mode annotation, grouping management and asynchronous export technology.

[0006] In order to achieve the above purpose, the present application adopts the following technical solutions: In a first aspect, the present application provides an OpenSlide-based digital pathology image processing method, comprising: obtaining a digital pathology image to be processed; The OpenSlide library is called to parse the pyramid structure of digital pathology images and generate multiple resolution levels. In each resolution level, the loaded image region is dynamically calculated based on the user's slice request command. The loaded image region is rendered using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer. The underlying Canvas loads the dynamically calculated image region in real time, while the annotation layer Canvas renders the annotation path independently. Based on the underlying image of the overlaid annotation layer and the set annotation mode, a closed path is generated; the drawing is performed based on the annotation data corresponding to the closed path, and the annotation data is exported in a common format.

[0007] A further improvement of this invention is that the step of calling the OpenSlide library to parse the pyramid structure of digital pathology images and generate multiple resolution levels includes: Digital pathology images undergo data preprocessing and format conversion to obtain SVS files; The OpenSlide library is used to parse the pyramid structure of the SVS file, generating multiple resolution levels, and extracting the thumbnails corresponding to each resolution level.

[0008] As a further improvement of the present invention, the step of dynamically calculating the loaded image region according to the user-input slice request instruction in multiple resolution levels includes: In multiple resolution levels, the loaded image region is dynamically calculated based on the slice request command input by the user. The slice request command includes the requested resolution level, viewport position, and scaling ratio, and outputs binary data in image format. The loaded image region is rendered using a dual Canva rendering method to obtain the underlying image with the superimposed annotation layer.

[0009] As a further improvement of the present invention, the specific process of rendering the loaded image region using the dual Canva rendering method includes: When scaling the loaded image region, the viewport center point is calculated, the scaling level is adjusted according to the scaling factor, and the image boundaries are constrained. When translating the loaded image region, the mouse displacement is converted into an image coordinate system offset, and the new region image data is dynamically loaded to obtain the underlying image of the overlaid annotation layer.

[0010] A further improvement of the present invention is that, based on the underlying image of the overlaid annotation layer and the set annotation mode, a closed path is generated; drawing is performed according to the annotation data corresponding to the closed path, and the annotation data is exported in a general format, including: A closed path is generated based on the underlying image of the overlaid annotation layer and the set annotation mode; the annotation mode includes three modes: free drawing, rectangular annotation, and circular annotation. The annotation data of the closed path is mapped to coordinates and stored as the highest level image coordinates in the resolution hierarchy; The drawing is performed based on the annotation data corresponding to the closed path. During the drawing process, the image coordinates are converted into Canvas pixel coordinates so that the annotation position remains unchanged after scaling and translation. Export image coordinates in XML format.

[0011] As a further improvement of the present invention, after generating the closed path based on the underlying image of the overlay annotation layer and the set annotation mode, the method further includes: The generated closed paths are grouped and their withdrawal control is performed as follows: The generated closed paths are managed in groups. Each group includes a unique ID, title, color, and path array corresponding to the closed path. A Map data structure is used to store the groups. Undo control for generated closed paths can delete the last path in a group and trigger a redraw annotation layer command.

[0012] As a further improvement of the present invention, the processing method further includes: During the export of labeled data, the labeled data of the same group are encapsulated into independent Promise tasks, and the Promise tasks are exported in batches. During batch export, the export progress is presented visually.

[0013] As a further improvement of the present invention, the processing method further includes: The annotations are redrawn according to the redraw annotation layer command, and the redrawn annotations are within the redraw viewport; WeakMap is used to cache the loaded image region so that the image region that goes out of range is automatically released.

[0014] Secondly, the present invention provides a digital pathological image processing system based on OpenSlide, comprising: The image acquisition module is used to acquire digital pathological images to be processed; The image parsing module calls the OpenSlide library to parse the pyramid structure of digital pathology images and generate multiple resolution levels. Within these resolution levels, it dynamically calculates the loaded image regions based on the user-input slice request instructions. It uses a dual Canvas rendering method to render the loaded image regions to obtain the underlying image of the superimposed annotation layer. The underlying Canvas loads the dynamically calculated image regions in real time, while the annotation layer Canvas renders the annotation paths independently. The image annotation module is used to generate closed paths based on the underlying image of the overlaid annotation layer and the set annotation mode; to draw according to the annotation data corresponding to the closed paths; and to export the annotation data in a common format.

[0015] Thirdly, the present invention provides a computer program product, including a computer program / instruction, characterized in that the computer program / instruction, when executed by a processor, implements the steps of the above-described digital pathological image processing method based on OpenSlide.

[0016] Compared with the prior art, the present invention has the following beneficial effects: This invention provides a digital pathology image processing method based on OpenSlide. It acquires digital pathology images, calls the OpenSlide library to parse the image's pyramid structure to generate multi-resolution layers, and dynamically calculates the loaded image region based on user-input slice request commands. A dual-Canvas rendering method is employed, where the bottom Canvas loads the image region in real-time, and the annotation layer Canvas independently renders the annotation path, achieving separation of image and annotation. Finally, a closed path is generated based on the superimposed image and annotation pattern, and the annotation data is exported in a universal format. Utilizing OpenSlide for efficient pyramid structure management supports dynamic loading of multi-level images, reducing data transmission volume and avoiding manual switching. The dual-Canvas mechanism separates rendering tasks, ensuring that image loading does not block annotation operations, enabling real-time preview and adjustment. Simultaneously, the independent annotation layer simplifies path management and undo functionality. Dynamically calculating the loaded region optimizes resource allocation, and the universal format export ensures a close correlation between annotation information and image regions. This method significantly improves the user experience, making the interface more intuitive, the process simpler, and the drawing mode switching more convenient; it improves annotation efficiency, supports real-time adjustment of complex contours and reduces workload; it enhances data export functionality, enables effective association of annotation information and supports multi-format universality; it improves multi-level support, with smooth level switching and fast loading, and improves overall tool performance and user experience.

[0017] Preferably, in this invention, the original digital pathological images are converted into a standardized SVS format through preprocessing, and thumbnails of each level are extracted using OpenSlide's pyramid structure parsing, ensuring the standardization of image data and the integrity of multi-resolution levels. This step optimizes the stability of the image parsing process, avoids compatibility issues caused by format differences, and the generation of thumbnails provides basic support for rapid previewing and navigation, enhancing users' overall control over massive amounts of pathological data.

[0018] Preferably, in this invention, the image loading area is dynamically calculated based on viewport parameters input by the user. Through real-time matching of resolution levels, positions, and scaling ratios, the image segment to be loaded is accurately located. This mechanism reduces redundant data transmission through on-demand loading, avoiding the latency problem of loading full-resolution images. It achieves a balance between memory usage and rendering efficiency, and is particularly suitable for real-time interactive operations on large-size pathological images, enhancing the smoothness of the user experience.

[0019] Preferably, in this invention, a dual-Canvas technique is used to separate the rendering process of the annotation layer and the underlying image. The underlying Canvas is responsible for rendering the dynamically loaded pathological image, while the annotation layer Canvas independently handles path drawing and interaction logic. This design achieves asynchronous rendering of the image and annotations, avoiding performance loss caused by frequent refreshes, while ensuring real-time response of annotation operations and improving the smoothness and visual consistency when drawing complex contours.

[0020] Preferably, this invention supports free drawing, rectangular and circular annotation modes, and combines coordinate mapping technology to associate annotation data with the highest resolution level, achieving consistency in annotation across levels. The coordinate transformation mechanism ensures that the annotation position remains stable after scaling or translation, eliminating annotation offset problems caused by view transformation. XML format export enhances the structured characteristics of the annotation data, meeting the needs of scientific research and clinical scenarios for traceable and reusable annotation information.

[0021] Preferably, in this invention, the labeled paths are grouped and managed using a Map data structure (including unique IDs, colors, and other metadata), and path rollback and redraw commands are supported, achieving controllability and traceability of the labeling process. The group management mechanism optimizes the organization efficiency of complex labeling tasks, the rollback function reduces the impact of misoperations, and the trigger-based redraw strategy only refreshes the labeling layer locally within the viewport, reducing unnecessary rendering overhead and improving interactive response speed.

[0022] Preferably, in this invention, the exported labeled data employs a Promise task encapsulation and batch processing mechanism, combined with visual progress prompts, to achieve asynchronous export task management and user experience optimization. This design avoids interface lag issues during large-scale data export, improves export efficiency through parallel processing, and enhances user control over the operation status through progress visualization, thus improving the user experience during long-duration tasks.

[0023] Preferably, in this invention, a WeakMap is used to cache loaded image regions and automatically release excess resources based on the view extent. Combined with a local redraw strategy, dynamic reclamation and efficient utilization of memory resources are achieved. This mechanism effectively prevents memory leaks caused by the accumulation of historical data. At the same time, by precisely controlling the cache extent, it optimizes the overall system performance while ensuring image loading speed, making it suitable for long-term, high-load digital pathology processing scenarios. Attached Figure Description

[0024] Figure 1 This is an architecture diagram of a digital pathology image processing system based on OpenSlide provided in an embodiment of the present invention; Figure 2 A schematic diagram of the annotation tool interface of the digital pathology image processing system based on OpenSlide provided in an embodiment of the present invention; Figure 3 A flowchart of a digital pathology image processing method based on OpenSlide provided by the present invention; Figure 4 This is a schematic diagram of the structure of a digital pathology image processing system based on OpenSlide provided by the present invention. Detailed Implementation

[0025] To further understand the content of this invention, the invention will be described in detail below with reference to the accompanying drawings and specific embodiments. It should be understood that the embodiments are merely illustrative and not limiting of the invention.

[0026] As described in the background section, in the field of digital pathology, with the continuous development of medical imaging technology, the digital processing and analysis of pathological slides has gradually become an important direction for research and clinical applications. The digitization of pathological slides typically involves converting traditional glass slides into high-resolution digital images (such as SVS format) for storage, transmission, and analysis. These digital images can be used in various application scenarios such as remote diagnosis, pathological research, teaching, and AI-assisted diagnosis. With technological advancements, the demand for digital pathological image processing and analysis is constantly increasing, especially in areas such as image annotation, region extraction, and data export. In existing digital pathological image processing tools, users typically need to annotate and analyze pathological images to mark regions or structures of interest. These annotation tools usually include functions such as drawing contours, exporting contours, and adjusting image layers. However, existing digital pathological image processing tools have some shortcomings in terms of user interaction, annotation efficiency, data export, and multi-layer support, specifically: First, poor user interaction experience. Existing pathological image annotation tools often lack intuitive user interfaces, are complex to operate, and require extensive training to become proficient. For example, some tools cannot dynamically adjust the drawing mode (such as free drawing, rectangle, circle, etc.) when drawing outlines, requiring users to frequently switch tools to complete different annotation tasks. Furthermore, existing tools lack sufficient keyboard shortcut support, preventing users from quickly switching drawing modes or performing other operations via shortcuts, thus reducing annotation efficiency.

[0027] Second, the annotation efficiency is low. Existing annotation tools lack real-time preview and adjustment capabilities when drawing complex contours, requiring users to make multiple modifications to achieve satisfactory results. For example, when drawing rectangles or circles, users cannot simply use mouse operations to complete the shape; they must manually adjust multiple parameters. Existing tools also lack efficient path management and undo functionality. When users make mistakes or modify annotation paths, they cannot quickly undo or redo the operation, making the annotation process cumbersome and time-consuming.

[0028] Third, the data export function is limited. Existing pathological image annotation tools have shortcomings in data export. For example, some tools can only export simple annotation data and cannot directly associate the annotation information with image regions, making it difficult for users to conveniently apply the annotation results to subsequent analysis or research. Furthermore, existing tools do not support multiple formats (such as XML) when exporting annotation data, limiting the universality and compatibility of the annotation data.

[0029] Fourth, insufficient multi-level support. Existing pathology image processing tools, when supporting multi-level images, cannot dynamically adjust image layers, requiring users to manually switch layers to view images at different resolutions. For example, some tools, when loading multi-level images, cannot automatically select the optimal layer to fit the current view, forcing users to manually adjust layers for the best display effect. Existing tools lack smooth transitions and dynamic loading capabilities for multi-level images. When users switch between different layers, image loading is slow, resulting in a poor user experience.

[0030] To address the aforementioned problems, this embodiment provides a digital pathology image processing method based on OpenSlide. This method can solve the following technical issues: 1. The challenge of real-time loading of large-size medical images: SVS files are usually in the GB range, and traditional Web technologies cannot achieve fast switching and smooth rendering of multiple resolution levels.

[0031] 2. Accuracy and management deficiencies in annotation operations: Existing tools lack multi-mode drawing (free / geometric shapes), cross-level coordinate consistency maintenance, and annotation grouping and withdrawal mechanisms.

[0032] 3. Conflict between asynchronous export and user experience: When exporting high-resolution labeled areas in batches, the interface response delay and progress feedback mechanism are not perfect.

[0033] To facilitate a better understanding of this technical solution, the technical terms involved in this invention are explained as follows: OpenSlide is an open-source C library specifically designed for reading and processing whole-slide digital pathology images (WSI), also known as virtual slide images.

[0034] SVS is a digital pathology image format developed by Leica Biosystems for storing digitized tissue slide images. It is a type of whole-slide image.

[0035] Canvas is a two-dimensional rectangular area used in image rendering for drawing graphics, images, and animations. It can be seen as a virtual drawing board. Developers perform various drawing operations within this area through programming to ultimately generate visual image content.

[0036] A Map is a data structure used to store key-value pairs, where each key is unique and the corresponding value can be quickly accessed through the key.

[0037] WeakMap is a variant of the Map data structure.

[0038] Promise is an important mechanism in JavaScript for handling asynchronous operations. It represents the eventual completion (or failure) of an asynchronous task and its result value.

[0039] This embodiment provides a digital pathology image processing method based on OpenSlide, including: Acquire the digital pathology images to be processed; The OpenSlide library is called to parse the pyramid structure of digital pathology images and generate multiple resolution levels. In each resolution level, the loaded image region is dynamically calculated based on the user's slice request command. The loaded image region is rendered using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer. The underlying Canvas loads the dynamically calculated image region in real time, while the annotation layer Canvas renders the annotation path independently. Based on the underlying image of the overlaid annotation layer and the set annotation mode, a closed path is generated; the drawing is performed based on the annotation data corresponding to the closed path, and the annotation data is exported in a common format.

[0040] The candidate problem recommendation method provided in this embodiment will be described in more detail below: This embodiment provides a digital pathology image processing method based on OpenSlide, the specific steps of which are as follows: S1. Viewport-based dynamic loading and layered rendering process: A multi-level image parsing module is constructed, which parses the pyramid structure of digital pathology images (SVS files) based on the OpenSlide library, generates multi-resolution levels (level_dimensions), and extracts thumbnails of each level.

[0041] For example, in the multi-level image parsing module, the backend layered processing is as follows: based on the requested level, viewport position (posX, posY) and scaling ratio, the image region (x, y, width, height) to be loaded is dynamically calculated, and Base64 data in JPEG format is returned.

[0042] The front-end uses a dual-Canvas rendering method for image rendering. The specific process includes: using...<canvasid="svsCanvas"> Render the underlying image.<canvasid="drawCanvas"> An overlay annotation layer is used to achieve smooth 60FPS interaction through requestAnimationFrame.

[0043] The specific implementation principle is as follows: During scaling, the viewport center point (imgCenterX=centerX / scale+posX) is calculated, the scaling level is adjusted according to the scaling factor, and the image boundary is constrained by consttrainPosition to prevent out-of-bounds errors.

[0044] During translation, the mouse displacement is converted into an image coordinate system offset (deltaX=dx / scale), and new region image data is dynamically loaded.

[0045] S2, Multi-mode annotation engine and coordinate mapping process: The design includes a labeling mode switching module to support free drawing, rectangular and circular labeling modes, and to maintain consistent coordinates across different levels.

[0046] Mode switching process: Switch modes using the shortcut keys Ctrl+Shift (rectangular annotation mode) and Ctrl+Alt (circular annotation mode), controlled by the drawMode property and updateDrawMode method, or free drawing mode.

[0047] For example, in this embodiment, the specific geometric annotation algorithm is as follows: In rectangular annotation mode, the starting point (startX, startY) and the ending point (endPos) are recorded to generate a closed path (4 vertices + closing point).

[0048] In circular annotation mode, calculate the radius (radius=sqrt(dx)). 2 +dy 2 The arc method is used to generate an approximate circle with 36 arc segments.

[0049] Coordinate mapping: The labeled data is stored as absolute coordinates of the highest level (Level0), and dynamically converted during export using scaleRatio=level0Width / currentLevelWidth.

[0050] The specific implementation principle is as follows: During the drawing process, the image coordinates (point.x, point.y) are converted to Canvas pixel coordinates (canvasX, canvasY) using the convertToCanvasCoords method to ensure that the annotation position remains unchanged after scaling and translation.

[0051] When exporting XML, use Math.round(point.x*scaleRatio) to convert the current level coordinates to Level0 coordinates, thus conforming to the ASAP annotation standard.

[0052] S3, Labeling Group Management and Withdrawal Control Process: A group management module is built to support group storage, visibility control, and undo operations for marked paths.

[0053] The marked paths (closed paths) are grouped and managed; the group object structure is as follows: each group contains a unique ID, title, color, visibility and path array (paths[]), which is stored using a Map data structure.

[0054] Undo process: The last path in the group is deleted using the undoLastPath method, and redrawPaths is triggered to redraw the annotation layer.

[0055] In this embodiment, a visibility control mechanism is also introduced: both groups and paths support checkboxes (contour-visible), and dynamic hiding is achieved by skipping if(!group.visible||!path.visible) during redrawing.

[0056] The specific implementation principle is as follows: When creating a new group, a dialog box pops up to retrieve the title and check for color repetition, thus avoiding redundant groups.

[0057] The highlight interaction modifies the path color using the highlightContour method (adjustColor increases the color by 30%), and clearHighlight resets the state.

[0058] S4. Asynchronous export and progress monitoring process: In this embodiment, an asynchronous task scheduling module is also designed to support batch export of high-resolution labeled areas and provide real-time progress feedback.

[0059] Asynchronous processing of tasks: Each outline is exported and encapsulated as an independent Promise task, and parameters (coordinates, level, group ID) are submitted via fetch(' / export_region').

[0060] Progress visualization: using<divid="exportProgressBar"> Dynamically update width (percent%)<spanid="exportPercentage"> Display completion rate.

[0061] Interface locking: During export, call lockInterface(true) to disable controls and set cursor: wait to prevent accidental operation.

[0062] The specific implementation principle is as follows: During export, traverse the visible paths within the group, calculate the bounding box (minX, maxY), and request the high-resolution image according to the Level0 coordinates.

[0063] The backend uses OpenSlide.read_region to extract regions and save them as JPEGs, and automatically creates a directory by group title (safe_group_dir).

[0064] For example, this processing method also includes a performance optimization process, in which a performance optimization module is designed to implement incremental rendering and memory management, thereby optimizing the performance of large-size image processing.

[0065] Incremental rendering: Only redraws visible annotations within the viewport (intersection of path.points coordinates and viewport).

[0066] Anti-aliasing: Avoid scaling blur by using the CSS property image-rendering:crisp-edges and Canvas imageSmoothingEnabled=false.

[0067] Memory management: Use WeakMap to cache loaded image tiles, which are automatically released when they go out of viewport.

[0068] The digital pathology image processing method using OpenSlide provided in this embodiment has the following beneficial effects: First, it can efficiently process large-size images: actual tests show that it can smoothly load 40GB SVS files with a layer switching latency of <200ms. Second, annotation accuracy is effectively guaranteed: coordinate transformation error is <0.5px, and the exported XML can be directly used for AI model training. Third, it improves multi-task reliability: it supports the simultaneous export of 100+ groups with a progress monitoring error of <1%.

[0069] For example, in this embodiment, the proposed digital pathology image processing method is specifically applied and a corresponding digital pathology image processing system is developed, as follows: Figure 1 and Figure 2 As shown: against Figure 1 Explanation of the award number: Ⅰ User Interface (UI) Components (including Canvas, Control Panel, Grouped Lists) II. Front-end JavaScript Core Module (SVSViewer Class) III. Backend Flask service (annotated file parsing and export interface) IV. OpenSlide Library Integration (DLL Loading and Image Processing) against Figure 2 Explanation of the award number: Ⅰ Image Container (Double Canvas Overlay Structure) II. Bird's-eye view viewport indicator (dynamic area with red border) For example, this system is a web-based SVS whole-slice image annotation tool, and its core method includes the following steps: Step 1: File upload and parsing.

[0070] Front-end, users access the interface via HTML.<inputtype="file"> Upload an SVS file, listen for the upload event using JavaScript, and send the file to the backend via FormData. Use Flask to receive the file and save it to the uploads directory. Use the OpenSlide library to parse the SVS file, obtain the level information (level_dimensions) and thumbnails (read_region), and return JSON containing file metadata and Base64 thumbnails.

[0071] Step 2: Image loading and rendering.

[0072] For dynamic tile requests, the frontend calculates the area to be loaded (x, y, width, height) based on the current view position (posX, posY), zoom level (scale), and layer (currentLevel), and requests the / get_tile interface via AJAX. For image stitching, the backend reads the corresponding area of ​​the SVS based on the request parameters, converts it to JPEG format, and returns Base64 data. The frontend dynamically renders the image using Canvas and controls the viewport position using transform.

[0073] Step 3: Implement the annotation function.

[0074] The drawing modes support three modes: free, rectangle, and circle, which can be switched using the shortcut keys Ctrl+Shift or Ctrl+Alt; coordinate transformation converts mouse event coordinates (canvasX, canvasY) to image coordinates (x=canvasX / scale+posX) to ensure that the annotation position is aligned with the image; path storage groups annotation data by color in the groups array, and each group contains attributes such as path list, color, and visibility.

[0075] Step 4: Group Management and Export.

[0076] Group creation, users can select colors (<inputtype="color"> After selecting a color, click the "Create Group" button. The backend verifies the color uniqueness, generates a unique ID, and stores it. For XML export, the group path is converted to ASAP_Annotations format, and the Level0 coordinate system (scaleRatio=level0Width / currentLevelWidth) is calculated to generate the coordinates of a closed polygon. For image export, the region is cropped based on the contour bounding box (minX,minY,maxX,maxY), and the backend applies a mask (ImageDraw.polygon) and saves it as a JPEG.

[0077] Step 5: Create the bird's-eye view.

[0078] Initialize by loading the lowest level (level=levels-1) full image with a fixed width of 200px and a height calculated proportionally (canvasHeight=200 / aspectRatio); viewport indicator dynamically calculates the viewport's position in the bird's-eye view based on the current view position and zoom level (viewX=posX*(overviewWidth / currentLevelWidth)) and updates the indicator box using CSStransform.

[0079] The specific equipment and management methods adopted for the digital pathology image processing system provided in this embodiment are as follows: 1. Front-end components.

[0080] The description is divided into two parts: the image container and the control panel. Image container: structure, two Canvases are superimposed (#svsCanvas displays the image, #drawCanvas displays the annotations), aligned using position:absolute; interaction, dragging and scaling are implemented by listening to mousedown, mousemove, and wheel events; canvas penetration is controlled using pointer-events:none.

[0081] Control Panel: Zoom controls, zoomIn, zoomOut, and resetZoom buttons, triggering scale value changes (scale * = 1.2 or 0.8); layer selection.<selectid="levelSelect"> Dynamically loads hierarchy options and recalculates the view position when switching; the directional buttons, panUp, panDown, etc., move the viewport via pan(dx,dy) with a step size of 20% of the viewport size.

[0082] 2. Annotation tools.

[0083] The drawing context uses Canvas2DContext(drawCtx), and sets lineJoin='round' and lineCap='round' to achieve smooth strokes; real-time preview is achieved by dynamically redrawing paths using requestAnimationFrame (redrawPaths), and filtering the rendering based on group visibility (group.visible) and path visibility (path.visible).

[0084] 3. Backend services OpenSlide Integration: Parses SVS files via libopenslide-1.dll, supporting multi-level (level_count) and region reading (read_region); Asynchronous Processing: Uses Flask to asynchronously process / export_region requests, generating masked JPEG images, and providing export status feedback via a progress bar (exportProgressBar).

[0085] The specific technical details adopted are as follows: 1. Multi-level image loading.

[0086] The dimensions of each level are obtained through `OpenSlide.level_dimensions`, and the front-end dynamically calculates the slice range based on `currentLevel`. The "dynamic image resolution switching" feature in this embodiment is supported, implemented using the `levelSelect` control and the `loadImageRegion` method.

[0087] 2. Intelligent labeling and grouping.

[0088] Use a Map structure to store groups, automatically categorize paths by color, and manage the currently active group using `activeGroupId`. Verify the "automatic color-based grouping" function by checking color uniqueness using the `createNewGroup` method.

[0089] 3. Interactive bird's-eye view.

[0090] A fixed-size Canvas renders a full-image thumbnail, dynamically mapping the current viewport position using a viewportIndicator. In this embodiment, the "Global Navigation View" is overridden, and its display / hiding is controlled using the toggleOverview method.

[0091] 4. High-performance export.

[0092] Export requests ( / export_region) are processed using multi-threading, masks are generated via ImageDraw, and JPEG compression optimizes file size. This embodiment supports batch export of annotated images, and supports outline cropping and background compositing.

[0093] Therefore, this embodiment provides a digital pathology image processing method based on OpenSlide, which has the following advantages compared with existing processing methods: Firstly, this method provides an intuitive user interface and rich keyboard shortcut support, enabling users to quickly switch drawing modes (such as free drawing, rectangle, circle, etc.) and complete annotation tasks through simple mouse operations, thereby significantly improving the convenience and efficiency of operation. Simultaneously, this method introduces dynamic preview and real-time adjustment functions, allowing users to view the annotation path in real time when drawing complex contours, and the contour columns and corresponding contours can interact in real time through mouse hover, avoiding confusion.

[0094] Secondly, it supports group management of contours. Each group needs to have an independent group name and color, which can be freely selected using the color picker and eyedropper tools. Contours under a group are managed with a uniform color, making it easy for users to distinguish different groups by color, avoiding clutter and ensuring clarity. At the same time, each group and each contour under each group has an invisible button, so the visibility of each contour can be controlled independently. This allows users to hide or show specific annotation paths as needed during the annotation process. This feature is particularly suitable for scenarios that require staged annotation or step-by-step checking of annotation results. Users can display only the contours that need to be processed at the moment, thus avoiding visual interference.

[0095] Thirdly, it supports fast export of XML and JPEG files. XML is a widely used structured data format that clearly describes the hierarchical structure and attribute information of annotation data. This format facilitates users' rapid parsing and use of this data in subsequent analysis and processing. XML file export is based on all visible contours on the canvas, ensuring the integrity and consistency of the annotation data while enhancing the flexibility of XML export. The saved XML files are downloaded to the browser's default download path, and the filenames can be customized. This design allows users to easily find and manage these files, and users can further adjust the save path through the browser's download manager to meet personalized needs. JPEG file export is done in groups, exporting all visible contours within each group as high-resolution JPEG images. The exported images are automatically generated in the project's exports file under a folder named after the group, with the filename being the contour name. This automated filename and organization method reduces the burden of manual file management for users, improving the efficiency and accuracy of data management. Furthermore, this grouped export method not only facilitates user management and retrieval of exported files but also avoids file clutter and duplication.

[0096] For example, such as Figure 3 As shown, this embodiment also provides a digital pathology image processing method based on OpenSlide, including: Acquire the digital pathology image to be processed; The OpenSlide library is called to parse the pyramid structure of digital pathology images and generate multiple resolution levels. In each resolution level, the loaded image region is dynamically calculated based on the user's slice request command. The loaded image region is rendered using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer. The underlying Canvas loads the dynamically calculated image region in real time, while the annotation layer Canvas renders the annotation path independently. Based on the underlying image of the overlaid annotation layer and the set annotation mode, a closed path is generated; the drawing is performed based on the annotation data corresponding to the closed path, and the annotation data is exported in a common format.

[0097] In this embodiment, the step of calling the OpenSlide library to parse the pyramid structure of digital pathology images and generate multiple resolution levels includes: Digital pathology images undergo data preprocessing and format conversion to obtain SVS files; The OpenSlide library is used to parse the pyramid structure of the SVS file, generating multiple resolution levels, and extracting the thumbnails corresponding to each resolution level.

[0098] In this embodiment, dynamically calculating the loaded image region based on the user-input slice request command across multiple resolution levels includes: In multiple resolution levels, the loaded image region is dynamically calculated based on the slice request command input by the user. The slice request command includes the requested resolution level, viewport position, and scaling ratio, and outputs binary data in image format. The loaded image region is rendered using a dual Canva rendering method to obtain the underlying image with the superimposed annotation layer.

[0099] In this embodiment, the specific process of rendering the loaded image region using the dual Canva rendering method includes: When scaling the loaded image region, the viewport center point is calculated, the scaling level is adjusted according to the scaling factor, and the image boundaries are constrained. When translating the loaded image region, the mouse displacement is converted into an image coordinate system offset, and the new region image data is dynamically loaded to obtain the underlying image of the overlaid annotation layer.

[0100] In this embodiment, a closed path is generated based on the underlying image of the overlaid annotation layer and the set annotation mode; drawing is performed based on the annotation data corresponding to the closed path, and the annotation data is exported in a common format, including: A closed path is generated based on the underlying image of the overlaid annotation layer and the set annotation mode; the annotation mode includes three modes: free drawing, rectangular annotation, and circular annotation. The annotation data of the closed path is mapped to coordinates and stored as the highest level image coordinates in the resolution hierarchy; The drawing is performed based on the annotation data corresponding to the closed path. During the drawing process, the image coordinates are converted into Canvas pixel coordinates so that the annotation position remains unchanged after scaling and translation. Export image coordinates in XML format.

[0101] In this embodiment, after generating the closed path based on the underlying image of the overlaid annotation layer and the set annotation pattern, the method further includes: The generated closed paths are grouped and their withdrawal control is performed as follows: The generated closed paths are managed in groups. Each group includes a unique ID, title, color, and path array corresponding to the closed path. A Map data structure is used to store the groups. Undo control for generated closed paths can delete the last path in a group and trigger a redraw annotation layer command.

[0102] In this embodiment, the processing method further includes: During the export of labeled data, the labeled data of the same group are encapsulated into independent Promise tasks, and the Promise tasks are exported in batches. During batch export, the export progress is presented visually.

[0103] In this embodiment, the processing method further includes: The annotations are redrawn according to the redraw annotation layer command, and the redrawn annotations are within the redraw viewport; WeakMap is used to cache the loaded image region so that the image region that goes out of range is automatically released.

[0104] like Figure 4 As shown, this embodiment also provides a digital pathology image processing system based on OpenSlide, including: an image acquisition module for acquiring the digital pathology image to be processed; an image parsing module for calling the OpenSlide library to parse the pyramid structure of the digital pathology image and generate multiple resolution levels; dynamically calculating the loaded image region according to the slice request command input by the user in multiple resolution levels; rendering the loaded image region using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer; wherein, the underlying Canvas loads the dynamically calculated image region in real time, and the annotation layer Canvas renders the annotation path independently; and an image annotation module for generating closed paths based on the underlying image of the superimposed annotation layer and the set annotation mode; drawing according to the annotation data corresponding to the closed path, and exporting the annotation data in a general format.

[0105] The present invention also provides an electronic device, comprising: a memory for storing a computer program; and a processor for executing the computer program to implement the steps of the OpenSlide-based digital pathology image processing method.

[0106] The present invention also provides a computer program product, including a computer program / instructions that, when executed by a processor, implement the steps of the OpenSlide-based digital pathology image processing method.

[0107] When the processor executes the computer program, it implements the above-mentioned steps for digital pathology image processing based on OpenSlide, such as: acquiring the digital pathology image to be processed; calling the OpenSlide library to parse the pyramid structure of the digital pathology image and generating multiple resolution levels; dynamically calculating the loaded image region according to the slice request instruction input by the user in multiple resolution levels; rendering the loaded image region using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer; wherein, the underlying Canvas loads the dynamically calculated image region in real time, and the annotation layer Canvas renders the annotation path independently; generating a closed path based on the underlying image of the superimposed annotation layer and the set annotation mode; drawing according to the annotation data corresponding to the closed path, and exporting the annotation data in a general format.

[0108] For example, the computer program can be divided into one or more modules / units, which are stored in the memory and executed by the processor to complete the present invention. The one or more modules / units can be a series of computer program instruction segments capable of performing preset functions, the instruction segments describing the execution process of the computer program in the OpenSlide-based digital pathology image processing device. For example, the computer program can be divided into an image acquisition module, an image parsing module, and an image annotation module; the specific functions of each module are as follows: the image acquisition module is used to acquire the digital pathology image to be processed; the image parsing module is used to call the OpenSlide library to parse the pyramid structure of the digital pathology image and generate multiple resolution levels; in the multiple resolution levels, the loaded image region is dynamically calculated according to the slice request instruction input by the user; the loaded image region is rendered using a dual Canvas rendering method to obtain the underlying image of the superimposed annotation layer; wherein, the underlying Canvas loads the dynamically calculated image region in real time, and the annotation layer Canvas independently renders the annotation path; the image annotation module is used to generate a closed path based on the underlying image of the superimposed annotation layer and the set annotation mode; drawing is performed according to the annotation data corresponding to the closed path, and the annotation data is exported in a general format.

[0109] The OpenSlide-based digital pathology image processing device can be a desktop computer, laptop, handheld computer, or cloud server, etc. The OpenSlide-based digital pathology image processing device may include, but is not limited to, a processor and memory. Those skilled in the art will understand that the above examples of OpenSlide-based digital pathology image processing devices do not constitute a limitation on OpenSlide-based digital pathology image processing devices. It may include more components than described above, or combine certain components, or different components. For example, the OpenSlide-based digital pathology image processing device may also include input / output devices, network access devices, buses, etc.

[0110] The processor referred to can be a Central Processing Unit (CPU), or other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor, or any conventional processor. The processor is the control center of the OpenSlide-based digital pathology image processing system, connecting all parts of the OpenSlide-based digital pathology image processing equipment via various interfaces and lines.

[0111] The memory can be used to store the computer program and / or modules. The processor implements various functions of the OpenSlide-based digital pathology image processing device by running or executing the computer program and / or modules stored in the memory and calling the data stored in the memory.

[0112] The memory may primarily include a program storage area and a data storage area. The program storage area may store the operating system and at least one application program required for a function (such as sound playback, image playback, etc.). The data storage area may store data created based on the use of the mobile phone (such as audio data, phonebook, etc.). Furthermore, the memory may include high-speed random access memory, and may also include non-volatile memory, such as hard disks, RAM, plug-in hard disks, SmartMediaCards (SMC), Secure Digital (SD) cards, FlashCards, at least one disk storage device, flash memory device, or other volatile solid-state storage devices.

[0113] The present invention also provides a computer-readable storage medium storing a computer program that, when executed by a processor, implements the steps of the OpenSlide-based digital pathology image processing method.

[0114] If the modules / units integrated in the OpenSlide-based digital pathology image processing system are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium.

[0115] Based on this understanding, the present invention can implement all or part of the processes in the above-described OpenSlide-based digital pathology image processing method, or it can be accomplished by a computer program instructing related hardware. The computer program can be stored in a computer-readable storage medium, and when executed by a processor, it can implement the steps of the above-described OpenSlide-based digital pathology image processing method. The computer program includes computer program code, which can be in the form of source code, object code, executable file, or a preset intermediate form, etc.

[0116] The computer-readable storage medium may include: any entity or device capable of carrying the computer program code, recording media, USB flash drive, portable hard drive, magnetic disk, optical disk, computer memory, read-only memory (ROM), random access memory (RAM), electrical carrier signal, telecommunication signal, and software distribution medium, etc.

[0117] It should be noted that the content contained in the computer-readable storage medium may be appropriately increased or decreased according to the requirements of legislation and patent practice in the jurisdiction. For example, in some jurisdictions, according to legislation and patent practice, the computer-readable storage medium does not include electrical carrier signals and telecommunication signals.

[0118] The above embodiments are merely one of the implementation methods for achieving the technical solution of the present invention. The scope of protection claimed by the present invention is not limited to this embodiment, but also includes any variations, substitutions and other implementation methods that can be easily conceived by those skilled in the art within the scope of the technology disclosed in the present invention.

[0119] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention and not to limit it. Although the present invention has been described in detail with reference to the above embodiments, those skilled in the art should understand that modifications or equivalent substitutions can still be made to the specific implementation of the present invention. Any modifications or equivalent substitutions that do not depart from the spirit and scope of the present invention should be covered within the scope of protection of the claims of the present invention.

Claims

1. A digital pathological image processing method based on OpenSlide, characterized in that, include: Acquire the digital pathology image to be processed; The OpenSlide library is used to parse the pyramid structure of digital pathology images and generate multiple resolution levels. At multiple resolution levels, the loaded image region is dynamically calculated based on the user's input slice request command; A dual Canvas rendering method is used to render the loaded image region to obtain the underlying image of the superimposed annotation layer; wherein, the underlying Canvas loads the dynamically calculated image region in real time, and the annotation layer Canvas renders the annotation path independently. Based on the underlying image of the overlaid annotation layer and the set annotation mode, a closed path is generated; the drawing is performed based on the annotation data corresponding to the closed path, and the annotation data is exported in a common format.

2. The digital pathological image processing method based on OpenSlide according to claim 1, characterized in that, The process involves calling the OpenSlide library to parse the pyramid structure of digital pathology images, generating multiple resolution levels, including: Digital pathology images undergo data preprocessing and format conversion to obtain SVS files; The OpenSlide library is used to parse the pyramid structure of the SVS file, generating multiple resolution levels, and extracting the thumbnails corresponding to each resolution level.

3. The digital pathological image processing method based on OpenSlide according to claim 1, characterized in that, The process of dynamically calculating the loaded image region based on the user-input slice request command across multiple resolution levels includes: In multiple resolution levels, the loaded image region is dynamically calculated based on the slice request command input by the user. The slice request command includes the requested resolution level, viewport position, and scaling ratio, and outputs binary data in image format. The loaded image region is rendered using a dual Canva rendering method to obtain the underlying image with the superimposed annotation layer.

4. The digital pathological image processing method based on OpenSlide according to claim 1, characterized in that, The specific process of rendering the loaded image region using the dual Canva rendering method includes: When scaling the loaded image region, the viewport center point is calculated, the scaling level is adjusted according to the scaling factor, and the image boundaries are constrained. When translating the loaded image region, the mouse displacement is converted into an image coordinate system offset, and the new region image data is dynamically loaded to obtain the underlying image of the overlaid annotation layer.

5. The digital pathological image processing method based on OpenSlide according to claim 1, characterized in that, Based on the underlying image of the overlaid annotation layer and the set annotation pattern, a closed path is generated; Draw the diagram based on the annotation data corresponding to the closed path, and export the annotation data in a common format, including: A closed path is generated based on the underlying image of the overlaid annotation layer and the set annotation mode; the annotation mode includes three modes: free drawing, rectangular annotation, and circular annotation. The annotation data of the closed path is mapped to coordinates and stored as the highest level image coordinates in the resolution hierarchy; The drawing is performed based on the annotation data corresponding to the closed path. During the drawing process, the image coordinates are converted into Canvas pixel coordinates so that the annotation position remains unchanged after scaling and translation. Export image coordinates in XML format.

6. The digital pathological image processing method based on OpenSlide according to claim 1, characterized in that, After generating the closed path based on the underlying image of the overlaid annotation layer and the set annotation pattern, the method further includes: The generated closed paths are grouped and their withdrawal control is performed as follows: The generated closed paths are managed in groups. Each group includes a unique ID, title, color, and path array corresponding to the closed path. A Map data structure is used to store the groups. Undo control for generated closed paths can delete the last path in a group and trigger a redraw annotation layer command.

7. The digital pathological image processing method based on OpenSlide according to claim 6, characterized in that, The processing method further includes: During the export of labeled data, the labeled data of the same group are encapsulated into independent Promise tasks, and the Promise tasks are exported in batches. During batch export, the export progress is presented visually.

8. The digital pathological image processing method based on OpenSlide according to claim 6, characterized in that, The processing method further includes: The annotations are redrawn according to the redraw annotation layer command, and the redrawn annotations are within the redraw viewport; WeakMap is used to cache the loaded image region so that the image region that goes out of range is automatically released.

9. A digital pathology image processing system based on OpenSlide, characterized in that, include: The image acquisition module is used to acquire digital pathological images to be processed; The image parsing module is used to call the OpenSlide library to parse the pyramid structure of digital pathology images and generate multiple resolution levels; At multiple resolution levels, the loaded image region is dynamically calculated based on the user's input slice request command; A dual Canvas rendering method is used to render the loaded image region to obtain the underlying image of the superimposed annotation layer; wherein, the underlying Canvas loads the dynamically calculated image region in real time, and the annotation layer Canvas renders the annotation path independently. The image annotation module is used to generate closed paths based on the underlying image of the overlaid annotation layer and the set annotation mode; to draw according to the annotation data corresponding to the closed paths; and to export the annotation data in a common format.

10. A computer program product comprising a computer program / instructions, characterized in that, When executed by a processor, the computer program / instruction implements the steps of the OpenSlide-based digital pathology image processing method as described in any one of claims 1-8.

Images