new Markers(context, params)
UI Helper for managing the 'Events' menu dropdown for showing markers on the chart.
Parameters:
Name | Type | Description | ||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
context |
CIQ.UI.Context | The context |
||||||||||||||||||||
params |
Object | initialization parameters Properties
|
- Since:
-
7.1.0
Methods
-
showMarkers(activator, type, markerType)
-
Displays the markers specified by the
type
parameter. Iftype
is not provided, all currently displayed markers are removed. Must be called from a menu item.To use this function:
-
Create an implementation that provides the methods for managing markers.
The marker implementation must include a
showMarkers
function that accepts the following parameters:type
— Categorizes the marker as a circle, square, or specialized type such as trade or video.renderType
— Specifies the marker class, either Simple or Performance.
See the
MarkersSample
class in the markersSample.js file in the examples/markers folder of your library for a complete example implementation. -
Assign the implementation to the
eventMarkersImplementation
property of the chart configuration object.For example, from the sample-template-advanced.html template (in the examples/templates folder of your library):
import marker from "./examples/markers/markersSample.js"; const config = getDefaultConfig({ markerFeed: marker.MarkersSample, . . . });
The
markerFeed
parameter is assigned to theeventMarkersImplementation
property of the chart configuration object.See the Chart Configuration tutorial for more information.
Parameters:
Name Type Description activator
object Properties
Name Type Argument Description node
HTMLElement <optional>
Element which activated this function.
type
string Marker type: "circle", "square", or "callout".
markerType
string Class of marker to draw: "Simple" or "Performance".
- Since:
-
7.1.0 Added
markerType
.
Example
<cq-item stxtap="Markers.showMarkers('square')"> Simple Square<span class="ciq-radio"><span></span></span> </cq-item>
-