web端的图片处理方法、装置、系统及存储介质制造方法及图纸

本发明专利技术公开了一种web端的图片处理方法、装置、系统及存储介质，本发明专利技术提供的web端的图片处理方法通过获取待处理网页数据；将所述待处理网页数据进行切图以生成待处理图片；根据所述待处理图片，响应用户输入第一尺寸信息的指令，获取所述指令对应的第一尺寸信息；根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。使得用户需要指定尺寸图片时，可以直接将该网页进行下载，并对该网页中的图片可以直接处理，提高了网页设计的效率和质量。

Image processing methods, devices, systems and storage media on the web

The invention discloses a picture processing method, device, system and storage medium at the web end. The picture processing method at the web end provided by the invention obtains the web page data to be processed, cuts the web page data to be processed to generate the picture to be processed, and according to the picture to be processed, responds to the user's instruction of inputting the first dimension information to obtain the first corresponding to the instruction Size information; according to the first size information, the second size information of the image to be processed is calculated based on preset rules to generate the image to be downloaded. When users need to specify the size of the picture, they can download the web page directly, and the picture in the web page can be processed directly, which improves the efficiency and quality of web page design.

【技术实现步骤摘要】
web端的图片处理方法、装置、系统及存储介质
本专利技术涉及图片处理
，具体涉及一种web端的图片处理方法、装置、系统及存储介质。
技术介绍
网页设计是通过使用更合理的颜色、字体、图片、样式进行页面设计美化，在功能限定的情况下，尽可能给予用户完美的视觉体验。高级的网页设计甚至会考虑到通过声光、交互等来实现更好的视听感受。在网站上显示图片是很常见的，但大部分网站，只会对图片的css样式做出调整，用户在下载到本地时还是原图，用户需要指定尺寸图片时，需要将图片进行一一下载，并且还需要另外用图片编辑软件进行处理，并且处理的图片质量比较差。
技术实现思路
本专利技术的主要目的是提供一种web端的图片处理方法、装置、系统及存储介质，以解决相关技术中不能够直接通过web端进行网页设计的图片编辑的问题。为实现上述目的，本专利技术提供了一种web端的图片处理方法，包括：获取待处理网页数据；将所述待处理网页数据进行切图以生成待处理图片；根据所述待处理图片，响应用户输入第一尺寸信息的指令，获取所述指令对应的第一尺寸信息；根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。优选地，所述获取待处理网页数据之前包括：基于Canvas元素，将图片载入所述Canvas元素中；当所述图片载入完成时，将所述图片显示于所述Canvas元素上；根据显示有图片的所述Canvas元素确定为待处理网页数据。优选地，所述将所述待处理网页数据进行切图以生成待处理图片，包括：根据所述待处理网页数据，响应用户选定的切图区域；根据所述切图区域确定出所述待处理图片。优选地，所述根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片，包括：根据所述第一尺寸信息，响应用户对所述待处理图片选择的填充模式指令；根据所述填充模式指令以确定填充模式；根据确定的所述填充模式对所述第二尺寸信息进行分辨率换算，以生成待下载图片。优选地，所述填充模式为居中模式；所述根据确定的所述填充模式对所述第二尺寸信息进行分辨率换算，以生成待下载图片，包括：根据所述第一尺寸信息以所述分辨率换算规则生成所述第二尺寸信息；判断所述第一尺寸信息与所述第二尺寸信息是否大于确定所述待处理图片的尺寸信息；当大于时，对所述待处理图片尺寸居中定位并分配边界框，将所述边界框进行填充处理，以生成待下载图片；其中，所述边界框尺寸为所述第一尺寸信息与所述第二尺寸信息。优选地，所述填充模式为拉伸模式，所述根据确定的所述填充模式对所述第二尺寸信息进行分辨率换算，以生成待下载图片，还包括：根据所述第一尺寸信息以所述分辨率换算规则生成所述第二尺寸信息；判断所述第一尺寸信息与所述第二尺寸信息是否大于确定所述待处理图片的尺寸信息；当大于时，将所述待处理图片尺寸拉伸至为所述第一尺寸信息与所述第二尺寸信息，并生成待下载图片。本专利技术还提供了一种web端的图片处理装置，包括：第一获取模块，用于获取待处理网页数据；切图模块，用于将所述待处理网页数据进行切图以生成待处理图片；响应模块，用于根据所述待处理图片，响应用户输入第一尺寸信息的指令；第二获取模块，用于获取所述指令对应的第一尺寸信息；计算模块，用于根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。优选地，所述装置还包括：载入模块，用于基于Canvas元素，将图片载入所述Canvas元素中；显示模块，用于当所述图片载入完成时，将所述图片显示于所述Canvas元素上；确定模块，用于根据显示有图片的所述Canvas元素确定为待处理网页数据。本专利技术还提供了一种web端的图片处理系统，包括存储器、处理器以及存储在所述存储器中并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现如上所述的web端的图片处理方法的步骤。本专利技术还提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现如上所述的web端的图片处理方法的步骤。本专利技术提供的web端的图片处理方法，通过获取待处理网页数据；将所述待处理网页数据进行切图以生成待处理图片；根据所述待处理图片，响应用户输入第一尺寸信息的指令，获取所述指令对应的第一尺寸信息；根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。使得用户需要指定尺寸图片时，可以直接将该网页进行下载，并对该网页中的图片可以直接处理，提高了网页设计的效率和质量。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图示出的结构获得其他的附图。图1是本专利技术实施例提供的web端的图片处理方法的流程图；图2是本专利技术实施例提供的web端的图片处理方法的另一流程图；图3是图1所示的步骤S40的具体流程图；图4是本专利技术实施例提供的web端的图片处理装置的结构示意图；图5是本专利技术实施例提供的web端的图片处理装置的另一结构示意图；图6是本专利技术实施例提供的web端的图片处理系统的结构示意图；本专利技术目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。具体实施方式下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术的一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。本专利技术的说明书和权利要求书及上述附图中的术语“第一”、“第二”和“第三”等是用于区别不同对象，而非用于描述特定顺序。此外，术语“包括”以及它们任何变形，意图在于覆盖不排他的包含。例如包含了一系列步骤或单元的过程、方法、系统、产品或设备没有限定于已列出的步骤或单元，而是可选地还包括没有列出的步骤或单元，或可选地还包括对于这些过程、方法、产品或设备固有的其它步骤或单元。参照图1所示，本专利技术提供了一种web端的图片处理方法，包括：S10、获取待处理网页数据。在本专利技术的实施例中，在进行网页设计时，会采用不同的图片进行页面的设计和美化，因此，当需要某一张图片时，可以直接将网页数据进行下载，由此，使得该网页数据能够在断开网络时也可以进行图片处理，通过将该下载的网页数据导入，并从该网页数据中选择需要的图片以进行网页设计。参照图2所示，获取待处理网页数据之前包括：步骤10，基于Canvas元素，本文档来自技高网...

【技术保护点】
1.一种web端的图片处理方法，其特征在于，包括：/n获取待处理网页数据；/n将所述待处理网页数据进行切图以生成待处理图片；/n根据所述待处理图片，响应用户输入第一尺寸信息的指令，获取所述指令对应的第一尺寸信息；/n根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。/n

【技术特征摘要】
1.一种web端的图片处理方法，其特征在于，包括：
获取待处理网页数据；
将所述待处理网页数据进行切图以生成待处理图片；
根据所述待处理图片，响应用户输入第一尺寸信息的指令，获取所述指令对应的第一尺寸信息；
根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片。


2.根据权利要求1所述的web端的图片处理方法，其特征在于，所述获取待处理网页数据之前包括：
基于Canvas元素，将图片载入所述Canvas元素中；
当所述图片载入完成时，将所述图片显示于所述Canvas元素上；
根据显示有图片的所述Canvas元素确定为所述待处理网页数据。


3.根据权利要求1所述的web端的图片处理方法，其特征在于，所述将所述待处理网页数据进行切图以生成待处理图片，包括：
根据所述待处理网页数据，响应用户选定的切图区域；
根据所述切图区域确定出所述待处理图片。


4.根据权利要求1所述的web端的图片处理方法，其特征在于，所述预设规则为分辨率换算规则；
所述根据所述第一尺寸信息，基于预设规则计算所述待处理图片的第二尺寸信息，以生成待下载图片，包括：
根据所述第一尺寸信息，响应用户对所述待处理图片选择的填充模式指令；
根据所述填充模式指令以确定填充模式；
根据确定的所述填充模式对所述第二尺寸信息进行分辨率换算，以生成待下载图片。


5.根据权利要求4所述的web端的图片处理方法，其特征在于，所述填充模式为居中模式；
所述根据确定的所述填充模式对所述第二尺寸信息进行分辨率换算，以生成待下载图片，包括：
根据所述第一尺寸信息以所述分辨率换算规则生成所述第二尺寸信息；
判断所述第一尺寸信息与所述第二尺寸信息是否大于确定所述待处理图片的尺寸信息；
当大于时，对所述待处理图片尺寸居中定位并分配边界框，将所述边界框进行填充处理...

【专利技术属性】
技术研发人员：刘松，杨思柏，孟小江，
申请(专利权)人：成都摹客科技有限公司，
类型：发明
国别省市：四川;51