Element: <oj-thematic-map-marker>

Oracle® JavaScript Extension Toolkit (JET)
17.1.0
G12196-01

Since:
  • 5.2.0
Module:
  • ojthematicmap

QuickNav

Attributes

Other Topics


JET Thematic Map Marker

The oj-thematic-map-marker element is used to declare properties for thematic map markers and is only valid as the child of a template element for the markerTemplate slot of oj-thematic-map. 


<oj-thematic-map marker-data='[[markerDataProvider]]' map-provider='[[mapProvider]]'>
 <template slot='markerTemplate'>
   <oj-thematic-map-marker  color='[[$current.data.color]]' value='[[$current.data.value]]'
     x='[[$current.data.lat]]' y='[[$current.data.long]]'>
   </oj-thematic-map-marker>
 </template>
</oj-thematic-map>


Usage

Signature:

interface ThematicMapMarkerElement<K3=any,D3=any>

Generic Parameters
ParameterDescription
K3Type of key of the markerData dataprovider
D3Type of data from the markerData dataprovider
Typescript Import Format
//To typecheck the element APIs, import as below.
import { ThematicMapMarkerElement } from "ojs/ojthematicmap";

//For the transpiled javascript to load the element's module, import as below
import "ojs/ojthematicmap";

For additional information visit:


Styling

CSS Variables

See JET CSS Variables for additional details.
Name Type Description
--oj-thematic-map-marker-bg-color <color> Thematic map marker background color
--oj-thematic-map-marker-border-color <color> Thematic map marker border color

Attributes

border-color :string

The marker border color.

border-style :"solid"|"none"

The marker border style.
Supported Values:
Value
none
solid

border-width :number

The marker border width in pixels.

categories :Array.<string>

An array of category strings corresponding to this marker. This allows highlighting and filtering of markers. By default, the label is used as the marker category.
Default Value:
  • []

color :string

The marker color. The default values come from the CSS classes and varies based on theme.
Default Value:
  • null

height :number

The marker height in pixels. Note that this attribute will be ignored if a value is provided to calculate the marker dimensions.

label :string

Text used for the marker's label.
Default Value:
  • ""

label-position :"bottom"|"center"|"top"

Determines the label position relative to the marker.
Supported Values:
Value
bottom
center
top
Default Value:
  • "center"

label-style :Partial<CSSStyleDeclaration>

The CSS style object defining the style of the marker label. The default values come from the CSS classes and varies based on theme. The following style properties are supported: color, cursor, fontFamily, fontSize, fontStyle, fontWeight, textDecoration.
Default Value:
  • null

location :string

An identifier corresponding to a Feature provided in the mapProvider geo object that this marker is associated with.
Default Value:
  • ""

opacity :number

The marker opacity.

rotation :number

The angle in degrees to rotate the marker clockwise around the marker center.
Default Value:
  • 0

selectable :"auto"|"off"

Specifies whether or not the marker will be selectable.
Supported Values:
Value
auto
off
Default Value:
  • "auto"

(nullable) shape :"circle"|"diamond"|"ellipse"|"human"|"plus"|"rectangle"|"square"|"star"|"triangleDown"|"triangleUp"|string

Specifies the shape of a marker. Can take the name of a built-in shape or the SVG path commands for a custom shape.

(nullable) short-desc :(string | ((context: ojThematicMap.MarkerShortDescContext<K3,D3>) => string))

The text that displays in the marker's tooltip.
Default Value:
  • ""

source :string

Specifies a URI for the location of the image resource to use for the marker instead of a built-in shape. The shape attribute is ignored if the source image is defined.
Default Value:
  • ""

source-hover :string

An optional URI for the location of the hover image resource. If not defined, the source image will be used.
Default Value:
  • ""

source-hover-selected :string

An optional URI for the location of the selected image resource on hover. If not defined, then the sourceSelected image will be used. If sourceSelected is not defined, then the source image will be used.
Default Value:
  • ""

source-selected :string

An optional URI for the location of the selected image. If not defined, the source image will be used.
Default Value:
  • ""

svg-class-name :string

The CSS style class defining the style of the marker.
Default Value:
  • ""

svg-style :Partial<CSSStyleDeclaration>

The CSS style object defining the style of the marker. Only SVG CSS style properties are supported.
Default Value:
  • {}

value :number

A data value used to calculate the marker dimensions based on the range of all the data values and the element size. Markers with negative or zero data values will not be rendered. If specified, this value takes precedence over the width and height attributes.

width :number

The marker width in pixels. Note that this attribute will be ignored if a value is provided to calculate the marker dimensions.

x :number|null

The x coordinate of the marker transformed using the map projection, which can be null if location is set instead.
Default Value:
  • null

y :number|null

The y coordinate of the marker transformed using the map projection, which can be null if location is set instead.
Default Value:
  • null