Options
All
  • Public
  • Public/Protected
  • All
Menu

Module node_modules/@types/raphael

Index

Type aliases

RaphaelBasicEventHandler

RaphaelBasicEventHandler<ThisContext, TEvent>: (this: ThisContext, event: TEvent) => any

A basic event handler for some common events on RaphaelElements, such as click and dblclick.

Type parameters

  • ThisContext

    Type of the this context of the handler.

  • TEvent: Event

    Type of the event passed to the handler.

Type declaration

    • (this: ThisContext, event: TEvent): any
    • Parameters

      • this: ThisContext
      • event: TEvent

        The original DOM event that triggered the event this handler was registered for.

      Returns any

      A value that is returned as the return value of the document.addEventListener callback.

RaphaelBuiltinEasingFormula

RaphaelBuiltinEasingFormula: "linear" | "<" | ">" | "<>" | "backIn" | "backOut" | "elastic" | "bounce" | "ease-in" | "easeIn" | "ease-out" | "easeOut" | "ease-in-out" | "easeInOut" | "back-in" | "back-out"

Names of the easing RaphaelBuiltinEasingFormulas that are available by default. See also the RaphaelStatic.easing_formulas object.

RaphaelConstructionOptionsArray4

RaphaelConstructionOptionsArray4: [string, number, number, ...RaphaelShapeDescriptor[]]

Array that can be passed to the Raphael() constructor. The first three arguments in the array are, in order:

  • containerID: ID of the element which is going to be a parent for drawing surface.
  • width: Width for the canvas.
  • height: Height for the canvas.

The remaining items are descriptor objects for the shapes that are created initially.

RaphaelConstructionOptionsArray5

RaphaelConstructionOptionsArray5: [number, number, number, number, ...RaphaelShapeDescriptor[]]

Array that can be passed to the Raphael() constructor. The first four arguments in the array are, in order:

  • x: x coordinate of the viewport where the canvas is created.
  • y: y coordinate of the viewport where the canvas is created.
  • width: Width for the canvas.
  • height: Height for the canvas.

The remaining items are descriptor objects for the shapes that are created initially.

RaphaelCustomAttribute

RaphaelCustomAttribute<TTechnology, TArgs>: (this: RaphaelElement<TTechnology>, ...values: TArgs) => Partial<RaphaelAttributes>

If you have a set of attributes that you would like to represent as a function of some number you can do it easily with custom attributes, see RaphaelPaper.customAttributes for more details.

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • TArgs: number[] = any

Type declaration

RaphaelCustomEasingFormula

RaphaelCustomEasingFormula: string & {}

Names of the easing RaphaelBuiltinEasingFormulas that may be added by the user. See also the RaphaelStatic.easing_formulas object.

RaphaelDashArrayType

RaphaelDashArrayType: "" | "-" | "." | "-." | "-.." | ". " | "- " | "--" | "- ." | "--." | "--.."

Represents the stroke dash types supported by Raphaël.

RaphaelDragOnEndHandler

RaphaelDragOnEndHandler<ThisContext>: (this: ThisContext, event: DragEvent) => any

Represents the handler callback that is called when dragging ends. See RaphaelBaseElement.drag.

Type parameters

  • ThisContext

    The type of the this context of the handler.

Type declaration

    • (this: ThisContext, event: DragEvent): any
    • Parameters

      • this: ThisContext
      • event: DragEvent

        DOM event object

      Returns any

      A value that is returned as the return value of the document.addEventListener callback.

RaphaelDragOnMoveHandler

RaphaelDragOnMoveHandler<ThisContext>: (this: ThisContext, deltaX: number, deltaY: number, mouseX: number, mouseY: number, event: DragEvent) => any

Represents the handler callback that is called when the pointer is moved while dragging. See RaphaelBaseElement.drag.

Type parameters

  • ThisContext

    The type of the this context of the handler.

Type declaration

    • (this: ThisContext, deltaX: number, deltaY: number, mouseX: number, mouseY: number, event: DragEvent): any
    • Parameters

      • this: ThisContext
      • deltaX: number

        How much the pointer has moved in the horizontal direction compared to when this handler was most recently invoked.

      • deltaY: number

        How much the pointer has moved in the vertical direction compared to when this handler was most recently invoked.

      • mouseX: number

        The current horizontal position of the mouse.

      • mouseY: number

        The current vertical position of the mouse.

      • event: DragEvent

      Returns any

      A value that is returned as the return value of the document.addEventListener callback.

RaphaelDragOnOverHandler

RaphaelDragOnOverHandler<TTechnology, ThisContext>: (this: ThisContext, targetElement: RaphaelElement<TTechnology>) => any

Represents an event handler for when the pointer moves over another element while dragging. See also RaphaelBaseElement.onDragOver.

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • ThisContext = RaphaelElement<TTechnology>

    Type of the this context of the callback.

Type declaration

    • (this: ThisContext, targetElement: RaphaelElement<TTechnology>): any
    • Parameters

      • this: ThisContext
      • targetElement: RaphaelElement<TTechnology>

        The element you are dragging over.

      Returns any

      A value that is returned as the return value of the document.addEventListener callback.

RaphaelDragOnStartHandler

RaphaelDragOnStartHandler<ThisContext>: (this: ThisContext, x: number, y: number, event: DragEvent) => any

Represents the handler callback that is called when dragging starts. See RaphaelBaseElement.drag.

Type parameters

  • ThisContext

    The type of the this context of the handler.

Type declaration

    • (this: ThisContext, x: number, y: number, event: DragEvent): any
    • Parameters

      • this: ThisContext
      • x: number

        position of the mouse

      • y: number

        position of the mouse

      • event: DragEvent

        DOM event object

      Returns any

      A value that is returned as the return value of the document.addEventListener callback.

RaphaelEasingFormula

RaphaelEasingFormula: (normalizedAnimationTime: number) => number

An easing formula for smoothly interpolating between two values. The formula is passed the normalized animation time and should return the relative animation position at that time.

Type declaration

    • (normalizedAnimationTime: number): number
    • Parameters

      • normalizedAnimationTime: number

        A percentage between 0 and 1, with 0 representing the beginning and 1 representing the end of the animation time.

      Returns number

      The relative animation position, a percentage between 0 and 1 for where the animation should be at the given animation time.

RaphaelElementPluginMethod

RaphaelElementPluginMethod<TTechnology, TArgs, TRetVal>: (this: RaphaelElement<TTechnology>, ...args: TArgs) => TRetVal

You can add your own method to elements, see RaphaelStatic.el for more details.

Plugin methods may take any arbitrary number of parameters and may return any value. When possible, consider return this to allow for chaining.

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • TArgs: any[] = any

    Type of the arguments required by this element method plugin. These arguments need to be passed when the method is called on an RaphaelElement.

  • TRetVal = any

    Type of the value that is returned by this element method plugin. This is also the value that is returned when the method is called on a RaphaelElement.

Type declaration

    • Parameters

      • this: RaphaelElement<TTechnology>
      • Rest ...args: TArgs

        The arguments, as required by this element plugin. They need to be passed when the plugin method is called on a RaphaelElement.

      Returns TRetVal

      The value that should be returned by this plugin method. This is also the value that is returned when this plugin method is called on a RaphaelElement.

RaphaelElementPluginRegistry

RaphaelElementPluginRegistry<TTechnology>: {[ P in keyof RaphaelElement<TTechnology>]: RaphaelElement<TTechnology>[P] extends (...args: any) => any ? RaphaelElementPluginMethod<TTechnology, Parameters<RaphaelElement<TTechnology>[P]>, ReturnType<RaphaelElement<TTechnology>[P]>> : never }

You can add your own method to elements. This is useful when you want to hack default functionality or want to wrap some common transformation or attributes in one method. In contrast to canvas methods, you can redefine element method at any time. Expending element methods would not affect set.

Raphael.el.red = function () {
  this.attr({fill: "#f00"});
};
// then use it
paper.circle(100, 100, 20).red();

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

RaphaelFontOrigin

RaphaelFontOrigin: "baseline" | "middle"

Represents the base line of a piece of text.

RaphaelLineCapType

RaphaelLineCapType: "butt" | "square" | "round"

Represents the line cap types supported by Raphaël. See RaphaelBaseElement.attr.

RaphaelLineJoinType

RaphaelLineJoinType: "bevel" | "round" | "miter"

Represents the line join types supported by Raphaël. See RaphaelBaseElement.attr.

RaphaelOnAnimationCompleteHandler

RaphaelOnAnimationCompleteHandler<ThisContext>: (this: ThisContext) => void

Callback that is invoked once an animation is complete.

Type parameters

  • ThisContext

    Type of the argument passed as the this context.

Type declaration

    • (this: ThisContext): void
    • Parameters

      • this: ThisContext

      Returns void

RaphaelPaperPluginMethod

RaphaelPaperPluginMethod<TTechnology, TArgs, TRetVal>: (this: RaphaelPaper<TTechnology>, ...args: TArgs) => TRetVal

You can add your own method to the canvas, see RaphaelStatic.fn for more details.

Plugin methods may take any arbitrary number of parameters and may return any value. When possible, consider return this to allow for chaining.

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • TArgs: any[] = any

    Type of the arguments required by this paper method plugin. These arguments need to be passed when the method is called on an RaphaelPaper.

  • TRetVal = any

    Type of the value that is returned by this paper method plugin. This is also the value that is returned when the method is called on a RaphaelPaper.

Type declaration

    • (this: RaphaelPaper<TTechnology>, ...args: TArgs): TRetVal
    • Parameters

      • this: RaphaelPaper<TTechnology>
      • Rest ...args: TArgs

        The arguments, as required by this paper plugin. They need to be passed when the plugin method is called on a RaphaelPaper.

      Returns TRetVal

      The value that should be returned by this plugin method. This is also the value that is returned when this plugin method is called on a RaphaelPaper.

RaphaelPaperPluginRegistry

RaphaelPaperPluginRegistry<TTechnology, T>: {[ P in keyof T]: T[P] extends (...args: any) => any ? RaphaelPaperPluginMethod<TTechnology, Parameters<T[P]>, ReturnType<T[P]>> : RaphaelPaperPluginRegistry<TTechnology, T[P]> }

You can add your own method to the canvas. Please note that you can create your own namespaces inside the RaphaelStatic.fn object - methods will be run in the context of canvas anyway:

Raphael.fn.arrow = function (x1, y1, x2, y2, size) {
  return this.path( ... );
};
// or create namespace
Raphael.fn.mystuff = {
  arrow: function () {…},
  star: function () {…},
  // etc...
};

var paper = Raphael(10, 10, 630, 480);
// then use it
paper.arrow(10, 10, 30, 30, 5).attr({fill: "#f00"});
paper.mystuff.arrow();
paper.mystuff.star();

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • T: {} = RaphaelPaper<TTechnology>

    Type of the paper or sub namespace in the paper.

RaphaelPathSegment

RaphaelPathSegment: ["M", number, number] | ["m", number, number] | ["L", number, number] | ["l", number, number] | ["H", number] | ["h", number] | ["V", number] | ["v", number] | ["Q", number, number, number, number] | ["q", number, number, number, number] | ["T", number, number] | ["t", number, number] | ["C", number, number, number, number, number, number] | ["c", number, number, number, number, number, number] | ["S", number, number, number, number] | ["s", number, number, number, number] | ["A", number, number, number, number, number, number, number] | ["a", number, number, number, number, number, number, number] | ["R", number, number] | ["r", number, number] | ["Z"] | ["z"]

Represents a single command of an SVG path string, such as a moveto or lineto command.

Please note that Raphaël splits path strings such as H 10 20 into two segments: ["H", 10] and ["H", 20].

RaphaelPotentialFailure

RaphaelPotentialFailure<T>: T & { error?: number }

Represents a result or return value of an operation that can fail, such as due to illegal arguments. For example, RaphaelStatic.getRGB returns an error if the string could not be parsed.

This adds an error property. When it is set to to true, the operation was not successful - such as when an input string could not be parsed or the arguments are out of range.

Type parameters

  • T: {}

    Type of the result when the operation did not fail.

RaphaelSetPluginMethod

RaphaelSetPluginMethod<TTechnology, TArgs, TRetVal>: (this: RaphaelSet<TTechnology>, ...args: TArgs) => TRetVal

You can add your own method to set, see RaphaelStatic.st for more details.

Plugin methods may take any arbitrary number of parameters and may return any value. When possible, consider return this to allow for chaining.

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

  • TArgs: any[] = any

    Type of the arguments required by this set method plugin. These arguments need to be passed when the method is called on an RaphaelSet.

  • TRetVal = any

    Type of the value that is returned by this set method plugin. This is also the value that is returned when the method is called on a RaphaelSet.

Type declaration

    • (this: RaphaelSet<TTechnology>, ...args: TArgs): TRetVal
    • Parameters

      • this: RaphaelSet<TTechnology>
      • Rest ...args: TArgs

        The arguments, as required by this set plugin. They need to be passed when the plugin method is called on a RaphaelSet.

      Returns TRetVal

      The value that should be returned by this plugin method. This is also the value that is returned when this plugin method is called on a RaphaelSet.

RaphaelSetPluginRegistry

RaphaelSetPluginRegistry<TTechnology>: {[ P in keyof RaphaelSet<TTechnology>]: RaphaelSet<TTechnology>[P] extends (...args: any) => any ? RaphaelSetPluginMethod<TTechnology, Parameters<RaphaelSet<TTechnology>[P]>, ReturnType<RaphaelSet<TTechnology>[P]>> : never }

You can add your own method to elements and sets. It is wise to add a set method for each element method you added, so you will be able to call the same method on sets too. See also {@link el}.

Raphael.el.red = function() {
  this.attr({fill: "#f00"});
};

Raphael.st.red = function() {
  this.forEach(function () {
    this.red();
  });
};

// then use it
paper.set(paper.circle(100, 100, 20), paper.circle(110, 100, 20)).red();

Type parameters

  • TTechnology: RaphaelTechnology = "SVG" | "VML"

    Type of the technology used by this paper, either SVG or VML.

RaphaelShapeType

RaphaelShapeType: "circle" | "ellipse" | "image" | "rect" | "text" | "path" | "set"

The names of the base shapes that can be created on the canvas. Used, for example, by the Raphael() constructor.

RaphaelTechnology

RaphaelTechnology: "" | "SVG" | "VML"

Represents the technology used by Raphaël, depending on the browser support.

  • SVG: Scalable vector graphics are used.
  • VML: Vector markup language is used.
  • (empty string): Neither technology can be used. Raphaël will not work.

Vector Markup Language (VML) was an XML-based file format for two-dimensional vector graphics. It was specified in Part 4 of the Office Open XML standards ISO/IEC 29500 and ECMA-376. According to the specification, VML is a deprecated format included in Office Open XML for legacy reasons only.

RaphaelTextAnchorType

RaphaelTextAnchorType: "start" | "middle" | "end"

Represents the text anchor types supported by Raphaël. See RaphaelBaseElement.attr.

RaphaelTransformSegment

RaphaelTransformSegment: ["t", number, number] | ["s", number, number, number, number] | ["s", number, number] | ["r", number, number, number] | ["r", number] | ["m", number, number, number, number, number, number]

Represents a single transform operation:

  • t: A translation operation. Parameters are [deltaX, deltaY]
  • s: A scaling operation. Parameters are [scaleX, scaleY, originX, originY]
  • r: A rotation operation: Parameters are [angleInDegrees, originX, originY]
  • m: A general matrix transform. Parameters are [a, b, c, d, e, f], see RaphaelMatrix.

RaphaelUnwrapElement

RaphaelUnwrapElement<TTechnology, TBase>: TBase extends RaphaelSet<TTechnology> ? RaphaelElement<TTechnology> : TBase

Distinguishes between a RaphaelSet and other RaphaelElements. When an event handler is added to a set, it is called with the this context set to the elements contained in the set. Otherwise, when the handler is added to an element, it is called with the this context set to that element.

returns

If the element to unwrap is a RaphaelSet, a RaphaelElement. Otherwise, the given element.

Type parameters

VMLCircleElement

VMLCircleElement: VMLElement

Dummy type alias for a VML circle element. Might be replaced with the actual API at some point.

VMLElement

VMLElement: Element

Dummy type alias for a VML element (vector markup language). Might be replaced with the actual API at some point.

Vector Markup Language (VML) was an XML-based file format for two-dimensional vector graphics. It was specified in Part 4 of the Office Open XML standards ISO/IEC 29500 and ECMA-376. According to the specification, VML is a deprecated format included in Office Open XML for legacy reasons only.

VMLEllipseElement

VMLEllipseElement: VMLElement

Dummy type alias for a VML ellipse element. Might be replaced with the actual API at some point.

VMLImageElement

VMLImageElement: VMLElement

Dummy type alias for a VML image element. Might be replaced with the actual API at some point.

VMLPathElement

VMLPathElement: VMLElement

Dummy type alias for a VML path element. Might be replaced with the actual API at some point.

VMLRectElement

VMLRectElement: VMLElement

Dummy type alias for a VML rect element. Might be replaced with the actual API at some point.

VMLTextElement

VMLTextElement: VMLElement

Dummy type alias for a VML text element. Might be replaced with the actual API at some point.

Variables

Const default

default: RaphaelStatic

Generated using TypeDoc