mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2024-11-22 21:26:10 +03:00
Code Issues Projects Releases Wiki Activity

demo update

Browse Source
This commit is contained in:
Tom 2022-12-06 17:21:03 -05:00
parent 66b4b29424
commit 524b42c778
2 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/viewport.js
View File

@ -801,10 +801,10 @@ $.Viewport.prototype = {
* Returns bounds taking constraints into account * Returns bounds taking constraints into account
* Added to improve constrained panning * Added to improve constrained panning
* @param {Boolean} current - Pass true for the current location; defaults to false (target location). * @param {Boolean} current - Pass true for the current location; defaults to false (target location).
* @returns {OpenSeadragon.Rect} The bounds after applying constraints. The returned $.Rect contains additonal * @returns {OpenSeadragon.Rect} The bounds in viewport coordinates after applying constraints. The returned $.Rect
* properties constraintsApplied, xConstrained and yConstrained. These flags indicate * contains additonal properties constraintsApplied, xConstrained and yConstrained.
* whether the viewport bounds were modified by the constraints of the viewer rectangle, * These flags indicate whether the viewport bounds were modified by the constraints
* and in which dimension(s). * of the viewer rectangle, and in which dimension(s).
*/ */
getConstrainedBounds: function(current) { getConstrainedBounds: function(current) {
var bounds, var bounds,

12
test/demo/fitboundswithconstraints.html
View File

@ -12,9 +12,10 @@
border:thin black solid; border:thin black solid;
margin-right:20px; margin-right:20px;
} }
#buttons button{
#controls li { width:10em;
cursor: pointer; text-align:center;
margin:5px;
} }
.layout{ .layout{
display:grid; display:grid;
@ -63,7 +64,7 @@ setTimeout(() => viewport.applyConstraints(), 1000);</pre>
</div> </div>
<button id="rotate">Rotate the viewer</button> <button id="rotate">Rotate the viewer</button>
<h3>Click to fit overlay bounds:</h3> <h3>Click to fit overlay bounds:</h3>
<ul></ul> <div id="buttons"></div>
<h4>overlay.getBounds(viewer.viewport):</h4> <h4>overlay.getBounds(viewer.viewport):</h4>
<pre class="bounds">Pick an overlay above to show the bounds</pre> <pre class="bounds">Pick an overlay above to show the bounds</pre>
</div> </div>
@ -122,7 +123,8 @@ setTimeout(() => viewport.applyConstraints(), 1000);</pre>
viewer.currentOverlays.forEach(overlay=>{ viewer.currentOverlays.forEach(overlay=>{
var text = $(overlay.element).text(); var text = $(overlay.element).text();
$('<li>').text(text).appendTo('#controls ul').on('click',()=>{ var div=$('<div>').appendTo('#buttons');
var buttons=$('<button>').text(text).appendTo(div).on('click',()=>{
var bounds = overlay.getBounds(viewer.viewport); var bounds = overlay.getBounds(viewer.viewport);
$('.bounds').text(JSON.stringify(bounds,null,2)); $('.bounds').text(JSON.stringify(bounds,null,2));