GeoGlobe JS SDK

Class: Voronoi

.Visuals.Custom. Voronoi

泰森多边形图层

new Voronoi(options)

Parameters:
Name Type Description
options Object
Properties
Name Type Description
id String 图层id
data Array 数据，geojson格式
visibility Boolean 图层默认是否显示
boundsURL Object 边界数据url
rendererOptions Object 渲染配置
Properties
Name Type Description
markFace Object 标面
Properties
Name Type Description
nameField String 属性名动态选取，可缺省，缺省使用name属性字段
valueField String 属性值动态选取，可缺省，缺省使用value属性字段
hoverable Boolean 是否启用鼠标悬浮
clickable Boolean 是否启用鼠标点击
itemStyle Object 图形样式属性
Properties
Name Type Description
color String 颜色，支持单色和渐变色
borderColor String 边框颜色
borderWidth Number 边框宽度
shadowColor String 阴影颜色
shadowBlur Number 阴影模糊度
shadowOffsetX Number 阴影偏移量X
shadowOffsetY Number 阴影偏移量Y
tooltip Object 悬浮提示
Properties
Name Type Description
show Boolean 是否显示悬浮提示框
backgroundColor String 背景颜色
borderColor String 边框颜色
borderRadius Number 边框圆角
borderWidth Number 边框宽度
padding Number 内边距
textStyle Object 文字样式
Properties
Name Type Description
color String 颜色
fontFamily String 字体系列
fontSize Number 字号 ，单位px
fontStyle String 样式，可选为：'normal' | 'italic' | 'oblique'
fontWeight String/Number 粗细，可选为：'normal' | 'bold' | 'bolder' | 'lighter' | 100 | 200 |... | 900
Author:
  • kz
Source:
View2D/Visuals/Custom/Voronoi.js
Example
//构造地图对象
 var map = new GeoGlobe.Map({
    style: Cfg.style,
    container: 'map',
    zoom: 16,
    bearing: 0,
	pitch: 0,
    units: "degrees",
    center: [114.20509630753577, 30.776055193053764]
 });
 //构造可视化定制图层
 var custom = new GeoGlobe.Visuals.Custom();
 //添加到地图中
 custom.addTo(map);
 //通过jquery加载json数据
 $.getJSON('../../data/capital.json', function (result) {
    //构造泰森多边形图层
    var voronoi = new GeoGlobe.Visuals.Custom.Voronoi({
        id: "voronoi_1",
        data: result,
        visibility: true,
        boundsURL: "../../data/china.json",
        rendererOptions: {
            markFace: {
                itemStyle: {
                    color: {
                        '0': 'rgba(255, 0, 0, 0.3)',
                        '0.5': 'rgba(255, 128, 0, 0.3)',
                        '1': 'rgba(255, 255, 128, 0.3)'
                    },//'rgba(255,0,0,0)',
                    borderColor: 'rgba(255,255,255,0.5)'
                }
            }
        }
    });
    //添加到可视化定制图层
    voronoi.addTo(custom);
    //绘制
    custom.render();
 });

Members

cacheCanvas :Array

离屏画布集合
Type:
  • Array
Source:
View2D/Visuals/Custom/Voronoi.js

cacheCanvasContext :Array

离屏画布的上下文集合
Type:
  • Array
Source:
View2D/Visuals/Custom/Voronoi.js

canvas :Array

画布集合，使用分层画布分别绘制
Type:
  • Array
Source:
View2D/Visuals/Custom/Voronoi.js

canvasContext :Array

画布的上下文集合
Type:
  • Array
Source:
View2D/Visuals/Custom/Voronoi.js

canvasContext :Array

画布的上下文集合
Type:
  • Array
Source:
View2D/Visuals/Grid/Typhoon.js

MarkFace :function

标面类
Type:
  • function
Source:
View2D/Visuals/Custom/Voronoi.js

markFaces :Array

标面对象集
Type:
  • Array
Source:
View2D/Visuals/Custom/Voronoi.js

visibility :Boolean

图层默认是否显示
Type:
  • Boolean
Source:
View2D/Visuals/Custom/Voronoi.js

Methods

addTo(custom)

关联可视化定制图层对象
Parameters:
Name Type Description
custom GeoGlobe.Visuals.Custom
Source:
View2D/Visuals/Custom/Voronoi.js

clearCanvas()

画布清空
Source:
View2D/Visuals/Custom/Voronoi.js

destroy()

销毁图层
Source:
View2D/Visuals/Custom/Voronoi.js

draw()

图层绘制
Source:
View2D/Visuals/Custom/Voronoi.js

drawCanvas()

将标面绘制到画布
Source:
View2D/Visuals/Custom/Voronoi.js

getVoronoi(points)

使用turf.js框架生成泰森多边形
Parameters:
Name Type Description
points Object
Source:
View2D/Visuals/Custom/Voronoi.js
Returns:
voronoi 泰森多边形顶点数据
Type
Object

hideTooltip()

关闭悬浮提示
Source:
View2D/Visuals/Custom/Voronoi.js

hover(x, y)

鼠标悬浮时触发
Parameters:
Name Type Description
x Number 鼠标在主画布上的位置（x轴方向）
y Number 鼠标在主画布上的位置（y轴方向）
Source:
View2D/Visuals/Custom/Voronoi.js

onClick(event)

鼠标指针单击事件
Parameters:
Name Type Description
event Object 事件参数
Source:
View2D/Visuals/Custom/Voronoi.js

onMouseMove(event)

鼠标指针悬停事件
Parameters:
Name Type Description
event Object 事件参数
Source:
View2D/Visuals/Custom/Voronoi.js

onMove()

图层（地图）移动时触发
Source:
View2D/Visuals/Custom/Voronoi.js

onMoveEnd()

图层（地图）移动结束触发
Source:
View2D/Visuals/Custom/Voronoi.js

onResize()

图层自适应
Source:
View2D/Visuals/Custom/Voronoi.js

redraw()

图层重绘
Source:
View2D/Visuals/Custom/Voronoi.js

render()

渲染图层
Source:
View2D/Visuals/Custom/Voronoi.js

setData(data)

数据的处理，构造标注对象
Parameters:
Name Type Description
data Array 数据
Source:
View2D/Visuals/Custom/Voronoi.js

setVisible(visibility)

图层的显示与隐藏
Parameters:
Name Type Description
visibility Boolean 可见性
Source:
View2D/Visuals/Custom/Voronoi.js

stopDraw()

停止绘制
Source:
View2D/Visuals/Custom/Voronoi.js

updateXY()

重新计算标面的屏幕坐标
Source:
View2D/Visuals/Custom/Voronoi.js