new SuperMap.Feature.Theme.Point(data, layer, fields, setting, lonlat)
Name | Type | Description |
---|---|---|
data |
SuperMap.Feature.Vector |
用户数据。 |
layer |
SuperMap.Layer.Graph |
此专题要素所在图层。 |
fields |
Array.<string> |
data 中的参与此图表生成的字段名称。 |
setting |
SuperMap.Feature.Theme.Point.setting |
图表配置对象。 |
lonlat |
SuperMap.LonLat |
可选
专题要素地理位置。默认为 data 指代的地理要素 Bounds 中心。 |
Example
// pointStyleByCodomain 的每个元素是个包含值域信息和与值域对应样式信息的对象,该对象(必须)有三个属性:
// start: 值域值下限(包含);
// end: 值域值上限(不包含);
// style: 数据可视化图形的 style,这个样式对象的可设属性: 。
// pointStyleByCodomain 数组形如:
[
{
start:0,
end:250,
style:{
fillColor:"#00CD00"
}
},
{
start:250,
end:500,
style:{
fillColor:"#00EE00"
}
},
{
start:500,
end:750,
style:{
fillColor:"#00FF7F"
}
},
{
start:750,
end:1500,
style:{
fillColor:"#00FF00"
}
}
]
Extends
Members
-
chartBoundsSuperMap.Bounds
-
图表 Bounds 随着 lonlat、XOffset、YOffset 更新,注意 chartBounds 是图表像素范围,不是地理范围。
-
chartBoxArray.<number>
-
专题要素(图表)区域,即图表框,长度为 4 的一维数组,数组的 4 个元素依次表示图表框左端 x 坐标值、 下端 y坐标值、 右端 x坐标值、 上端 y 坐标值;[left, bottom, right, top]。
-
dataObject
-
用户数据,用于生成可视化 shape,可在子类中规定数据格式或类型,如:<SuperMap.Feature.Vector>。
-
dataValuesArray.<number>
-
图表展示的数据值,通过 fields 从数据 feature 属性中获得。
-
dataViewBoxArray.<number>
-
数据视图框,长度为 4 的一维数组,[left, bottom, right, top]。 dataViewBox 是统计专题要素最核心的内容,它负责解释数据在一个像素区域里的数据可视化含义, 这种含义用可视化图形表达出来,这些表示数据的图形和一些辅助图形组合在一起构成统计专题图表。
-
DVBCenterPointArray.<number>
-
数据视图框中心点,长度为 2 的一维数组,第一个元素表示 x 坐标,第二个元素表示 y 坐标。
-
DVBCodomainArray.<number>
-
数据视图框的内允许展示的数据值域,长度为 2 的一维数组,第一个元素表示值域下限,第二个元素表示值域上限。 dataViewBox 中允许的数据范围,对数据溢出值域范围情况的处理需要在 assembleShapes 中进行。
-
DVBHeightnumber
-
数据视图框高度。
-
DVBOrigonPointArray.<number>
-
数据视图框原点,数据视图框左上角点,长度为 2 的一维数组,第一个元素表示 x 坐标,第二个元素表示 y 坐标。
-
DVBParameterArray.<number>
-
数据视图框参数,长度为 4 的一维数组(数组元素值 >= 0),[leftOffset, bottomOffset, rightOffset, topOffset],chartBox 内偏距值。 此属性用于指定数据视图框 dataViewBox 的范围。
-
DVBUnitValuestring
-
单位值。在 assembleShapes() 中初始化其具体意义,例如:饼图的 DVBUnitValue 可以定义为"360/数据总和", 折线图的 DVBUnitValue 可以定义为 "DVBCodomain/DVBHeight"。
-
DVBWidthnumber
-
数据视图框宽度。
-
fieldsArray.<string>
-
数据{SuperMap.Feature.Vector}属性字段。
-
heightnumber
-
专题要素(图表)高度 。
-
idstring
-
专题要素唯一标识。
-
layerSuperMap.Layer.Theme
-
此专题要素所在专题图层。
-
locationArray
-
专题要素像素参考位置。通常由地理参考位置决定。长度为 2 的数组,第一个元素表示 x 坐标,第二个元素表示 y 坐标。
-
lonlatSuperMap.LonLat
-
专题要素地理参考位置。子类中必须根据用户数据(或地理位置参数)对其赋值。
-
origonPointArray.<number>
-
专题要素(图表)原点,图表左上角点像素坐标,是长度为 2 的一维数组,第一个元素表示 x 坐标,第二个元素表示 y 坐标。
-
origonPointOffsetArray.<number>
-
数据视图框原点相对于图表框的原点偏移量,长度为 2 的一维数组,第一个元素表示 x 偏移量,第二个元素表示 y 偏移量。
-
RelativeCoordinateboolean
-
图形是否已经计算了相对坐标。
-
settingObject
-
图表配置对象,该对象控制着图表的可视化显示。
-
shapeFactorySuperMap.Feature.ShapeFactory
-
内置的图形工厂对象,调用其 createShape 方法创建图形。
-
shapeParametersObject
-
当前图形参数对象,<SuperMap.Feature.ShapeParameters> 的子类对象。
-
shapesArray
-
构成此专题要素的可视化图形对象数组,数组顺序控制渲染。
-
widthnumber
-
专题要素(图表)宽度 。
-
XOffsetnumber
-
专题要素(图表)在 X 方向上的偏移值,单位像素。
-
YOffsetnumber
-
专题要素(图表)在 Y 方向上的偏移值,单位像素。
Methods
-
inherited assembleShapes()
common/overlay/Graph.js, line 417 -
图形装配函数。抽象方法,可视化子类必须实现此方法。
重写此方法的步骤:
1. 图表的某些特殊配置项(setting)处理,例如多数图表模型需要重新指定 dataViewBoxParameter 的默认值。
2. 调用 initBaseParameter() 方法初始化模型属性值,此步骤必须执行,只有当 initBaseParameter 返回 true 时才可以允许进行后续步骤。
3. 计算图形参数,制作图形,图形组合。在组装图表过程中,应该特别注意数据视图框单位值的定义、数据值溢出值域范围的处理和图形大小自适应。
4. 调用 shapesConvertToRelativeCoordinate() 方法,将图形的坐标值转为相对坐标,此步骤必须执行。Example
//子类实现 assembleShapes() 接口的步骤示例: assembleShapes: function(){ // 第一步:图表的某些特殊配置项(setting)处理,例如多数图表模型需要重新指定 dataViewBoxParameter 的默认值。此步骤是非必须过程。 // 图表配置对象 var sets = this.setting; // 默认数据视图框,这里展示在使用坐标轴和不使用坐标轴情况下对数据视图框参数赋予不同的默认值 if(!sets.dataViewBoxParameter){ if(typeof(sets.useAxis) === "undefined" || sets.useAxis){ sets.dataViewBoxParameter = [45, 15, 15, 15]; } else{ sets.dataViewBoxParameter = [5, 5, 5, 5]; } } // 第二步:初始化图表模型基本参数,只有在图表模型基本参数初始化成功时才可模型相关属性,如 this.dataViewBox、 this.DVBCodomain等。此步骤是必须过程。 if(!this.initBaseParameter()) return; // 第三步:用图形组装图表,在组装图表过程中,应该特别注意数据视图框单位值的定义、数据值溢出值域范围的处理和图形大小自适应。 // 定义图表数据视图框中单位值的含义,下面行代码表示将数据视图框单位值定义为数据视图框高度上每像素代表的数据值 this.DVBUnitValue = (this.codomain[1] - this.codomain[0])/this.DVBHeight; var uv = this.DVBUnitValue; // 图形参数计算代码...... // 关于图形装配,实际上就是利用图形工程对象 this.shapeFactory 的 createShape() 方法通过图形参数对象创建可视化的图形对象,并把这些图形对象按序添加到模型的图形库(his.shapes)中。下面的代码演示创建一个面图形参数对象,并允许通过图形配置对象设置图形的 style 和 highlightStyle, var barParams = new SuperMap.Feature.ShapeParameters.Polygon(poiLists); barParams.style = sets.barStyle? sets.barStyle:{fillColor: "lightblue"}; barParams.highlightStyle = sets.barHoverStyle? sets.barHoverStyle:{fillColor: "blue"}; // 图形携带数据ID信息 barParams.refDataID = this.data.id; // 创建图形并添加到图表图形数组中 this.shapes.push(this.shapeFactory.createShape(barParams)); // 第四步:调用 shapesConvertToRelativeCoordinate() 方法,将图形库(his.shapes)中的图形转为由相对坐标表示的图形,客户端统计专题图模块从结构上要求可视化图形使用相对坐标,assembleShapes() 函数必须在图形装配完成后调用 shapesConvertToRelativeCoordinate() 函数。此步骤是必须过程。 this.shapesConvertToRelativeCoordinate(); },
-
calculateXShapeInfo(){Object}
common/overlay/Point.js, line 168 -
计算 X 轴方向上的图形信息,此信息是一个对象,包含两个属性, 属性 xPositions 是一个一维数组,该数组元素表示图形在 x 轴方向上的像素坐标值, 如果图形在 x 方向上有一定宽度,通常取图形在 x 方向上的中心点为图形在 x 方向上的坐标值。 width 表示图形的宽度(特别注意:点的宽度始终为 0,而不是其直径)。 本函数中图形配置对象 setting 可设属性:
xShapeBlank - {Array.} 水平方向上的图形空白间隔参数。 长度为 2 的数组,第一元素表示第折线左端点与数据视图框左端的空白间距,第二个元素表示折线右端点右端与数据视图框右端端的空白间距 。 Returns:
Type Description Object 如果计算失败,返回 null;如果计算成功,返回 X 轴方向上的图形信息,此信息是一个对象,包含以下两个属性:
xPositions - {Array.} 表示图形在 x 轴方向上的像素坐标值,如果图形在 x 方向上有一定宽度,通常取图形在 x 方向上的中心点为图形在 x 方向上的坐标值。 width - {number}表示图形的宽度(特别注意:点的宽度始终为 0,而不是其直径)。 -
inherited constructor(data, layer){SuperMap.Feature.Theme}
common/overlay/feature/Theme.js, line 17 -
构造函数。
Name Type Description data
Object 用户数据,用于生成可视化 shape,必设参数。
layer
SuperMap.Layer.Theme 此专题要素所在图层,必设参数。
Returns:
Type Description SuperMap.Feature.Theme 返回一个专题要素。 -
destroy()
common/overlay/Point.js, line 64 -
销毁此专题要素。调用 destroy 后此对象所以属性置为 null。
-
inherited getLocalXY(lonlat)
common/overlay/Graph.js, line 469 -
地理坐标转为像素坐标。
Name Type Description lonlat
SuperMap.Lonlat 带转换的地理坐标。
Returns:
屏幕像素坐标。 -
inherited initBaseParameter(width, height, codomain, XOffset, YOffset, dataViewBoxParameter, decimalNumber){boolean}
common/overlay/Graph.js, line 241 -
初始化专题要素(图表)基础参数。在调用此方法前,此类的图表模型相关属性都是不可用的 ,此方法在 assembleShapes 函数中调用。 调用此函数关系到 setting 对象的以下属性。
Name Type Description width
number 专题要素(图表)宽度。
height
number 专题要素(图表)高度。
codomain
Array.<number> 值域,长度为 2 的一维数组,第一个元素表示值域下限,第二个元素表示值域上限。
XOffset
number 可选 专题要素(图表)在 X 方向上的偏移值,单位像素。
YOffset
number 可选 专题要素(图表)在 Y 方向上的偏移值,单位像素。
dataViewBoxParameter
Array.<number> 可选 数据视图框 dataViewBox 参数,它是指图表框 chartBox。 (由图表位置、图表宽度、图表高度构成的图表范围框)在左、下,右,上四个方向上的内偏距值。
decimalNumber
number 可选 数据值数组 dataValues 元素值小数位数,数据的小数位处理参数,取值范围:[0, 16]。如果不设置此参数,在取数据值时不对数据做小数位处理。
Returns:
Type Description boolean 初始化参数是否成功。 -
inherited resetLinearGradient()
common/overlay/Graph.js, line 373 -
resetLocation 中调用 图表的相对坐标存在的时候,重新计算渐变的颜色(目前用于二维柱状图渐变色 所以子类实现此方法)。
-
inherited resetLocation(lonlat){Array.<number>}
common/overlay/Graph.js, line 342 -
根据地理位置 lonlat 重置专题要素(图表)位置。
Name Type Description lonlat
SuperMap.LonLat 专题要素新的像素中心位置。
Returns:
Type Description Array.<number> - 新专题要素像素参考位置。长度为 2 的数组,第一个元素表示 x 坐标,第二个元素表示 y 坐标。
-
inherited shapesConvertToRelativeCoordinate()
common/overlay/Graph.js, line 381 -
将(构成图表)图形的节点转为相对坐标表示,此函数必须且只能在 assembleShapes() 结束时调用。
Type Definitions
-
SuperMap.Feature.Theme.Point.settingObject
-
Properties:
Name Type Default Description width
number 专题要素(图表)宽度。
height
number 专题要素(图表)高度。
codomain
Array.<number> 图表允许展示的数据值域,长度为 2 的一维数组,第一个元素表示值域下限,第二个元素表示值域上限。
XOffset
number 可选 专题要素(图表)在 X 方向上的偏移值,单位像素。
YOffset
number 可选 专题要素(图表)在 Y 方向上的偏移值,单位像素。
dataViewBoxParameter
Array.<number> 可选 数据视图框 dataViewBox 参数, 它是指图表框 chartBox (由图表位置、图表宽度、图表高度构成的图表范围框)在左、下,右,上四个方向上的内偏距值。 当使用坐标轴时 dataViewBoxParameter 的默认值为:[45, 15, 15, 15];不使用坐标轴时 dataViewBoxParameter 的默认值为:[5, 5, 5, 5]。
decimalNumber
number 可选 数据值数组 dataValues 元素值小数位数,数据的小数位处理参数,取值范围:[0, 16]。如果不设置此参数,在取数据值时不对数据做小数位处理。
useBackground
boolean 可选 是否使用图表背景框。
backgroundStyle
SuperMap.Feature.ShapeParameters.Rectangle.style 背景样式。
backgroundRadius
Array.<number> [0, 0, 0, 0] 可选 背景框矩形圆角半径,可以用数组分别指定四个角的圆角半径,设:左上、右上、右下、左下角的半径依次为 r1、r2、r3、r4 , 则 backgroundRadius 为 [r1、r2、r3、r4 ]。
xShapeBlank
Array.<number> 水平方向上的图形空白间隔参数。 长度为 2 的数组,第一个元素表示第一个(沿 x 轴方向)图形点与数据视图框左端的空白间距,第二个元素表示最后一个(沿 x 轴方向)图形点与数据视图框右端端的空白间距 。
axisStyle
Object 坐标轴样式。
axisUseArrow
boolean false 可选 坐标轴是否使用箭头。
axisYTick
number 0 可选 y 轴刻度数量。
axisYLabels
Array.<string> 可选 y 轴上的标签组内容,标签顺序沿着数据视图框左面条边自上而下,等距排布。例如:["1000", "750", "500", "250", "0"]。
axisYLabelsStyle
SuperMap.Feature.ShapeParameters.Label.style 可选 y 轴上的标签组样式。
axisYLabelsOffset
Array.<number> 0 可选 y 轴上的标签组偏移量。长度为 2 的数组,数组第一项表示 y 轴标签组横向上的偏移量,向左为正; 数组第二项表示 y 轴标签组纵向上的偏移量,向下为正。
axisXLabels
Array.<string> 可选 x 轴上的标签组内容,标签顺序沿着数据视图框下面条边自左向右排布,例如:["92年", "95年", "99年"]。 标签排布规则:当标签数量与 xShapeInfo 中的属性 xShapeCenter 数量相同(即标签个数与数据个数相等时), 按照 xShapeCenter 提供的位置排布标签, 否则沿数据视图框下面条边等距排布标签。
axisXLabelsStyle
SuperMap.Feature.ShapeParameters.Label.style 可选 x 轴上的标签组样式。
axisXLabelsOffset
Array.<number> 0 可选 x 轴上的标签组偏移量。长度为 2 的数组,数组第一项表示 x 轴标签组横向上的偏移量,向左为正, 数组第二项表示 x 轴标签组纵向上的偏移量,向下为正。
useXReferenceLine
boolean true 可选 是否使用水平参考线,如果为 true,在 axisYTick 大于 0 时有效,水平参考线是 y 轴刻度在数据视图框里的延伸。
xReferenceLineStyle
SuperMap.Feature.ShapeParameters.Line.style 可选 水平参考线样式。
pointStyle
SuperMap.Feature.ShapeParameters.Point.style 可选 点状图中图形点基础 style,此参数控制图形点基础样式,优先级低于 pointStyleByFields 和 pointStyleByCodomain。
pointStyleByFields
Array.<SuperMap.Feature.ShapeParameters.Point.style> 可选 按专题字段 themeFields(<SuperMap.Layer.Graph.themeFields>)为图形点赋 style,此参数按字段控制图形点样式, 优先级低于 pointStyleByCodomain,高于 pointStyle。此数组中的元素是样式对象。 此参数中的 style 与 themeFields 中的字段一一对应 。例如: themeFields(<SuperMap.Layer.Graph.themeFields>) 为 ["POP_1992", "POP_1995", "POP_1999"], pointStyleByFields 为[style1, style2, style3],则在图表中,字段 POP_1992 对应的图形点使用 style1,字段 POP_1995 对应的图形点使用 style2 ,字段 POP_1999 对应的图形点使用 style3。
pointStyleByCodomain
Array.<Object> 按图形点代表的数据值所在值域范围控制图形点样式,优先级高于 pointStyle 和 pointStyleByFields。
pointHoverStyle
Object 可选 图形点 hover 状态时的样式,pointHoverAble 为 true 时有效。
pointHoverAble
Object true 可选 是否允许图形点使用 hover 状态。同时设置 pointHoverAble 和 pointClickAble 为 false,可以直接屏蔽图形点对专题图层事件的响应。
pointClickAble
Object true 可选 是否允许图形点被点击。同时设置 pointHoverAble 和 pointClickAble 为 false,可以直接屏蔽图形点对专题图层事件的响应。