基于地图覆盖物渐变的解决方法技术

技术编号:24012481 阅读:61 留言:0更新日期:2020-05-02 02:13
本发明专利技术公开了一种基于地图覆盖物渐变展示的绘制方法。本发明专利技术采用覆盖物动态加载渲染技术,给出了一种基于原有覆盖物渲染技术,实现颜色渐变的覆盖物渲染绘制方法。其主要特征在于,通过构建通用颜色渐变预定方式(如:svg渐变、canvas渐变、image渐变、以及自定义渐变等),与原有覆盖物渲染颜色进行渲染、合成、覆盖,实现颜色渐变的覆盖物渲染绘制。

Solution based on gradual change of map cover

【技术实现步骤摘要】
基于地图覆盖物渐变的解决方法
本专利技术涉及数据可视化展示领域,尤其涉及一种基于地图覆盖物渐变展示的绘制方法。
技术介绍
因现有地图覆盖物都无法支持覆盖物颜色渐变功能,故本专利技术提供一种覆盖物区域颜色渐变渲染的方法,利于可视化效果展示。
技术实现思路
为了解决上述技术问题,本专利技术通过下述技术方案得以解决:本专利技术提供一种覆盖物区域颜色渐变渲染的方法,包括以下步骤:步骤1:初始化地图以及其所需覆盖物。步骤2:根据生成覆盖物的标签类型(svg、canvas、image等)判断地图覆盖物的呈现方式。步骤3:构建通用颜色渐变预定绘制方式(如:svg渐变、canvas渐变、image渐变以及自定义渐变等)。步骤4:根据生成覆盖物的呈现方式和颜色渐变的预定方式进行匹配,然后进行渲染、合成覆盖物。其中,svg渐变方式绘制方案为:生成线性或放射渐变svg的DOM;canvas渐变方式绘制方案为:根据createLinearGradient函数对需要渐变的DOM对象进行线性或径向渐变;image渐变方式绘制方案为:根据css样式对需要渐变的image对象进行线性或径向渐变;自定义渐变方式绘制方案为:根据待渐变覆盖物区域创建视图单位,对视图单位进行图像识别过滤进行二次确认待渐变覆盖物区域,对处理好的视图单位进行渐变,还原渐变完成的覆盖物区域。本专利技术的附加方面和优点将在下面的描述中部分给出,部分将从下面的描述中变得明显,或通过本专利技术的实践了解到。附图说明此处所说明的附图用来提供对本专利技术的进一步理解,构成本申请的一部分,本专利技术的示意性实施例及其说明用于解释本专利技术,并不构成对本专利技术的不当限定。在附图中:图1为本专利技术实施例公开的地图覆盖物渲染颜色渐变展示的方法的步骤流程图。图2为待渐变的覆盖物区域效果图。图3为已完成渐变的覆盖物区域效果图。具体实施方式为使本专利技术实施例的目的、技术方案和优点更加清楚,下面将结合本专利技术实施例的附图,对本专利技术实施例的技术方案进行清楚、完整地描述。显然,所描述的实施例是本专利技术的一部分实施例,而不是全部的实施例。基于所描述的本专利技术的实施例,本领域普通技术人员在无需创造性劳动的前提下所获得的所有其他实施例,都属于本专利技术保护的范围。步骤1:初始化地图,如百度地图以及其所需覆盖物,其渲染结果如图2所示。步骤2:通过标签类型查找方式找出百度地图呈现覆盖物方式为svg方式呈现。步骤3:构建通用颜色渐变预定绘制方案。步骤4:根据svg呈现方式,在通用颜色渐变预定绘制方案中进行匹配,匹配结果为svg渐变。其中,svg渐变绘制方式为:创建如线性渐变的DOM,赋予DOM属性x1、x2、y1、y2渐变方向和id标识,在渐变DOM中添加开始抵消颜色,以及结束抵消颜色用于颜色渐变渲染。步骤5:地图覆盖物添加svg渐变的id标识完成渐变渲染,其最终渲染效果如图3所示。最后应说明的是:以上实施例仅用以说明本专利技术的技术方案,而非对其限制;尽管参照前述实施例对本专利技术进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本专利技术各实施例技术方案的范围。总之,以上所述仅为本专利技术的较佳实施例,凡依本专利技术申请专利范围所作的均等变化与修饰,皆应属本专利技术专利的涵盖范围。本文档来自技高网...

【技术保护点】
1.基于地图覆盖物渐变的解决方法,用于地图覆盖物渲染颜色渐变展示,其特征在于:包括/n步骤1:初始化地图以及其所需覆盖物;/n步骤2:根据生成覆盖物的标签类型判断地图覆盖物的呈现方式;/n步骤3:构建通用颜色渐变预定绘制方式;/n步骤4:根据生成覆盖物的呈现方式和颜色渐变的预定方式进行匹配,然后进行渲染、合成覆盖物。/n

【技术特征摘要】
1.基于地图覆盖物渐变的解决方法,用于地图覆盖物渲染颜色渐变展示,其特征在于:包括
步骤1:初始化地图以及其所需覆盖物;
步骤2:根据生成覆盖物的标签类型判断地图覆盖物的呈现方式;
步骤3:构建通用颜色渐变预定绘制方式;
步骤4:根据生成覆盖物的呈现方式和颜色渐变的预定方式进行匹...

【专利技术属性】
技术研发人员:梁协君孔彬恒朱建琼汤斯亮蒋建军
申请(专利权)人:杭州有数金融信息服务有限公司
类型:发明
国别省市:浙江;33

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

1