Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose minreducedwidth and minreducedheight to API #6307

Merged
merged 14 commits into from
Sep 7, 2022

Conversation

hannahker
Copy link
Contributor

This PR allows these previously global variables to be controlled by the developer, if desired. If specified, these variables will set the minimum height and width of a plot who's size is impacted by automargin.

@archmoj archmoj marked this pull request as ready for review September 2, 2022 14:52
@archmoj
Copy link
Contributor

archmoj commented Sep 2, 2022

@hannahker Thanks very much for the PR 🏅
Looks very good 🏆

Let's also add a jasmine test at the end of test/jasmine/tests/plots_test.js.
Something like:

describe('Test Plots automargin extra', function() {
    var gd;

    beforeEach(function() {
        gd = createGraphDiv();
    });

    afterEach(destroyGraphDiv);

    it('should resize the plot area when twaeking min-reduced width & height', function(done) {
        function assert(attr, exp) {
            var xy = d3Select('rect.nsewdrag')[0][0];
            expect(xy.getAttribute(attr)).toEqual(exp);
        }

        var fig = require('@mocks/z-automargin-minreducedheight.json');

        Plotly.newPlot(gd, fig)
        .then(function() {
            assert('width', '70');
            assert('height', '55');
        })
        .then(function() {
            return Plotly.relayout(gd, 'margin.minreducedheight', 100);
        })
        .then(function() {
            assert('width', '70');
            assert('height', '100');
        })
        .then(function() {
            return Plotly.relayout(gd, 'margin.minreducedwidth', 100);
        })
        .then(function() {
            assert('width', '100');
            assert('height', '100');
        })
        .then(done, done.fail);
    });
});


Plotly.newPlot(gd, fig)
.then(function() {
assert('height', '55');
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @archmoj for suggesting this test. Copied it over here but just dropped a couple of the width assertions as I noticed that this was actually a bit variable when margin.minreducedwidth wasn't specified. For example, I checked between a couple browsers and saw plot widths of both 64px and 71px initially. Do you know why this would be?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I bet it is related to each OS+browser rendering fonts slightly differently.
FYI - We mainly use Chrome on CircleCI; but we also have tests using Firefox.
You may consider testing the initial width values to be in a range thanks to Jasmine's toBeCloseTo.

dflt: 64,
editType: 'plot',
description: 'Minimum height of the plot with automargin applied (in px)'
},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@alexcjohnson Is there a better place to put these new attributes in?
It looks like these are related to automargin not margin itself.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@archmoj and I discussed this a bit earlier today, and I think the conclusion we came to was: because margin.autoexpand controls whether or not these attributes are even relevant, (1) they should stay here, so they're in the same container as autoexpand, and (2) if autoexpand is false we shouldn't even coerce these two new ones. (The general rule is, if an attribute doesn't do anything because of the value of some other attribute(s), it should not be coerced)

The only question is whether it's really true that these attributes are irrelevant when autoexpand=false. According to its description this would disable automargin from "Legends, colorbars, updatemenus, sliders, axis rangeselector and rangeslider" but what if xaxis.automargin=true? Maybe then the margins can still be pushed even if margin.autoexpand=false? That needs to be tested before we make coercion conditional on margin.autoexpand - but even if that's the case I think it makes sense to leave these attributes where they are.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addressed in 93b05d3.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes, @archmoj and I looked into the source code and decided that these attributes would be best placed at the top level of layout parameters as they could be related to autoexpand as well (and I think logically make sense alongside height and width).

@hannahker
Copy link
Contributor Author

@archmoj all tests are passing now except the no-gl-jasmine, which is erroring with with this stack trace:

Do you know what might be going on here? I've had these tests all pass in a previous run (and haven't updated the code since).

An error was thrown in afterAll
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/choroplethmapbox_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/choroplethmapbox_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/choroplethmapbox_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/domain_ref_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/domain_ref_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/domain_ref_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/funnelarea_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/funnelarea_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/funnelarea_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/hover_label_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/hover_label_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/hover_label_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/lib_drawing_buffer_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/lib_drawing_buffer_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/lib_drawing_buffer_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/pie_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/pie_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/pie_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/sankey_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/sankey_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/sankey_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/select_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/select_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/select_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/template_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/template_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/template_test.js:1:34
  Uncaught Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/validate_test.js'
  Error: Cannot find module '/home/circleci/plotly.js/test/jasmine/tests/validate_test.js'
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:167)
      at o (/tmp/node_modules/browser-pack/_prelude.js:1:1 <- /tmp/7ad18eaf7ea1973ff3ad278d0022cb57.browserify.js:1:133)
      at test/jasmine/tests/validate_test.js:1:34

Chrome 93.0.4577.63 (Linux x86_64): Executed 0 of 0 ERROR (0.046 secs / 0 secs)


Chrome 93.0.4577.63 (Linux x86_64): Executed 0 of 0 ERROR (0.049 secs / 0 secs)


all 2 runs failed, moving on.

Exited with code exit status 1

CircleCI received exit code 1

Fix variable references

Fix formatting
@archmoj
Copy link
Contributor

archmoj commented Sep 7, 2022

@hannahker as one final note, please also provide draftlogs/6307_add.md file as described here.
You can simply reuse the PR description :)
Thank you!

Copy link
Collaborator

@alexcjohnson alexcjohnson left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💃 LGTM!

@archmoj archmoj merged commit 259c942 into master Sep 7, 2022
@archmoj archmoj deleted the minfinal-width-height branch September 7, 2022 20:34
kMutagene added a commit to plotly/Plotly.NET that referenced this pull request Feb 8, 2023
…r increasing control over automargin (plotly/plotly.js#6307), Fix unused attributes in Layout.init and Chart.withLayoutStyle
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature something new
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants