一种电子地图中的海量点展示方法及装置制造方法及图纸

本发明专利技术实施例提供了一种电子地图中的海量点展示方法及装置。该方法包括：接收目标海量点中每一兴趣点的点位数据，其中，点位数据至少包括经纬度信息；根据目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标；调整预先创建的Canvas元素的第一尺寸和第一文档坐标，以使得Canvas元素和电子地图的地图容器重合；利用Canvas元素，根据每一兴趣点的目标文档坐标，在Canvas元素所属图层上绘制目标海量点中的每一兴趣点，从而显示为在电子地图中展示目标海量点。通过该技术方案，能够展示海量点中所关注的所有兴趣点，并提高浏览器的性能。

【技术实现步骤摘要】
一种电子地图中的海量点展示方法及装置
本专利技术涉及互联网
，特别是涉及一种电子地图中的海量点展示方法及装置。
技术介绍
当前，WebGIS(网络地理信息系统)已得到广泛应用，几乎涉猎了包括交通运输、区域规划、军事技侦、商业金融、电力水利等在内的所有领域；而其应用方式也多种多样，包括地理定位、路线规划、位置查询、实景展示、实时交通等。在某些应用场景，如共享单车后台监控系统，需要对海量的共享单车做实时监控，那么，便需在电子地图中展示所有共享单车抽象而成的兴趣点；又如某些LBS(LocationBasedService,基于位置的服务)系统，需要在电子地图中展示一个地区的所有基站抽象而成的兴趣点。鉴于此，在这些类似的应用场景中，往往需要在电子地图上展示成百上千，甚至上万级别的兴趣点；其中，可以看出根据应用场景不同，需要展示的兴趣点对应的是所关注的至少一种类型的物理对象，而不是泛指任一可以抽象为点的物理对象。传统的基于DIV+CSS(DIVision，层叠样式表单元的位置和层次，CascadingStyleSheets，层叠样式表)或SVG(ScalableVectorGraphics，可缩放矢量图形)等技术来展示电子地图中兴趣点的方式，采用的是单对单渲染：即一个兴趣点渲染一个HTML(HyperTextMarkupLanguage，超文本标记语言)的节点，当兴趣点规模达到一定量级时，这种实现方式会因为节点数过多，而使得浏览器出现卡顿、延迟、甚至崩溃等现象，严重降低浏览器的性能。针对上述情况，现有技术中，一般通过点聚合的方法来进行处理。具体地，按照既定的策略，当电子地图缩放到一定级别后，预设范围内的兴趣点会聚合成一个点，而当放大电子地图时，这个聚合点则会再分解成若干个具体的兴趣点或者子聚合点。但应用这种方法，当海量点中地理距离非常近的兴趣点聚合成一个点后，即使将电子地图放大到最大级别，这些兴趣点仍可能聚合到一起，无法分解成单个的兴趣点，使得用户无法关注到具体的单个兴趣点；举例而言，在共享单车后台监控系统的应用场景中，每一辆单车在电子地图中都对应一个兴趣点，若应用现有的点聚合方法进行展示，则当有多辆单车停放在一起时，在监控系统的电子地图中展示的只是一个聚合的点，而无法将这些距离非常近的每辆单车都对应为兴趣点都展示出来；但实际应用中，共享单车后台监控系统关注的恰恰是每辆单车对应的兴趣点。这种情况下，为了展示所关注的所有单车即所有兴趣点，只能采用现有的单对单渲染方式，而单对单的渲染方式，无疑会严重降低浏览器的性能。可见，在现有技术中，要么无法展示海量点中所关注的所有兴趣点，而要展示所有兴趣点就会严重降低浏览器的性能，甚至导致浏览器崩溃。
技术实现思路
本专利技术实施例的目的在于提供一种电子地图中的海量点展示方法及装置，以展示海量点中所关注的所有兴趣点，并提高浏览器的性能。具体技术方案如下：第一方面，本专利技术实施例提供了一种电子地图中的海量点展示方法，所述方法包括：接收目标海量点中每一兴趣点的点位数据；其中，所述点位数据至少包括经纬度信息；根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标；调整预先创建的Canvas元素的第一尺寸和第一文档坐标，以使得所述Canvas元素和所述电子地图的地图容器重合；其中，所述Canvas元素所属图层在所述电子地图所属图层之上，且所述Canvas元素为透明的；利用所述Canvas元素，根据每一兴趣点的所述目标文档坐标，在所述Canvas元素所属图层上绘制所述目标海量点中的每一兴趣点，从而显示为在所述电子地图中展示所述目标海量点。可选地，所述调整预先创建的Canvas元素的第一尺寸和第一文档坐标的步骤，包括：获取所述电子地图的地图容器的第二尺寸和第二文档坐标；将预先创建的Canvas元素的尺寸属性值设置为所述第二尺寸，并调整所述Canvas元素的坐标属性值，以使得所述Canvas元素的第一文档坐标与所述第二文档坐标相同。可选地，当监测到所述电子地图变换事件后，所述方法还包括：根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在所述目标网页文档中的当前文档坐标；利用所述Canvas元素，根据每一兴趣点的所述当前文档坐标，在所述Canvas元素所属图层上重新绘制所述目标海量点中的每一兴趣点。可选地，所述变换事件为平移事件、拖动事件或缩放事件；当所述变换事件为平移事件或拖动事件时，在所述在所述Canvas元素所属图层上重新绘制所述目标海量点中的每一兴趣点的步骤之前，还包括：获取所述地图容器的第三文档坐标；调整所述Canvas元素的第一文档坐标为所述第三文档坐标。可选地，所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤，包括：将所述目标海量点中每一兴趣点的经纬度信息，转换成地图窗口坐标；获取电子地图的地图容器在所述电子地图所属的目标网页文档中的第四文档坐标；将每一兴趣点的地图窗口坐标分别与所述第四文档坐标的和，确定为每一兴趣点在所述目标网页文档中的目标文档坐标。可选地，在所述接收目标海量点中每一兴趣点的点位数据的步骤之后，所述方法还包括：判断所述目标海量点中每一兴趣点的经纬度信息是否符合预设数据格式；若是，再执行所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤；若否，先转换所述目标海量点中每一兴趣点的经纬度信息的数据格式，获得符合所述预设数据格式的经纬度信息；再执行所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤。可选地，本专利技术实施例提供的一种电子地图中的海量点展示方法，还包括：在所述目标网页文档中创建目标DIV元素，将所述Canvas元素添加到所述目标DIV元素中；当所述目标DIV元素的第三尺寸和第五文档坐标变化时，以变化后的第三尺寸和第五文档坐标分别更新所述Canvas元素的第一尺寸和第一文档坐标；并将所述目标DIV元素所属图层插入到所述电子地图所属图层之上；所述调整预先创建的Canvas元素的第一尺寸和第一文档坐标的步骤包括：调整所述目标DIV元素的第三尺寸和第五文档坐标。可选地，所述目标DIV元素和所述Canvas元素均挂载在所述电子地图对应的地图对象上。可选地，本专利技术实施例提供的一种电子地图中的海量点展示方法，还包括：当监测到位置触发指令时，存储触发位置对应的目标兴趣点的点位数据；其中，所述位置触发指令表明所述触发位置位于包含目标兴趣点在内的指定区域；当监测到目标操作指令时，提取已存储的所述目标兴趣点的点位数据，并对所述目标兴趣点的点位数据执行所述目标操作指令对应的操作。第二方面，本专利技术实施例提供了一种电子地图中的海量点展示装置，所述装置包括：接收模块，用于接收目标海量点中每一兴趣点的点位数据；其中，所述点位数据至少包括经纬度信息；第一获得模块，用于根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标；第一调整模块，用于调整预先创建的Canvas元素的第一尺寸和第一文档坐标，以使本文档来自技高网...

【技术保护点】
1.一种电子地图中的海量点展示方法，其特征在于，所述方法包括：接收目标海量点中每一兴趣点的点位数据；其中，所述点位数据至少包括经纬度信息；根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标；调整预先创建的Canvas元素的第一尺寸和第一文档坐标，以使得所述Canvas元素和所述电子地图的地图容器重合；其中，所述Canvas元素所属图层在所述电子地图所属图层之上，且所述Canvas元素为透明的；利用所述Canvas元素，根据每一兴趣点的所述目标文档坐标，在所述Canvas元素所属图层上绘制所述目标海量点中的每一兴趣点，从而显示为在所述电子地图中展示所述目标海量点。

【技术特征摘要】
1.一种电子地图中的海量点展示方法，其特征在于，所述方法包括：接收目标海量点中每一兴趣点的点位数据；其中，所述点位数据至少包括经纬度信息；根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标；调整预先创建的Canvas元素的第一尺寸和第一文档坐标，以使得所述Canvas元素和所述电子地图的地图容器重合；其中，所述Canvas元素所属图层在所述电子地图所属图层之上，且所述Canvas元素为透明的；利用所述Canvas元素，根据每一兴趣点的所述目标文档坐标，在所述Canvas元素所属图层上绘制所述目标海量点中的每一兴趣点，从而显示为在所述电子地图中展示所述目标海量点。2.根据权利要求1所述的方法，其特征在于，所述调整预先创建的Canvas元素的第一尺寸和第一文档坐标的步骤，包括：获取所述电子地图的地图容器的第二尺寸和第二文档坐标；将预先创建的Canvas元素的尺寸属性值设置为所述第二尺寸；并调整所述Canvas元素的坐标属性值，以使得所述Canvas元素的第一文档坐标与所述第二文档坐标相同。3.根据权利要求1所述的方法，其特征在于，当监测到电子地图变换事件后，所述方法还包括：根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在所述目标网页文档中的当前文档坐标；利用所述Canvas元素，根据每一兴趣点的所述当前文档坐标，在所述Canvas元素所属图层上重新绘制所述目标海量点中的每一兴趣点。4.根据权利要求3所述的方法，其特征在于，所述电子地图变换事件为平移事件、拖动事件或缩放事件；当所述变换事件为平移事件或拖动事件时，在所述在所述Canvas元素所属图层上重新绘制所述目标海量点中的每一兴趣点的步骤之前，还包括：获取所述地图容器的第三文档坐标；调整所述Canvas元素的第一文档坐标为所述第三文档坐标。5.根据权利要求1所述的方法，其特征在于，所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤，包括：将所述目标海量点中每一兴趣点的经纬度信息，转换成地图窗口坐标；获取电子地图的地图容器在所述电子地图所属的目标网页文档中的第四文档坐标；将每一兴趣点的地图窗口坐标分别与所述第四文档坐标的和，确定为每一兴趣点在所述目标网页文档中的目标文档坐标。6.根据权利要求1所述的方法，其特征在于，在所述接收目标海量点中每一兴趣点的点位数据的步骤之后，所述方法还包括：判断所述目标海量点中每一兴趣点的经纬度信息是否符合预设数据格式；若是，再执行所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤；若否，先转换所述目标海量点中每一兴趣点的经纬度信息的数据格式，获得符合所述预设数据格式的经纬度信息；再执行所述根据所述目标海量点中每一兴趣点的经纬度信息，获得每一兴趣点在电子地图所属的目标网页文档中的目标文档坐标的步骤。7.根据权利要求1所述的方法，其特征在于，所述方法还包括：在所述目标网页文档中创建目标DIV元素，将所述Canvas元素添加到所述目标DIV元素中；当所述目标DIV元素的第三尺寸和第五文档坐标变化时，以变化后的第三尺寸和第五文档坐标分别更新所述Canvas元素的第一尺寸和第一文档坐标；并将所述目标DIV元素所属图层插入到所述电子地图所属图层之上；所述调整预先创建的Canvas元素的第一尺寸和第一文档坐标的步骤包括：调整所述目标DIV元素的第三尺寸和第五文档坐标。8.根据权利要求7所述的方法，其特征在于，所述目标DIV元素和所述Canvas元素均挂载在所述电子地图对应的地图对象上。9.根据权利要求1至8任一项所述的方法，其特征在于，所述方法还包括：当监测到位置触发指令时，存储触发位置对应的目标兴趣点的点位数据；其中，所述位置触发指令表明所述触发位置位于包含目标兴趣点在内的指定区域；当监测到目标操作指令时，提取已存储的所述目标兴趣点的点位数据，对所述目标兴趣点的点位数据执行所述目标操作指令对应的操作。10.一种电子地...

【专利技术属性】
技术研发人员：李传庆，
申请(专利权)人：北京金山云网络技术有限公司，北京金山云科技有限公司，
类型：发明
国别省市：北京,11