Parameters:
| Name |
Type |
Description |
options |
Object
|
Properties
| Name |
Type |
Description |
id |
String
|
图层id |
data |
Array
|
数据，geojson格式 |
visibility |
Boolean
|
图层默认是否显示 |
legend |
Object
|
图例配置
Properties
| Name |
Type |
Description |
show |
Boolean
|
是否显示图例 |
left |
Number
|
距左边界的距离 |
right |
Number
|
距右边界的距离 |
top |
Number
|
距上边界的距离 |
bottom |
Number
|
距下边界的距离 |
col |
Number
|
图例项的列数 |
itemSize |
Number
|
图例项图形大小 |
symbol |
Number
|
图例项图形样式，可选为：'ring' | 'circle' |
itemColors |
Array
|
图例项图形颜色集 |
backgroundColor |
String
|
背景颜色 |
borderColor |
String
|
边框颜色 |
borderWidth |
Number
|
边框线宽 |
borderRadius |
Number
|
边框圆角 |
shadowColor |
String
|
阴影颜色 |
shadowBlur |
Number
|
阴影模糊度 |
shadowOffsetX |
Number
|
阴影水平偏移量 |
shadowOffsetY |
Number
|
阴影垂直偏移量 |
padding |
Number
|
内边距 |
textStyle |
String
|
文字样式
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 |
|
|
legend_rightop |
Object
|
右上角图例配置
Properties
| Name |
Type |
Description |
show |
Boolean
|
是否显示图例 |
left |
Number
|
距左边界的距离 |
right |
Number
|
距右边界的距离 |
top |
Number
|
距上边界的距离 |
bottom |
Number
|
距下边界的距离 |
col |
Number
|
图例项的列数 |
itemSize |
Number
|
图例项图形大小 |
itemSize_ringBig |
Number
|
图例项标注大号ring的大小 |
itemSize_circle |
Number
|
图例项标注circle的大小 |
itemSize_ringSmall |
Number
|
图例项标注小号ring的大小 |
vLegendLabels |
Number
|
图例项阈值 |
itemWidth |
Number
|
图例项图形大小 |
itemHeight |
Number
|
图例项图形高度 |
backgroundColor |
String
|
背景颜色 |
borderColor |
String
|
边框颜色 |
borderWidth |
Number
|
边框线宽 |
borderRadius |
Number
|
边框圆角 |
shadowColor |
String
|
阴影颜色 |
shadowBlur |
Number
|
阴影模糊度 |
shadowOffsetX |
Number
|
阴影水平偏移量 |
shadowOffsetY |
Number
|
阴影垂直偏移量 |
padding |
Number
|
内边距 |
textStyle |
String
|
文字样式
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 |
|
|
rendererOptions |
Object
|
渲染配置
Properties
| Name |
Type |
Description |
markPoint |
Object
|
标注
Properties
| Name |
Type |
Description |
unactivatedDrawable |
Boolean
|
是否绘制未激活状态的标注，为true时以灰色调进行绘制 |
itemSymbol |
String
|
标注样式，itemSymbol: ["ring", "ring", "circle"] |
symbolSize |
Number
|
标注大小 |
itemStyle |
Object
|
图形样式属性
Properties
| Name |
Type |
Description |
color |
String
|
颜色 |
shadowColor |
String
|
阴影颜色 |
shadowBlur |
Number
|
阴影模糊度 |
shadowOffsetX |
Number
|
阴影偏移量X |
shadowOffsetY |
Number
|
阴影偏移量Y |
|
|
|
|
- Source:
-
View2D/Visuals/Custom/Fluorescence.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/xuzhou.json', function (result) {
var fluorescence = new GeoGlobe.Visuals.Custom.Fluorescence({
id: "fluorescence_1",
data: result.features,
visibility: true,
dragdrawing: true,
legend: {
show: true,
left: 10,
right: null,
top: 10,
bottom: null,
col: 1,
itemSize: 10,
symbol: "ring",
itemColors: ["rgba(0,255,255,0.7)", "rgba(255,215,0,0.7)", "rgba(255,140,0,0.7)", "rgba(127,255,170,0.7)", "rgba(0,255,255,0.7)", "rgba(255,215,0,0.7)", "rgba(255,140,0,0.7)", "rgba(127,255,170,0.7)", "rgba(0,255,255,0.7)", "rgba(255,215,0,0.7)", "rgba(255,140,0,0.7)", "rgba(127,255,170,0.7)", "rgba(0,255,255,0.7)", "rgba(255,215,0,0.7)", "rgba(255,140,0,0.7)", "rgba(127,255,170,0.7)", "rgba(0,255,255,0.7)", "rgba(255,215,0,0.7)", "rgba(255,140,0,0.7)"],
backgroundColor: "rgba(0,0,0,0.5)",
borderColor: "#000",
borderWidth: 1,
borderRadius: 0,
shadowColor: "#fff",
shadowBlur: 5,
shadowOffsetX: 0,
shadowOffsetY: 0,
padding: 5,
textStyle: {
color: "#fff",
fontFamily: "serif",
fontSize: 12,
fontStyle: "normal",
fontWeight: "normal"
}
},
legend_rightop: {
show: true,
left: null,
right: 10,
top: 10,
bottom: null,
col: 3,
itemSize: 10,
itemSize_ringBig: [7, 15],
itemSize_circle: [10, 15, 20, 25],
itemSize_ringSmall: [3, 8],
vLegendLabels: ["<66", "<95", "<99"],
itemWidth: 20,
itemHeight: 50,
backgroundColor: "rgba(0,0,0,0.5)",
borderColor: "#000",
borderWidth: 1,
borderRadius: 0,
shadowColor: "#fff",
shadowBlur: 5,
shadowOffsetX: 0,
shadowOffsetY: 0,
padding: 5,
textStyle: {
color: "#fff",
fontFamily: "serif",
fontSize: 12,
fontStyle: "normal",
fontWeight: "normal"
}
},
rendererOptions: {
markPoint: {
hoverable: true,
itemSymbol: ["ring", "ring", "circle"],
unactivatedDrawable: false,
symbolSize: 20,
effect: {
scaleSize: 3,
period: 30,
show: true
},
itemStyle: {
shadowColor: '#000',
shadowBlur: 0,
shadowOffsetX: 0,
shadowOffsetY: 0,
color: "rgba(0,255,255,0.7)"
}
},
tooltip: {
show: true,
backgroundColor: 'rgba(0,0,0,0.7)',
borderColor: '#333',
borderRadius: 0,
borderWidth: 0,
padding: 5,
textStyle: {
color: "#fff",
fontFamily: 'serif',
fontSize: 12,
fontStyle: 'normal',
fontWeight: 'normal'
}
}
}
});
//添加到可视化定制图层
fluorescence.addTo(custom);
//绘制
custom.render();
});