Options
All
  • Public
  • Public/Protected
  • All
Menu

Index

Type Aliases

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

Type Parameters

  • ThisContext

    Type of the this context of the handler.

  • TEvent extends Event

    Type of the event passed to the handler.

Type declaration

    • (this: ThisContext, event: TEvent): any
    • A basic event handler for some common events on RaphaelElements, such as click and dblclick.

      Parameters

      • this: ThisContext
      • event: TEvent

      Returns any

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: [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: [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<TTechnology, TArgs>: ((this: RaphaelElement<TTechnology>, ...values: TArgs) => Partial<RaphaelAttributes>)

Type Parameters

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

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

  • TArgs extends number[] = any

Type declaration

RaphaelCustomEasingFormula: string & {}

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

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

Represents the stroke dash types supported by Raphaël.

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

Type Parameters

  • ThisContext

    The type of the this context of the handler.

Type declaration

    • (this: ThisContext, event: DragEvent): any
    • Represents the handler callback that is called when dragging ends. See RaphaelBaseElement.drag.

      Parameters

      • this: ThisContext
      • event: DragEvent

      Returns any

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

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
    • Represents the handler callback that is called when the pointer is moved while dragging. See RaphaelBaseElement.drag.

      Parameters

      • this: ThisContext
      • deltaX: number
      • deltaY: number
      • mouseX: number
      • mouseY: number
      • event: DragEvent

      Returns any

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

Type Parameters

  • TTechnology extends 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

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

Type Parameters

  • ThisContext

    The type of the this context of the handler.

Type declaration

    • (this: ThisContext, x: number, y: number, event: DragEvent): any
    • Represents the handler callback that is called when dragging starts. See RaphaelBaseElement.drag.

      Parameters

      • this: ThisContext
      • x: number
      • y: number
      • event: DragEvent

      Returns any

RaphaelEasingFormula: ((normalizedAnimationTime: number) => number)

Type declaration

    • (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.

      Parameters

      • normalizedAnimationTime: number

      Returns number

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

Type Parameters

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

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

  • TArgs extends 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

    • 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.

      Parameters

      Returns TRetVal

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 extends RaphaelTechnology = "SVG" | "VML"

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

RaphaelFontOrigin: "baseline" | "middle"

Represents the base line of a piece of text.

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

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

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

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

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

Type Parameters

  • ThisContext

    Type of the argument passed as the this context.

Type declaration

    • (this: ThisContext): void
    • Callback that is invoked once an animation is complete.

      Parameters

      • this: ThisContext

      Returns void

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

Type Parameters

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

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

  • TArgs extends 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

    • 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.

      Parameters

      Returns TRetVal

RaphaelPaperPluginRegistry<TTechnology, T>: { [ P in keyof T]: RaphaelPaperPluginMethodOrRegistry<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 extends 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: ["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<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 extends {}

    Type of the result when the operation did not fail.

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

Type Parameters

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

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

  • TArgs extends 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
    • 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.

      Parameters

      Returns TRetVal

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 extends RaphaelTechnology = "SVG" | "VML"

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

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: "" | "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: "start" | "middle" | "end"

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

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<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

  • TTechnology extends RaphaelTechnology

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

  • TBase extends RaphaelBaseElement<TTechnology>

    A raphael element or set to unwrap.

VMLCircleElement: VMLElement

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

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: VMLElement

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

VMLImageElement: VMLElement

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

VMLPathElement: VMLElement

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

VMLRectElement: VMLElement

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

VMLTextElement: VMLElement

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

Variables

default: RaphaelStatic

Generated using TypeDoc