<< Click to Display Table of Contents >>

 

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.