Plotly v3 - Drop transforms from the API

plotly/plotly.js#7240, plotly/plotly.js#7254

Author: ianroberts

types/plotly.js/index.d.ts

@@ -1310,7 +1310,6 @@ export type Color =
     | Array<string | number | undefined | null>
     | Array<Array<string | number | undefined | null>>;
 export type ColorScale = string | string[] | Array<[number, string]>;
-export type DataTransform = Partial<Transform>;
 export type ScatterData = PlotData;
 
 export interface PlotData {
@@ -1474,7 +1473,6 @@ export interface PlotData {
     delta: Partial<Delta>;
     gauge: Partial<Gauge>;
     number: Partial<PlotNumber>;
-    transforms: DataTransform[];
     orientation: "v" | "h";
     width: number | number[];
     boxmean: boolean | "sd";
@@ -1543,48 +1541,6 @@ export interface PlotData {
     uid: string;
 }
 
-/**
- * These interfaces are based on attribute descriptions in
- * https://github.com/plotly/plotly.js/tree/9d6144304308fc3007f0facf2535d38ea3e9b26c/src/transforms
- */
-export interface TransformStyle {
-    target: number | string | number[] | string[];
-    value: Partial<PlotData>;
-}
-
-export interface TransformAggregation {
-    target: string;
-    func?:
-        | "count"
-        | "sum"
-        | "avg"
-        | "median"
-        | "mode"
-        | "rms"
-        | "stddev"
-        | "min"
-        | "max"
-        | "first"
-        | "last"
-        | undefined;
-    funcmode?: "sample" | "population" | undefined;
-    enabled?: boolean | undefined;
-}
-
-export interface Transform {
-    type: "aggregate" | "filter" | "groupby" | "sort";
-    enabled: boolean;
-    target: number | string | number[] | string[];
-    operation: string;
-    aggregations: TransformAggregation[];
-    preservegaps: boolean;
-    groups: string | number[] | string[];
-    nameformat: string;
-    styles: TransformStyle[];
-    value: any;
-    order: "ascending" | "descending";
-}
-
 export interface ColorBarTitle {
     text: string;
     font: Partial<Font>;
@@ -1880,9 +1836,6 @@ export interface Config {
      */
     logging: boolean | 0 | 1 | 2;
 
-    /** Set global transform to be applied to all traces with no specification needed */
-    globalTransforms: any[];
-
     /** Which localization should we use? Should be a string like 'en' or 'en-US' */
     locale: string;
 
@@ -2746,15 +2699,6 @@ interface LocaleModule {
     format: Record<string, unknown>;
 }
 
-interface TransformModule {
-    moduleType: "transform";
-    name: string;
-    transform: any;
-    calcTransform: any;
-    attributes: Record<string, unknown>;
-    supplyDefaults: any;
-}
-
 interface ComponentModule {
     moduleType: "component";
     name: string;
@@ -2766,4 +2710,4 @@ interface ApiMethodModule {
     fn: any;
 }
 
-type PlotlyModule = TraceModule | LocaleModule | TransformModule | ComponentModule | ApiMethodModule;
+type PlotlyModule = TraceModule | LocaleModule | ComponentModule | ApiMethodModule;

types/plotly.js/lib/aggregate.d.ts

@@ -6,7 +6,9 @@ const graphDiv = "#test";
 //////////////////////////////////////////////////////////////////////
 // Plotly.newPlot
 // combination of https://plotly.com/javascript/multiple-transforms/#all-transforms and
-// https://plotly.com/javascript/2d-density-plots/
+// https://plotly.com/javascript/2d-density-plots/, but with transforms removed as they
+// no longer exist in Plotly v3 (it's up to you to massage the data set before passing
+// it to Plotly, rather than letting Plotly do the transform for you).
 
 (() => {
     const testrows = [
@@ -74,35 +76,6 @@ const graphDiv = "#test";
             },
         },
         type: "scatter",
-        transforms: [
-            {
-                type: "filter",
-                target: unpack(testrows, "year"),
-                operation: "=",
-                value: "2002",
-            },
-            {
-                type: "groupby",
-                nameformat: `%{group}`,
-                groups: unpack(testrows, "continent"),
-                styles: [
-                    { target: "Asia", value: { marker: { color: "red" } } },
-                    { target: "Europe", value: { marker: { color: "blue" } } },
-                    { target: "Americas", value: { marker: { color: "orange" } } },
-                    { target: "Africa", value: { marker: { color: "green" } } },
-                    { target: "Oceania", value: { marker: { color: "purple" } } },
-                ],
-            },
-            {
-                type: "aggregate",
-                groups: unpack(testrows, "continent"),
-                aggregations: [
-                    { target: "x", func: "avg" },
-                    { target: "y", func: "avg" },
-                    { target: "marker.size", func: "sum" },
-                ],
-            },
-        ],
         width: 2,
     } as PlotData;
     const trace2 = {

types/plotly.js/lib/filter.d.ts

@@ -1,4 +1,3 @@
-import aggregate from "plotly.js/lib/aggregate";
 import bar from "plotly.js/lib/bar";
 import barpolar from "plotly.js/lib/barpolar";
 import box from "plotly.js/lib/box";
@@ -12,10 +11,8 @@ import contour from "plotly.js/lib/contour";
 import contourcarpet from "plotly.js/lib/contourcarpet";
 import Plotly from "plotly.js/lib/core";
 import densitymapbox from "plotly.js/lib/densitymapbox";
-import filter from "plotly.js/lib/filter";
 import funnel from "plotly.js/lib/funnel";
 import funnelarea from "plotly.js/lib/funnelarea";
-import groupby from "plotly.js/lib/groupby";
 import heatmap from "plotly.js/lib/heatmap";
 import histogram from "plotly.js/lib/histogram";
 import histogram2d from "plotly.js/lib/histogram2d";
@@ -40,7 +37,6 @@ import scatterpolar from "plotly.js/lib/scatterpolar";
 import scatterpolargl from "plotly.js/lib/scatterpolargl";
 import scattersmith from "plotly.js/lib/scattersmith";
 import scatterternary from "plotly.js/lib/scatterternary";
-import sort from "plotly.js/lib/sort";
 import splom from "plotly.js/lib/splom";
 import streamtube from "plotly.js/lib/streamtube";
 import sunburst from "plotly.js/lib/sunburst";
@@ -52,7 +48,6 @@ import volume from "plotly.js/lib/volume";
 import waterfall from "plotly.js/lib/waterfall";
 
 Plotly.register([
-    aggregate,
     bar,
     barpolar,
     box,
@@ -65,10 +60,8 @@ Plotly.register([
     contour,
     contourcarpet,
     densitymapbox,
-    filter,
     funnel,
     funnelarea,
-    groupby,
     heatmap,
     histogram,
     histogram2d,
@@ -93,7 +86,6 @@ Plotly.register([
     scatterpolargl,
     scattersmith,
     scatterternary,
-    sort,
     splom,
     streamtube,
     sunburst,