-
Notifications
You must be signed in to change notification settings - Fork 0
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
Feature/snapshot #1
Conversation
…g the snapshot button
I just ran the jasmine tests, and the old tests pass even with our changes, but this is because the tests only test |
var Lib = Plotly.Lib; | ||
|
||
// check for undefined opts | ||
opts = (opts) ? opts : {}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we would usually write opts = opts || {};
in situations like this one.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
guessing same for the next line as well
opts.format = opts.format || 'png';
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes
@timelyportfolio I feel like our discussion here and on plotly#83 hasn't put forward any hard requirements for this issue, let me write them down here:
var img = document.createElement('img');
document.body.append(img);
Plotly.newPlot('myDiv', data, layout)
.then(Plotly.toImage)
.then(function(url){ img.src = url });
|
I believe I made all the changes mentioned in the line notes. However, I need to return the @etpinard, do you envision a |
@etpinard, I'll try to summarize the current status of this pull, since a lot has been circular.
|
@timelyportfolio you're on the right track for sure. 👍 for points 1 to 3. As I'll make a few styling comments on the modified lines directly. |
|
||
ev.clean(); | ||
}); | ||
click: function(gd){ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
function(gd) {
} | ||
|
||
gd._snapshotInProgress = true; | ||
Lib.notifier('Taking snapshot - this may take a few seconds', 'long'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this notifier should be omitted in Plotly.downloadImage
.
… add filename `opts` for download
var promise = toImage(gd, opts); | ||
|
||
var filename = gd.fn || 'newplot'; | ||
var filename = opts.filename || gd.fn || 'newplot'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nice 👍
I rebased to the current master and squashed all the commits into one in this |
@etpinard, I just made some tests for
|
@timelyportfolio to ensure that we test everything about var createElement = document.createElement;
beforeAll(function() {
document.createElement = function(args) {
var el = createElement.call(document, args);
el.click = function() {};
return el;
}
});
afterAll(function() {
document.createElement = createElement;
}); |
close in favor of plotly#446 |
Legend item wrap with layout.legend.orientation = h
Better Snapshot
Reference: plotly #83
Objectives
toImage
method directly toPlotly
.toImage
and/or the snapshot modebar button.1) Attach
toImage
The easiest way to attach
toImage
would be to piggyback off the existing snapshot modebar button, since the snapshot buttonclick
method best handles this from start to finish.See codepen for how we can currently accomplish this.
While this works, this is an unworkable approach. First, we assume that the modebar exists and contains the snapshot button. To get around this, perhaps we could generalize the snapshotclick
handler and make it available outside of the modebar context in snapshot. Currently, the click handler is specified in these lines, so its broader usefulness is limited. In cff741a, I took a first pass at a newtoSnapshot
method inPlotly.Snapshot
.I misunderstood the objective. We want to attach
toImage
toPlotly
, so let's try again. Wait to do this until the other steps are complete.2) Use promises
I forgot that we want
toImage
to return a promise. It seems that we should replace theEV
/EventEmitter
withPromises
. I see two places where this replacement needs to happen in the pipelinesvgtoimg
andtoimage
. I was able to get this "working" in 937340c and ac86931. Although it works, I am not sure the changes follow Plotly's conventions. Here is a quick example of what we can do now with promises using codepen example.3) Allow resize
We'll need to do two things to accomplish this task. One, I think is fairly easy, and requires the ability to pass
height
andwidth
in theopts
argument oftoImage
toclonePlot
. 760a93b is my first try at this. It seems to work. Second, we'll need to come up with the UI to specifyheight
andwidth
. I looked around the Plotly codebase for a modal or similar UI that I could mimic, but I did not find anything. If we do a modal, it seems like we should put it inLib
similar tonotifier
. At a minimum, the UI should have textareas forheight
andwidth
. If possible, though, it would be nice to get a live updating preview to reflect the changes to theheight
andwidth
. While this is nice, I don't think it is necessary.