Package io.kvision.chart

Full-featured chart component based on chart.js library.

Types

AnimationOptions

data class AnimationOptions(duration: Int, easing: Eeasing, onProgress: (obj: Chart.ChartAnimationObject) -> Unit?, onComplete: (obj: Chart.ChartAnimationObject) -> Unit?)

Chart animation options.

ArcOptions

data class ArcOptions(backgroundColor: Color?, borderColor: Color?, borderWidth: Int)

Chart arc options.

Chart

open class Chart(configuration: Configuration, chartWidth: Int?, chartHeight: Int?, classes: Set<String>, init: Chart.() -> Unit?) : Widget

Chart component.

ChartOptions

data class ChartOptions(responsive: Boolean, responsiveAnimationDuration: Int, aspectRatio: Int, maintainAspectRatio: Boolean, onResize: (chart: Chart, newSize: Chart.ChartSize) -> Unit?, devicePixelRatio: Int?, hover: HoverOptions?, events: List<String>?, onHover: (chart: Chart, <ERROR CLASS>, activeElements: Array<Any>) -> Any?, onClick: (<ERROR CLASS>, activeElements: Array<Any>) -> Any?, animation: AnimationOptions?, layout: LayoutOptions?, legend: LegendOptions?, legendCallback: (chart: Chart) -> String?, title: TitleOptions?, tooltips: TooltipOptions?, elements: ElementsOptions?, scales: ChartScales?, showLines: Boolean?, spanGaps: Boolean?, cutoutPercentage: Int?, circumference: Double?, rotation: Double?, plugins: dynamic, scale: dynamic)

Chart options.

ChartScales

data class ChartScales(type: ScalesType?, display: Boolean, position: Position?, gridLines: GridLineOptions?, scaleLabel: ScaleTitleOptions?, ticks: TickOptions?, xAxes: List<dynamic>?, yAxes: List<dynamic>?)

Chart scales.

ChartType

enum ChartType : Enum<ChartType>

Chart types.

Configuration

data class Configuration(type: ChartType, dataSets: List<DataSets>, labels: List<String>?, options: ChartOptions?, plugins: List<dynamic>?)

Chart configuration.

DataSets

data class DataSets(cubicInterpolationMode: InterpolationMode?, backgroundColor: List<Color>?, borderWidth: List<Int>?, borderColor: List<Color>?, borderCapStyle: List<LineCap>?, borderDash: List<Int>?, borderDashOffset: Int?, borderJoinStyle: List<LineJoin>?, borderSkipped: List<Position>?, data: List<dynamic>?, fill: Boolean?, hoverBackgroundColor: List<Color>?, hoverBorderColor: List<Color>?, hoverBorderWidth: List<Int>?, label: String?, lineTension: Number?, steppedLine: Boolean?, pointBorderColor: List<Color>?, pointBackgroundColor: List<Color>?, pointBorderWidth: List<Int>?, pointRadius: List<Int>?, pointHoverRadius: List<Int>?, pointHitRadius: List<Int>?, pointHoverBackgroundColor: List<Color>?, pointHoverBorderColor: List<Color>?, pointHoverBorderWidth: List<Int>?, pointStyle: List<PointStyle>?, xAxisID: String?, yAxisID: String?, type: ChartType?, hidden: Boolean?, hideInLegendAndTooltip: Boolean?, showLine: Boolean?, stack: String?, spanGaps: Boolean?, barPercentage: Number?, barThickness: dynamic, borderAlign: dynamic, categoryPercentage: Number?, hitRadius: List<Int>?, hoverRadius: Number?, maxBarThickness: Number?, minBarLegth: Number?, order: Number?, pointRotation: List<Int>?, radius: List<Int>?, rotation: List<Int>?, weight: Number?)

Chart data sets.

Eeasing

enum Eeasing : Enum<Eeasing>

Chart animation easings.

ElementsOptions

data class ElementsOptions(point: PointOptions?, line: LineOptions?, arc: ArcOptions?, rectangle: RectangleOptions?)

Chart elements options.

GridLineOptions

data class GridLineOptions(display: Boolean, color: Color?, borderDash: List<Int>?, borderDashOffset: Int, lineWidth: Int, drawBorder: Boolean, drawOnChartArea: Boolean, drawTicks: Boolean, tickMarkLength: Int, zeroLineWidth: Int, zeroLineColor: Color?, zeroLineBorderDash: List<Int>?, zeroLineBorderDashOffset: Int, offsetGridLines: Boolean, circular: Boolean?, z: Number?)

Chart grid line options.

HoverOptions

data class HoverOptions(mode: InteractionMode, animationDuration: Int, intersect: Boolean, axis: String)

Chart hover options.

InteractionMode

enum InteractionMode : Enum<InteractionMode>

Chart interaction modes.

InterpolationMode

enum InterpolationMode : Enum<InterpolationMode>

Chart interpolation modes.

LayoutOptions

data class LayoutOptions(padding: LayoutPaddingObject)

Chart layout options.

LayoutPaddingObject

data class LayoutPaddingObject(top: Int?, right: Int?, bottom: Int?, left: Int?)

Chart layout padding options.

LegendAlign

enum LegendAlign : Enum<LegendAlign>

Legend align options.

LegendLabelOptions

data class LegendLabelOptions(boxWidth: Int, fontSize: Int, fontStyle: FontStyle?, fontColor: Color?, fontFamily: String?, padding: Int, generateLabels: (chart: Any) -> Any?, filter: (legendItem: Chart.ChartLegendLabelItem, data: Chart.ChartData) -> Any?, usePointStyle: Boolean)

Chart legend label options.

LegendOptions

data class LegendOptions(display: Boolean, position: Position, fullWidth: Boolean, reverse: Boolean, onClick: (<ERROR CLASS>, legendItem: Chart.ChartLegendLabelItem) -> Unit?, onHover: (<ERROR CLASS>, legendItem: Chart.ChartLegendLabelItem) -> Unit?, labels: LegendLabelOptions?, align: LegendAlign?, onLeave: (<ERROR CLASS>, legendItem: Chart.ChartLegendLabelItem) -> Unit?)

Chart legend options.

LineCap

enum LineCap : Enum<LineCap>

Canvas line end point styles.

LineJoin

enum LineJoin : Enum<LineJoin>

Canvas line join styles.

LineOptions

data class LineOptions(cubicInterpolationMode: InterpolationMode, tension: Double, backgroundColor: Color?, borderWidth: Int, borderColor: Color?, borderCapStyle: LineCap?, borderDash: List<Any>?, borderDashOffset: Int, borderJoinStyle: LineJoin?, capBezierPoints: Boolean, fill: Boolean, stepped: Boolean)

Chart line options.

PointOptions

data class PointOptions(radius: Int, pointStyle: PointStyle, backgroundColor: Color?, borderWidth: Int, borderColor: Color?, hitRadius: Int, hoverRadius: Int, hoverBorderWidth: Int)

Chart point options.

PointStyle

enum PointStyle : Enum<PointStyle>

Chart point styles.

Position

enum Position : Enum<Position>

Chart objects positions.

RectangleOptions

data class RectangleOptions(backgroundColor: Color?, borderColor: Color?, borderWidth: Int, borderSkipped: Position)

Chart rectangle options.

ScalesType

enum ScalesType : Enum<ScalesType>

Chart scales.

ScaleTitleOptions

data class ScaleTitleOptions(display: Boolean, labelString: String?, fontSize: Int, fontStyle: FontStyle?, fontColor: Color?, fontFamily: String?, lineHeight: Number?, padding: Number?)

Chart scale title options.

TickOptions

data class TickOptions(callback: (value: Any, index: Any, values: Any) -> dynamic?, display: Boolean, fontSize: Int, fontStyle: FontStyle?, fontColor: Color?, fontFamily: String?, reverse: Boolean, minor: dynamic, major: dynamic, lineHeight: Number?, padding: Number?, z: Number?)

Chart tick options.

TitleOptions

data class TitleOptions(display: Boolean, position: Position, fontSize: Int, fontStyle: FontStyle?, fontColor: Color?, fontFamily: String?, padding: Int, lineHeight: String?, text: List<String>?, fullWidth: Boolean?)

Chart title options.

TooltipAlign

enum TooltipAlign : Enum<TooltipAlign>

Title and body align options.

TooltipCallback

data class TooltipCallback(beforeTitle: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, title: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, afterTitle: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, beforeBody: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, beforeLabel: (tooltipItem: Chart.ChartTooltipItem, data: Chart.ChartData) -> dynamic?, label: (tooltipItem: Chart.ChartTooltipItem, data: Chart.ChartData) -> dynamic?, labelColor: (tooltipItem: Chart.ChartTooltipItem, chart: Chart) -> Chart.ChartTooltipLabelColor?, labelTextColor: (tooltipItem: Chart.ChartTooltipItem, chart: Chart) -> String?, afterLabel: (tooltipItem: Chart.ChartTooltipItem, data: Chart.ChartData) -> dynamic?, afterBody: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, beforeFooter: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, footer: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?, afterFooter: (item: Array<Chart.ChartTooltipItem>, data: Chart.ChartData) -> dynamic?)

Chart tooltips callbacks.

TooltipOptions

data class TooltipOptions(enabled: Boolean, custom: (a: Any) -> Unit?, mode: InteractionMode, intersect: Boolean, position: TooltipPosition, callbacks: TooltipCallback?, filter: (item: Chart.ChartTooltipItem, data: Chart.ChartData) -> Boolean?, itemSort: (itemA: Chart.ChartTooltipItem, itemB: Chart.ChartTooltipItem) -> Number?, backgroundColor: Color?, titleFontSize: Int, titleFontStyle: FontStyle?, titleFontColor: Color?, titleFontFamily: String?, titleSpacing: Int, titleMarginBottom: Int, bodyFontSize: Int, bodyFontStyle: FontStyle?, bodyFontColor: Color?, bodyFontFamily: String?, bodySpacing: Int, footerFontSize: Int, footerFontStyle: FontStyle?, footerFontColor: Color?, footerFontFamily: String?, footerSpacing: Int, footerMarginTop: Int, xPadding: Int, yPadding: Int, caretPadding: Int, caretSize: Int, cornerRadius: Int, multiKeyBackground: Color?, displayColors: Boolean, borderColor: Color?, borderWidth: Int, titleAlign: TooltipAlign?, bodyAlign: TooltipAlign?, footerAlign: TooltipAlign?)

Chart tooltip options.

TooltipPosition

enum TooltipPosition : Enum<TooltipPosition>

Chart tooltip positions.

Functions

chart

fun Container.chart(configuration: Configuration, chartWidth: Int? = null, chartHeight: Int? = null, classes: Set<String>? = null, className: String? = null, init: Chart.() -> Unit? = null): Chart

DSL builder extension function.

fun <S> Container.chart(state: ObservableState<S>, configuration: Configuration, chartWidth: Int? = null, chartHeight: Int? = null, classes: Set<String>? = null, className: String? = null, init: Chart.(S) -> Unit): Chart

DSL builder extension function for observable state.

toJs

fun AnimationOptions.toJs(): dynamic