mirror of
https://github.com/niklasvh/html2canvas.git
synced 2023-08-10 21:13:10 +03:00
backgroundPosition should use backgroundSize as a baseline for %'s
This commit is contained in:
parent
9b5ae9e191
commit
eb57b61859
10
src/Core.js
10
src/Core.js
@ -267,7 +267,7 @@ _html2canvas.Util.resizeBounds = function( current_width, current_height, target
|
|||||||
return { width: output_width, height: output_height };
|
return { width: output_width, height: output_height };
|
||||||
};
|
};
|
||||||
|
|
||||||
function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
|
function backgroundBoundsFactory( prop, el, bounds, image, imageIndex, backgroundSize ) {
|
||||||
var bgposition = _html2canvas.Util.getCSS( el, prop, imageIndex ) ,
|
var bgposition = _html2canvas.Util.getCSS( el, prop, imageIndex ) ,
|
||||||
topPos,
|
topPos,
|
||||||
left,
|
left,
|
||||||
@ -287,7 +287,7 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
|
|||||||
percentage = (parseFloat(bgposition[0])/100);
|
percentage = (parseFloat(bgposition[0])/100);
|
||||||
left = bounds.width * percentage;
|
left = bounds.width * percentage;
|
||||||
if(prop !== 'backgroundSize') {
|
if(prop !== 'backgroundSize') {
|
||||||
left -= image.width*percentage;
|
left -= (backgroundSize || image).width*percentage;
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
@ -315,7 +315,7 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
|
|||||||
percentage = (parseFloat(bgposition[1])/100);
|
percentage = (parseFloat(bgposition[1])/100);
|
||||||
topPos = bounds.height * percentage;
|
topPos = bounds.height * percentage;
|
||||||
if(prop !== 'backgroundSize') {
|
if(prop !== 'backgroundSize') {
|
||||||
topPos -= image.height * percentage;
|
topPos -= (backgroundSize || image).height * percentage;
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
@ -326,8 +326,8 @@ function backgroundBoundsFactory( prop, el, bounds, image, imageIndex ) {
|
|||||||
return [left, topPos];
|
return [left, topPos];
|
||||||
}
|
}
|
||||||
|
|
||||||
_html2canvas.Util.BackgroundPosition = function( el, bounds, image, imageIndex ) {
|
_html2canvas.Util.BackgroundPosition = function( el, bounds, image, imageIndex, backgroundSize ) {
|
||||||
var result = backgroundBoundsFactory( 'backgroundPosition', el, bounds, image, imageIndex );
|
var result = backgroundBoundsFactory( 'backgroundPosition', el, bounds, image, imageIndex, backgroundSize );
|
||||||
return { left: result[0], top: result[1] };
|
return { left: result[0], top: result[1] };
|
||||||
};
|
};
|
||||||
_html2canvas.Util.BackgroundSize = function( el, bounds, image, imageIndex ) {
|
_html2canvas.Util.BackgroundSize = function( el, bounds, image, imageIndex ) {
|
||||||
|
26
src/Parse.js
26
src/Parse.js
@ -555,28 +555,28 @@ _html2canvas.Parse = function (images, options) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function renderBackgroundNoRepeat(ctx, image, backgroundPosition, x, y, w, h) {
|
function renderBackgroundNoRepeat(ctx, image, backgroundPosition, x, y, w, h) {
|
||||||
var bgdw = w, // - backgroundPosition.left,
|
var bgdw = w - backgroundPosition.left,
|
||||||
bgdh = h, // - backgroundPosition.top,
|
bgdh = h - backgroundPosition.top,
|
||||||
bgsx = backgroundPosition.left,
|
bgsx = backgroundPosition.left,
|
||||||
bgsy = backgroundPosition.top,
|
bgsy = backgroundPosition.top,
|
||||||
bgdx = backgroundPosition.left + x,
|
bgdx = backgroundPosition.left + x,
|
||||||
bgdy = backgroundPosition.top + y;
|
bgdy = backgroundPosition.top + y;
|
||||||
|
|
||||||
if (bgsx<0){
|
if (bgsx<0){
|
||||||
bgsx = Math.abs(bgsx);
|
bgsx = Math.abs( bgsx );
|
||||||
bgdx += bgsx;
|
bgdx += bgsx;
|
||||||
bgdw = Math.min(w,image.width-bgsx);
|
bgdw = Math.min( w, image.width - bgsx );
|
||||||
} else {
|
} else {
|
||||||
bgdw = Math.min(bgdw,image.width);
|
bgdw = Math.min( bgdw, image.width );
|
||||||
bgsx = 0;
|
bgsx = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (bgsy < 0){
|
if (bgsy < 0){
|
||||||
bgsy = Math.abs(bgsy);
|
bgsy = Math.abs( bgsy );
|
||||||
bgdy += bgsy;
|
bgdy += bgsy;
|
||||||
bgdh = Math.min(h, image.height - bgsy);
|
bgdh = Math.min( h, image.height - bgsy );
|
||||||
} else {
|
} else {
|
||||||
bgdh = Math.min(bgdh, image.height);
|
bgdh = Math.min( bgdh, image.height );
|
||||||
bgsy = 0;
|
bgsy = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -590,8 +590,8 @@ _html2canvas.Parse = function (images, options) {
|
|||||||
image.height,
|
image.height,
|
||||||
bgdx,
|
bgdx,
|
||||||
bgdy,
|
bgdy,
|
||||||
bgdw,
|
bgdw + backgroundPosition.left,
|
||||||
bgdh
|
bgdh + backgroundPosition.top
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -634,9 +634,9 @@ _html2canvas.Parse = function (images, options) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function renderBackgroundRepeating(el, bounds, ctx, image, imageIndex) {
|
function renderBackgroundRepeating(el, bounds, ctx, image, imageIndex) {
|
||||||
var backgroundPosition = _html2canvas.Util.BackgroundPosition(el, bounds, image, imageIndex),
|
var backgroundSize = _html2canvas.Util.BackgroundSize(el, bounds, image, imageIndex),
|
||||||
backgroundRepeat = getCSS(el, "backgroundRepeat").split(","),
|
backgroundPosition = _html2canvas.Util.BackgroundPosition(el, bounds, image, imageIndex, backgroundSize),
|
||||||
backgroundSize = _html2canvas.Util.BackgroundSize(el, bounds, image, imageIndex);
|
backgroundRepeat = getCSS(el, "backgroundRepeat").split(",");
|
||||||
|
|
||||||
backgroundRepeat = backgroundRepeat[imageIndex] || backgroundRepeat[0];
|
backgroundRepeat = backgroundRepeat[imageIndex] || backgroundRepeat[0];
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user