
new sg.renderers.ScaleDependentRenderer(param)
Description
Create a ScaleDependentRenderer object.
Position
Randerer.js
Parameters
Parameter
|
Type
|
Description
|
param
|
Object
|
set object
Name
|
Type
|
Description
|
rendererInfos
|
Array.<Object>
|
An array of objects. Each objects defines a renderer and the scale at which it applies.
|
|
Properties
Properties
|
Type
|
Description
|
defaultSymbol
|
Object
|
default symbol
|
rendererInfos
|
sg.symbols.Symbol
|
array of renderers
|
colorInfo
|
Array.<rendererInfo>
|
symbol color settings
Name
|
Type
|
Description
|
minValue
|
Number
|
minimum value
|
maxValue
|
Number
|
maximum value
|
field
|
String
|
The field name which you want to use for ScaleDependentRenderer
|
colors
|
Array.<sg.Color>
|
An array of objects defines the color
|
|
opacityInfo
|
Object
|
symbol opacity settings
Name
|
Type
|
Description
|
minValue
|
Number
|
minimum value
|
maxValue
|
Number
|
maximum value
|
field
|
String
|
The field name which you want to use for ScaleDependentRenderer
|
opacityValues
|
Array.<Number>
|
An array of objects defines the opacity
|
|
rotationInfo
|
Object
|
symbol rotation settings:
Name
|
Type
|
Description
|
type
|
String
|
geographic(rotates clockwise from North) or arithmetic (rotates counter-clockwise from East)
|
field
|
String
|
The field name which you want to use for ScaleDependentRenderer
|
|
sizeInfo
|
Object
|
symbol size settings:
Name
|
Type
|
Description
|
minSize
|
Number
|
minimum size
|
maxSize
|
Number
|
maximum size
|
field
|
String
|
The field name which you want to use for ScaleDependentRenderer
|
|
Methods
Methods
|
Type
|
Description
|
getColor(graphic)
|
graphic:sg.Graphic
Returns:sg.Color
|
Return symbol color
Name
|
Type
|
Description
|
graphic
|
sg.Graphic
|
Graphic to get color from.
|
Returns:
Type
|
Description
|
sg.Color
|
The color of the specific graphic
|
|
getOpacity(graphic)
|
graphic:sg.Graphic
Returns:Number
|
Return symbol transparency
Name
|
Type
|
Description
|
graphic
|
sg.Graphic
|
Graphic
|
Returns:
Type
|
Description
|
Number
|
The opacity of the specific graphic
|
|
getRotationAngle(graphic)
|
graphic:sg.Graphic
Returns:Number
|
Return symbol rotation angle
Name
|
Type
|
Description
|
graphic
|
sg.Graphic
|
Graphic
|
Returns:
Type
|
Description
|
Number
|
The angle of the rotation of the specific graphic
|
|
getSize(graphic)
|
graphic:sg.Graphic
Returns:Number
|
Return symbol size
Name
|
Type
|
Description
|
graphic
|
sg.Graphic
|
Graphic
|
Returns:
Type
|
Description
|
Number
|
The symbol size
|
|
setColorInfo(info)
|
Object
|
Define symbol color
Name
|
Type
|
Description
|
info
|
Object
|
An info object that defines the color.
|
|
setOpacityInfo(info)
|
Object
|
Define symbol transparency
Name
|
Type
|
Description
|
info
|
Object
|
An info object that defines the opacity.
|
|
setRotationInfo(info)
|
Object
|
Define symbol rotation angle
Name
|
Type
|
Description
|
info
|
Object
|
An info object that defines the rotation.
|
|
setSizeInfo(info)
|
Object
|
Define symbol size
Name
|
Type
|
Description
|
info
|
Object
|
An info object that defines the size.
|
|
Example
<script type="text/javascript" src="scripts/GraphicsLayer.js"></script>
<script type="text/javascript" src="scripts/Renderer.js"></script>
<script type="text/javascript" src="scripts/Symbol.js"></script>
<script type="text/javascript" src="scripts/Graphic.js"></script>
//Define symbols for different scales
var renderer1 = new sg.renderers.SimpleRenderer(new sg.symbols.SimpleMarkerSymbol(sg.symbols.SimpleMarkerSymbol.STYLE_SOLID, 10, outline, new sg.Color(0, 255, 0, 1)));
var renderer2 = new sg.renderers.SimpleRenderer(new sg.symbols.SimpleMarkerSymbol(sg.symbols.SimpleMarkerSymbol.STYLE_SOLID, 10, outline, new sg.Color(255, 255, 0, 1)));
renderer1.setSizeInfo({
field: "pop_est",
minSize: 10,
maxSize: 32,
minValue: 1,
maxValue: 1000000000
});
renderer2.setSizeInfo({
field: "pop_est",
minSize: 16,
maxSize: 64,
minValue: 1,
maxValue: 1000000000
});
//Create ScaleDependentRenderer
var sdRenderer = new sg.renderers.ScaleDependentRenderer({
rendererInfos: [{
minZoom: 0,
maxZoom: 1,
renderer: renderer1
}, {
minZoom: 1,
maxZoom: 18,
renderer: renderer2
}]
});
|
|
See live demo
©2015 Supergeo Technologies Inc.