(core) Upgrade to latest plotly, and set automargin on Y-Axis

Test Plan: Only tested manually

Reviewers: alexmojaki

Reviewed By: alexmojaki

Subscribers: alexmojaki

Differential Revision: https://phab.getgrist.com/D3543
pull/13/head
Dmitry S 2 years ago
parent c72ebf61a7
commit 787b70f0f6

@ -35,7 +35,8 @@ import defaultsDeep = require('lodash/defaultsDeep');
import isNumber = require('lodash/isNumber'); import isNumber = require('lodash/isNumber');
import sum = require('lodash/sum'); import sum = require('lodash/sum');
import union = require('lodash/union'); import union = require('lodash/union');
import {Annotations, Config, Data, Datum, ErrorBar, Layout, LayoutAxis, Margin} from 'plotly.js'; import type {Annotations, Config, Datum, ErrorBar, Layout, LayoutAxis, Margin,
PlotData as PlotlyPlotData} from 'plotly.js';
let Plotly: PlotlyType; let Plotly: PlotlyType;
@ -118,6 +119,7 @@ function getSeriesName(series: Series, haveMultiple: boolean) {
} }
} }
type Data = Partial<PlotlyPlotData>;
// The output of a ChartFunc. Normally it just returns one or more Data[] series, but sometimes it // The output of a ChartFunc. Normally it just returns one or more Data[] series, but sometimes it
// includes layout information: e.g. a "Scatter Plot" returns a Layout with axis labels. // includes layout information: e.g. a "Scatter Plot" returns a Layout with axis labels.
@ -421,7 +423,8 @@ Object.assign(ChartView.prototype, BackboneEvents);
function getPlotlyLayout(options: ChartOptions): Partial<Layout> { function getPlotlyLayout(options: ChartOptions): Partial<Layout> {
// Note that each call to getPlotlyLayout() creates a new layout object. We are intentionally // Note that each call to getPlotlyLayout() creates a new layout object. We are intentionally
// avoiding reuse because Plotly caches too many layout calculations when the object is reused. // avoiding reuse because Plotly caches too many layout calculations when the object is reused.
const yaxis: Partial<LayoutAxis> = {}; const yaxis: Partial<LayoutAxis> = {automargin: true, title: {standoff: 0}};
const xaxis: Partial<LayoutAxis> = {automargin: true, title: {standoff: 0}};
if (options.logYAxis) { yaxis.type = 'log'; } if (options.logYAxis) { yaxis.type = 'log'; }
if (options.invertYAxis) { yaxis.autorange = 'reversed'; } if (options.invertYAxis) { yaxis.autorange = 'reversed'; }
return { return {
@ -438,6 +441,7 @@ function getPlotlyLayout(options: ChartOptions): Partial<Layout> {
bgcolor: "#FFFFFF80", bgcolor: "#FFFFFF80",
}, },
yaxis, yaxis,
xaxis,
...(options.stacked ? {barmode: 'relative'} : {}), ...(options.stacked ? {barmode: 'relative'} : {}),
}; };
} }
@ -1067,12 +1071,12 @@ function basicPlot(series: Series[], options: ChartOptions, dataOptions: Data):
return { return {
data: dataSeries, data: dataSeries,
layout: { layout: {
[`${axis1}axis`]: series.length > 0 ? {title: series[0].label} : {}, [`${axis1}axis`]: {title: series.length > 0 ? {text: series[0].label}: {}},
// Include yaxis title for a single y-value series only (2 series total); // Include yaxis title for a single y-value series only (2 series total);
// If there are fewer than 2 total series, there is no y-series to display. // If there are fewer than 2 total series, there is no y-series to display.
// If there are multiple y-series, a legend will be included instead, and the yaxis title // If there are multiple y-series, a legend will be included instead, and the yaxis title
// is less meaningful, so omit it. // is less meaningful, so omit it.
[`${axis2}axis`]: series.length === 2 ? {title: series[1].label} : {}, [`${axis2}axis`]: {title: series.length === 2 ? {text: series[1].label} : {}},
}, },
}; };
} }

@ -51,7 +51,7 @@
"@types/node": "^14", "@types/node": "^14",
"@types/node-fetch": "2.1.2", "@types/node-fetch": "2.1.2",
"@types/pidusage": "2.0.1", "@types/pidusage": "2.0.1",
"@types/plotly.js": "1.44.15", "@types/plotly.js": "2.12.1",
"@types/qrcode": "1.4.2", "@types/qrcode": "1.4.2",
"@types/redlock": "3.0.2", "@types/redlock": "3.0.2",
"@types/saml2-js": "2.0.1", "@types/saml2-js": "2.0.1",
@ -134,7 +134,7 @@
"multiparty": "4.2.2", "multiparty": "4.2.2",
"node-fetch": "2.2.0", "node-fetch": "2.2.0",
"pg": "8.6.0", "pg": "8.6.0",
"plotly.js-basic-dist": "1.51.1", "plotly.js-basic-dist": "2.13.2",
"popper-max-size-modifier": "0.2.0", "popper-max-size-modifier": "0.2.0",
"popweasel": "0.1.18", "popweasel": "0.1.18",
"qrcode": "1.5.0", "qrcode": "1.5.0",

@ -467,10 +467,10 @@
resolved "https://registry.yarnpkg.com/@types/pidusage/-/pidusage-2.0.1.tgz#45eb309be947dcfa177957ef662ce2a0a2311d48" resolved "https://registry.yarnpkg.com/@types/pidusage/-/pidusage-2.0.1.tgz#45eb309be947dcfa177957ef662ce2a0a2311d48"
integrity sha512-tYYcz/+5v/EGYT83C0pIXrJGOiVBLksQvxgJboG4nGqx/gZTvq0Ro4SkAjECqMk7L4Ww58VWB4j48qeYh4/YJg== integrity sha512-tYYcz/+5v/EGYT83C0pIXrJGOiVBLksQvxgJboG4nGqx/gZTvq0Ro4SkAjECqMk7L4Ww58VWB4j48qeYh4/YJg==
"@types/plotly.js@1.44.15": "@types/plotly.js@2.12.1":
version "1.44.15" version "2.12.1"
resolved "https://registry.yarnpkg.com/@types/plotly.js/-/plotly.js-1.44.15.tgz#14d5f72fa1f08c57b1c84666ff5732cbf9b1b534" resolved "https://registry.yarnpkg.com/@types/plotly.js/-/plotly.js-2.12.1.tgz#112a0b322e19de3d61c4fe0213bccc57e6292022"
integrity sha512-hsoML6JX6WnArYbol2xfqRxMPf7x9h7ZhgQ4Ni/jQqDXh+r3XhS0jjnWTsrU+DS2AK872xJ8YjU42KaLhYrmRg== integrity sha512-Nn8tr4TDYYNaTzX+fA8b2V+OHk1cGPoMpiVFRQmlH3ICcwZOlQCCVogHkfRdYaG5/Rqg8B1Wnr+r6GyaSKlC+Q==
dependencies: dependencies:
"@types/d3" "^3" "@types/d3" "^3"
@ -5173,10 +5173,10 @@ pkg-dir@^4.2.0:
dependencies: dependencies:
find-up "^4.0.0" find-up "^4.0.0"
plotly.js-basic-dist@1.51.1: plotly.js-basic-dist@2.13.2:
version "1.51.1" version "2.13.2"
resolved "https://registry.yarnpkg.com/plotly.js-basic-dist/-/plotly.js-basic-dist-1.51.1.tgz#a81f9514ed50ff4660fa5f30caa333318650814f" resolved "https://registry.yarnpkg.com/plotly.js-basic-dist/-/plotly.js-basic-dist-2.13.2.tgz#7ee2386ed7f255afac54305458cda2dc274da08b"
integrity sha512-QnbSF6hzYYXjjfoImSaNDJM05mfCwrgaYc+k5oT4rSmwIeqhRiQE57YMd1BuTEKDpZOwE5OtzMxhfmxx0CbCMQ== integrity sha512-6sXQv3agrwHPot3gtX+UH5VyuTPsMfddigamBAEhHoJXsnAEo5DYiWS6WDnpsD7FZDsDtd7YkBZiymt4eMD7cQ==
pngjs@^5.0.0: pngjs@^5.0.0:
version "5.0.0" version "5.0.0"

Loading…
Cancel
Save