Interactive Map Rendering via Server-Side Image Generation
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Interactive map user interfaces on the Internet are resource-intensive, leading to high latency and increased demand on client devices' computing and networking resources due to the need to render maps using scripts, canvases, and graphics, which slows down data processing and increases network bandwidth consumption.
Innovation Solution
A system that generates and transmits compressed image files with an index of sub-regions, allowing client devices to present interactive maps efficiently by assigning a unique color to each sub-region, reducing the need for script loading and DOM elements, and providing additional map images in advance for quicker access.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Adaptability or versatility
If scripts, canvases, and graphics are used to generate interactive maps at client devices, then interactivity and functionality are improved, but rendering time and resource consumption increase
Solution Approach 1:
The patent creates simplified copy representations of map data in the form of image files with overlay data structures. Instead of rendering complex canvases and graphics at the client device, the server pre-processes and transmits optimized image copies that retain essential map features and interactivity capabilities through overlay layers, significantly reducing client-side rendering time while preserving functional interactivity.
Solution Approach 2:
The patent extracts the computationally intensive rendering operations from the client device and relocates them to the server. By separating map data into base image files and overlay layers, the complex canvas generation and graphic rendering are performed once on the server, while the client only needs to display pre-rendered images and overlay interactive elements, thereby reducing rendering time at the client device.
2Adaptability or versatility
If scripts, canvases, and DOM elements are loaded onto client devices, then map functionality is improved, but network bandwidth consumption and resource demand increase
Solution Approach 1:
The patent transmits simplified copy representations of map data as image files rather than full scripts, canvases, and DOM elements. These image files with overlay data structures contain essential map information in a compact format, reducing network bandwidth consumption while maintaining core map functionality through server-side pre-processing and optimized data transmission.
Solution Approach 2:
The patent segments map data into separate components: base image files containing static map elements and overlay layers containing interactive data. This segmentation allows the client to receive and display only the essential image data quickly, while interactive functionality is achieved through lightweight overlay processing, thereby reducing overall network bandwidth consumption compared to transmitting complete script and canvas packages.
3Quantity of substance
If compressed image files with sub-region indexes are transmitted, then network bandwidth usage is reduced, but data structure complexity increases
Solution Approach 1:
The patent segments map data into base image files and overlay layers with sub-region indexes. This segmentation organizes complex geographical data into manageable, independently transmittable units. The overlay structure with sub-region indexes allows the server to transmit only relevant portions of map data based on user location and zoom level, reducing network bandwidth usage while the structured overlay format provides a systematic way to manage the complexity of spatial data relationships.
Solution Approach 2:
The patent applies local quality optimization by transmitting different levels of detail for different regions of the map. The overlay data structure enables the server to send high-detail data for currently visible or relevant sub-regions while using compressed or lower-detail representations for less relevant areas. This approach reduces overall network bandwidth consumption by adapting data transmission quality to local user needs, while the structured overlay format systematically manages the varying complexity requirements across different map regions.
Data Source
Figure 1
Figure 2
Figure 3
AI summary
Methods, systems, and apparatus, including computer programs encoded on a computer storage medium, for reducing latency in transmitting and presenting map user interfaces. In one aspect, a method includes receiving, from a client device, a request for presentation of an interactive map user interface that depicts (i) a region and (ii) data related to an account for sub-regions of the region. One or more servers render a map of the region. The server(s) generate an image file representing an image of the rendered map. A different visual characteristic is assigned to each different sub-region. The server(s) configure a user interface of the client device to present (i) the image with each of the different sub-regions being presented according to the different visual characteristics and (ii) account data related to a sub-region when the client device detects a user interaction with the sub-region.