diff --git a/types/plotly.js/index.d.ts b/types/plotly.js/index.d.ts index 863c708abb..1fbdf3942c 100644 --- a/types/plotly.js/index.d.ts +++ b/types/plotly.js/index.d.ts @@ -1,39 +1,282 @@ -// Type definitions for plotly.js +// Type definitions for plotly.js 1.22 // Project: https://plot.ly/javascript/ -// Definitions by: Martin Duparc +// Definitions by: Chris Gervang , Martin Duparc // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.2 -interface PlotlyConfig { - staticPlot?: boolean, - editable?: boolean, - autosizable?: boolean, - fillFrame?: boolean, - frameMargins?: number, - scrollZoom?: boolean, - doubleClick?: string, - showTips?: boolean, - showLink?: boolean, - sendData?: boolean, - linkText?: string, - showSources?: boolean, - displayModeBar?: string|boolean, - modeBarButtonsToRemove?: any[], - modeBarButtonsToAdd?: any[], - modeBarButtons?: boolean, - displaylogo?: boolean, - plotGlPixelRatio?: number, - setBackground?: any, - topojsonURL?: string, - mapboxAccessToken?: string, - logging?: boolean +declare namespace Plots { + interface StaticPlots { + resize: (root: Plotly.Root) => void + } } -interface PlotlyStatic { - newPlot(divid:string | HTMLElement, data:any[], layout?:any, config?:PlotlyConfig):void; +declare namespace Plotly { + type Root = string | HTMLElement + + interface PlotlyStatic { + Plots: Plots.StaticPlots + newPlot: (root: Root, data: Partial[], layout?: Partial, config?: Partial) => void + relayout: (root: Root, layout: Partial) => void + redraw: (root: Root) => void + purge: (root: Root) => void + d3: any + } + + // Layout + + interface Layout { + autosize: boolean + showlegend: boolean + xaxis: Partial + yaxis: Partial + margin: Partial + height: number + width: number + hovermode: "closest" | "x" | "y" | false + 'xaxis.range': [Datum, Datum] + 'yaxis.range': [Datum, Datum] + 'yaxis.type': AxisType + 'xaxis.type': AxisType + 'xaxis.autorange': boolean + 'yaxis.autorange': boolean + shapes: Partial[] + } + + type AxisType = "date" | "log" | "linear" + + interface Axis { + showgrid: boolean + fixedrange: boolean + rangemode: "tozero" | 'normal' | 'nonnegative' + type: AxisType + tickformat: string + hoverformat: string + rangeslider: Partial + rangeselector: Partial, + range: [Datum, Datum] + showticklabels: boolean + autotick: boolean + zeroline: boolean + autorange: boolean | 'reversed' + } + + interface ShapeLine { + color: string + width: number + dash: Dash + } + + interface Shape { + visible: boolean + layer: 'below' | 'above' + type: 'rect' | 'circle' | 'line' | 'path' + path: string + // x-reference is assigned to the x-values + xref: 'x' | 'paper' + // y-reference is assigned to the plot paper [0,1] + yref: 'paper' | 'y' + x0: Datum + y0: Datum + x1: Datum + y1: Datum + fillcolor: string + opacity: number + line: Partial + } + + interface Margin { + t: number + b: number + l: number + r: number + } + + type ModeBarButtons = 'lasso2d' | 'select2d' | 'sendDataToCloud' | 'autoScale2d' | + 'zoom2d' | 'pan2d' | 'zoomIn2d' | 'zoomOut2d' | 'autoScale2d' | 'resetScale2d' | + 'hoverClosestCartesian' | 'hoverCompareCartesian' | 'zoom3d' | 'pan3d' | 'orbitRotation' | + 'tableRotation' | 'resetCameraDefault3d' | 'resetCameraLastSave3d' | 'hoverClosest3d' | + 'zoomInGeo' | 'zoomOutGeo' | 'resetGeo' | 'hoverClosestGeo' | 'hoverClosestGl2d' | + 'hoverClosestPie' | 'toggleHover' | 'resetViews' + + // Data + + type Datum = string | number | Date + + type Dash = 'solid' | 'dot' | 'dash' | 'longdash' | 'dashdot' | 'longdashdot' + + type Data = ScatterData | BarData + + // Bar + interface BarData { + type: 'bar' + x: Datum[] + y: Datum[] + } + + // Scatter + interface ScatterData { + type: 'scatter' | 'scattergl' + x: Datum[] + y: Datum[] + text: string | string[] + line: Partial + marker: Partial + mode: "lines" | "markers" | "text" | "lines+markers" | "text+markers" | "text+lines" | "text+lines+markers" | "none" + hoveron: "points" | "fills" + hoverinfo: "text" + fill: 'none' | 'tozeroy' | 'tozerox' | 'tonexty' | 'tonextx' | 'toself' | 'tonext' + fillcolor: string + legendgroup: string + name: string + connectgaps: boolean + } + + interface ScatterMarker { + symbol: "" //Drawing.symbolList + opacity: number + size: number + maxdisplayed: number + sizeref: number + sizemin: number + sizemode: "diameter" | "area" + showscale: boolean + line: {} //TODO + colorbar: {} //TODO + } + + interface ScatterLine { + color: string + width: number + dash: Dash + shape: 'linear' | 'spline' | 'hv' | 'vh' | 'hvh' | 'vhv' + smoothing: number + simplify: boolean + } + + interface Font { + family: string + size: number + color: string + } + + interface Config { + // no interactivity, for export or image generation + staticPlot: boolean + + // we can edit titles, move annotations, etc + editable: boolean + + // DO autosize once regardless of layout.autosize + // (use default width or height values otherwise) + autosizable: boolean + + // set the length of the undo/redo queue + queueLength: number + + // if we DO autosize, do we fill the container or the screen? + fillFrame: boolean + + // if we DO autosize, set the frame margins in percents of plot size + frameMargins: number + + // mousewheel or two-finger scroll zooms the plot + scrollZoom: boolean + + // double click interaction (false, 'reset', 'autosize' or 'reset+autosize') + doubleClick: 'reset+autosize' | 'reset' | 'autosize' | false + + // new users see some hints about interactivity + showTips: boolean + + // link to open this plot in plotly + showLink: boolean + + // if we show a link, does it contain data or just link to a plotly file? + sendData: boolean + + // text appearing in the sendData link + linkText: string + + // false or function adding source(s) to linkText + showSources: boolean + + // display the mode bar (true, false, or 'hover') + displayModeBar: 'hover' | boolean + + // remove mode bar button by name + // (see ./components/modebar/buttons.js for the list of names) + modeBarButtonsToRemove: ModeBarButtons[], + + // add mode bar button using config objects + // (see ./components/modebar/buttons.js for list of arguments) + modeBarButtonsToAdd: ModeBarButtons[], + + // fully custom mode bar buttons as nested array, + // where the outer arrays represents button groups, and + // the inner arrays have buttons config objects or names of default buttons + // (see ./components/modebar/buttons.js for more info) + modeBarButtons: boolean + + // add the plotly logo on the end of the mode bar + displaylogo: boolean + + // increase the pixel ratio for Gl plot images + plotGlPixelRatio: number + + // function to add the background color to a different container + // or 'opaque' to ensure there's white behind it + setBackground: string | 'opaque' + + // URL to topojson files used in geo charts + topojsonURL: string + + // Mapbox access token (required to plot mapbox trace types) + // If using an Mapbox Atlas server, set this option to '', + // so that plotly.js won't attempt to authenticate to the public Mapbox server. + mapboxAccessToken: string + + // Turn all console logging on or off (errors will be thrown) + // This should ONLY be set via Plotly.setPlotConfig + logging: boolean + + // Set global transform to be applied to all traces with no + // specification needed + globalTransforms: any[] + + } + + // Components + + interface RangeSlider { + visible: boolean + thickness: number + range: [Datum, Datum] + borderwidth: number + bordercolor: string + bgcolor: string + } + + interface RangeSelectorButton { + step: 'second' | 'minute' | 'hour' | 'day' | 'month' | 'year' | 'all' + stepmode: 'backward' | 'todate' + count: number + label: string + } + + interface RangeSelector { + buttons: Partial[] + visible: boolean + x: number + xanchor: 'auto' | 'left' | 'center' | 'right' + y: number + yanchor: 'auto' | 'top' | 'middle' | 'bottom' + bgcolor: string + activecolor: string + bordercolor: string + borderwidth: number + font: Partial + } } -declare module "plotly.js" { - export = plotly; -} - -declare var plotly:PlotlyStatic; +declare var Plotly: Plotly.PlotlyStatic +export = Plotly \ No newline at end of file diff --git a/types/plotly.js/plotly.js-tests.ts b/types/plotly.js/plotly.js-tests.ts index 57fc92d8a9..293c5ade6a 100644 --- a/types/plotly.js/plotly.js-tests.ts +++ b/types/plotly.js/plotly.js-tests.ts @@ -1,6 +1,6 @@ import * as Plotly from 'plotly.js'; -var data = [ +var data: Plotly.BarData[] = [ { x: ['giraffes', 'orangutans', 'monkeys'], y: [20, 14, 23], diff --git a/types/plotly.js/tsconfig.json b/types/plotly.js/tsconfig.json index 94a19223ed..776f3e5a66 100644 --- a/types/plotly.js/tsconfig.json +++ b/types/plotly.js/tsconfig.json @@ -7,7 +7,7 @@ ], "noImplicitAny": true, "noImplicitThis": true, - "strictNullChecks": false, + "strictNullChecks": true, "baseUrl": "../", "typeRoots": [ "../" diff --git a/types/plotly.js/tslint.json b/types/plotly.js/tslint.json new file mode 100644 index 0000000000..2221e40e4a --- /dev/null +++ b/types/plotly.js/tslint.json @@ -0,0 +1 @@ +{ "extends": "../tslint.json" } \ No newline at end of file