一种实现图像无损缩放的方法技术

技术编号:24500328 阅读:16 留言:0更新日期:2020-06-13 04:49
本发明专利技术涉及一种实现图像无损缩放的方法,包括如下步骤:1计算第一点和第二点之间的距离,记为L1;2计算所述第三点和所述第四点之间的距离,记录长度L2;3根据长度L1和长度L2计算出缩放因子;4通过缩放因子依次对图形对象的坐标值、线段宽度值进行缩放计算,并重新绘制图像。本发明专利技术通过缩放图形方法可以直观显示不同大小的图形,仿真模拟真实世界,通过缩放图形方法在一个屏幕范围内查看海量图形内容。

A method of image lossless scaling

【技术实现步骤摘要】
一种实现图像无损缩放的方法
本专利技术涉及计算机绘图领域,具体涉及一种基于SVG实现海量图形数据模拟宏观微观世界直观展示的操作方法。
技术介绍
随着计算机技术的发展进入移动设备领域,人机交互的要求越来越高。通过丰富的图形能够直观地、准确地将当前信息呈现在用户眼前,比如图形的绘制显示,一般采用Canvas画板加载jpg,png,gif等非线性像素图形实现解码显示。随着移动设备越来越多地被使用,屏幕的多点触控为图形的直观显示提供了基础,传统的图形方法通过数据输出压缩图片后会丢失精度,无法改变大小,只能很小范围内缩放图形,无法精确增加或移除单个元素,无法高保真显示图形。
技术实现思路
本专利技术的目的在于设计一种实现图像无损缩放的方法,通过极致缩放图形方法可以直观显示不同大小的图形,仿真模拟显示宏观细节和微观结构,通过显示过滤节点在一个手持端屏幕范围内流畅快速地查看海量图形内容。为实现上述目的,本专利技术提供如下技术方案:一种实现图像无损缩放的方法,包括如下步骤:1.通过两手指在设备触控屏幕中任选两点,并获取第一点的坐标和第二点的坐标,通过坐标计算第一点和第二点之间的距离,记为L1;2.通过手指进行屏幕的放大缩小,当移动事件发生时,重新获取此时两手指所处的第三点的坐标和第四点的坐标,计算所述第三点和所述第四点之间的距离,记录长度L2;3.根据长度L1和长度L2计算出缩放因子;4.通过缩放因子依次对图形对象的坐标值、线段宽度值进行缩放计算,并重新绘制图像。<br>进一步的,还包括步骤5,步骤5为过滤显示图像。进一步的,所述触控屏幕中有预先绘制好的图形对象,且所述图像为SVG格式。进一步的,所述设备为智能手机或平板电脑或触屏电脑。通过数据过滤器对SVG单元在显示精度范围内的数据转换为系统图形对象,提交Canvas刷新屏幕显示,极大地提高了屏幕显示速度,降低图形资源占用率。进一步的,所述步骤1和2中,计算两点之间的距离的代码如下:Math.sqrt(Math.pow(Math.abs(x2-x1),2)+Math.pow(Math.abs(y2-y1),2))。进一步的,所述缩放因子通过L2/L1计算得到。其中获取设备屏幕宽度W,高度H;并且在设备竖屏状态下,最大显示数值为H,在设备横屏状态下,最大显示数值为W。上述两种状态状态下,最小显示数值为0.5个像素。当SVG图形长度和宽度属性在显示数值范围内则输出显示,否则过滤不输出。与现有技术相比,本专利技术具有以下有益效果:本专利技术通过极致缩放图形方法可以直观显示不同大小的图形,仿真模拟显示宏观细节和微观结构,通过显示过滤节点在一个手持端屏幕范围内流畅快速地查看海量图形内容。附图说明图1为所述方法的流程图;具体实施方式下面将结合本专利技术实施例中的附图,对本专利技术实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本专利技术一部分实施例,而不是全部的实施例。基于本专利技术中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本专利技术保护的范围。如图1所示,操作者缩放动作开始后,系统根据屏幕多点触控获取第一点的坐标和第二点的坐标,并计算出缩放因子;基于SVG,通过缩放因子依次对SVG图形对象的坐标值、线段宽度值进行缩放计算。计算后的图形大小和缩放因子大小有关,目前基于移动设备64位系统数值范围精度可达2的64次方到2的-64次方。通过数据过滤器对SVG单元在显示精度范围内的数据转换为系统图形对象,提交Canvas刷新屏幕显示,极大地提高了屏幕显示速度,降低图形资源占用率。进一步所述根据第一点的坐标和第二点的坐标,计算所述第一点和所述第二点之间的距离,包括:按下式计算所述距离L:(x1,y1)、(x2,y2)分别为所述第一点和所述第二点的坐标。计算两点距离的代码如下:Math.sqrt(Math.pow(Math.abs(x2-x1),2)+Math.pow(Math.abs(y2-y1),2));显示过滤器显示数值范围计算如下:获取屏幕宽度W,高度H,在移动设备竖屏状态下,最大显示数值为H,在移动设备横屏状态下,最大显示数值为W。上述两种状态下,最小显示数值为0.5个像素。当SVG图形width属性在显示数值范围内则输出显示,否则过滤不输出。如果坐标值是否大于或者小于临界值则忽略该坐标节点,不予显示,如果该坐标值在临界值范围内,则显示。包含IO数据处理模块、节点过滤模块和图形绘制模块。IO数据处理模块包括SVG读取解析模块与SVG写入模块,这两个模块均根据上次用户保存数据进行读取和写入。显示过滤器显示数值范围计算如下:获取屏幕宽度W,高度H,在移动设备竖屏状态下,最大显示数值为H,在移动设备横屏状态下,最大显示数值为W。上述两种状态下,最小显示数值为0.5个像素。当SVG图形width属性在显示数值范围内则输出显示,否则过滤不输出。图形绘制模块包括SVG转Canvas转换模块和图像显示模块。显示模块通过数据节点过滤模块对SVG单元在显示精度范围内的数据转换为系统图形对象,提交Canvas刷新屏幕显示,极大地提高了屏幕显示速度,降低图形资源占用率。缩放处理模块根据操作者缩放动作开始后,系统根据屏幕多点触控获取第一点的坐标和第二点的坐标,并计算出缩放因子;基于SVG,通过缩放因子依次对SVG图形对象的坐标值、线段宽度值进行缩放计算。计算后的图形大小和缩放因子大小有关,目前基于移动设备64位系统数值范围精度可达2的64次方到2的-64次方。节点过滤模块进一步所述根据第一点的坐标和第二点的坐标,计算所述第一点和所述第二点之间的距离,包括:按下式计算所述距离L:(x1,y1)、(x2,y2)分别为所述第一点和所述第二点的坐标。计算两点距离的代码如下:Math.sqrt(Math.pow(Math.abs(x2-x1),2)+Math.pow(Math.abs(y2-y1),2))。尽管已经示出和描述了本专利技术的实施例,对于本领域的普通技术人员而言,可以理解在不脱离本专利技术的原理和精神的情况下可以对这些实施例进行多种变化、修改、替换和变型,本专利技术的范围由所附权利要求及其等同物限定。本文档来自技高网...

【技术保护点】
1.一种实现图像无损缩放的方法,其特征在于,包括如下步骤:/n(1).通过两手指在设备触控屏幕中任选两点,并获取第一点的坐标和第二点的坐标,通过坐标计算第一点和第二点之间的距离,记为L1;/n(2).通过手指进行屏幕的放大缩小,当移动事件发生时,重新获取此时两手指所处的第三点的坐标和第四点的坐标,计算所述第三点和所述第四点之间的距离,记录长度L2;/n(3).根据长度L1和长度L2计算出缩放因子;/n(4).通过缩放因子依次对图形对象的坐标值、线段宽度值进行缩放计算,并重新绘制图像。/n

【技术特征摘要】
1.一种实现图像无损缩放的方法,其特征在于,包括如下步骤:
(1).通过两手指在设备触控屏幕中任选两点,并获取第一点的坐标和第二点的坐标,通过坐标计算第一点和第二点之间的距离,记为L1;
(2).通过手指进行屏幕的放大缩小,当移动事件发生时,重新获取此时两手指所处的第三点的坐标和第四点的坐标,计算所述第三点和所述第四点之间的距离,记录长度L2;
(3).根据长度L1和长度L2计算出缩放因子;
(4).通过缩放因子依次对图形对象的坐标值、线段宽度值进行缩放计算,并重新绘制图像。

...

【专利技术属性】
技术研发人员:俞立全
申请(专利权)人:苏州天鸿嘉汇软件有限公司
类型:发明
国别省市:江苏;32

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1