ASP.NET MVC Controls | ComponentOne
In This Topic
    LineMarker Class
    In This Topic
    File
    wijmo.chart.js
    Module
    wijmo.chart

    Represents an extension of the LineMarker for the FlexChart.

    The LineMarker consists of a text area with content reflecting data point values, and optional vertical or horizontal lines (or both for a cross-hair effect) positioned over the plot area.

    It can be static (interaction = None), follow the mouse or touch position (interaction = Move), or move when the user drags the line (interaction = Drag).

    For example:

    // create an interactive marker with a horizontal line and y-value
      var lm = new LineMarker($scope.ctx.chart, {
          lines: LineMarkerLines.Horizontal,
          interaction: LineMarkerInteraction.Move,
          alignment : LineMarkerAlignment.Top
      });
      lm.content = function (ht) {
    
          // show y-value
          return lm.y.toFixed(2);
      }
    

    Constructor

    Properties

    Methods

    Events

    Constructor

    constructor

    constructor(chart: FlexChartCore, options?): LineMarker
    

    Initializes a new instance of the LineMarker class.

    Parameters
    • chart: FlexChartCore

      The chart on which the LineMarker appears.

    • options:
    Optional

    A JavaScript object containing initialization data for the control.

    Returns
    LineMarker

    Properties

    alignment

    Gets or sets the alignment of the LineMarker content.

    By default, the LineMarker shows to the right, at the bottom of the target point. Use '|' to combine alignment values.

    // set the alignment to the left.
    marker.alignment = LineMarkerAlignment.Left;
    
    // set the alignment to the left top.
    marker.alignment = LineMarkerAlignment.Left | LineMarkerAlignment.Top;
    
    Type
    LineMarkerAlignment

    chart

    Gets the FlexChart object that owns the LineMarker.

    Type
    FlexChartCore

    content

    Gets or sets the content function that allows you to customize the text content of the LineMarker.

    Type
    Function

    dragContent

    Gets or sets a value indicating whether the content of the marker is draggable when the interaction mode is "Drag."

    Type
    boolean

    dragLines

    Gets or sets a value indicating whether the lines are linked when the horizontal or vertical line is dragged when the interaction mode is "Drag."

    Type
    boolean

    dragThreshold

    Gets or sets the maximum distance from the horizontal or vertical line that the marker can be dragged.

    Type
    number

    horizontalPosition

    Gets or sets the horizontal position of the LineMarker relative to the plot area.

    Its value range is (0, 1). If the value is null or undefined and interaction is set to LineMarkerInteraction.Move or LineMarkerInteraction.Drag, the horizontal position of the marker is calculated automatically based on the pointer's position.

    Type
    number

    interaction

    Gets or sets the interaction mode of the LineMarker.

    Type
    LineMarkerInteraction

    isVisible

    Gets or sets the visibility of the LineMarker.

    Type
    boolean

    lines

    Gets or sets the visibility of the LineMarker lines.

    Type
    LineMarkerLines

    seriesIndex

    Gets or sets the index of the series in the chart in which the LineMarker appears. This takes effect when the interaction property is set to LineMarkerInteraction.Move or LineMarkerInteraction.Drag.

    Type
    number

    verticalPosition

    Gets or sets the vertical position of the LineMarker relative to the plot area.

    Its value range is (0, 1). If the value is null or undefined and interaction is set to LineMarkerInteraction.Move or LineMarkerInteraction.Drag, the vertical position of the LineMarker is calculated automatically based on the pointer's position.

    Type
    number

    x

    Gets the current x-value as chart data coordinates.

    Type
    number

    y

    Gets the current y-value as chart data coordinates.

    Type
    number

    Methods

    onPositionChanged

    onPositionChanged(point: Point): void
    

    Raises the positionChanged event.

    Parameters
    • point: Point

      The target point at which to show the LineMarker.

    Returns
    void

    remove

    remove(): void
    

    Removes the LineMarker from the chart.

    Returns
    void

    Events

    positionChanged

    Occurs after the LineMarker's position changes.

    Arguments
    Point