mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-25 23:54:55 +01:00
Restrict image export size.
This commit is contained in:
parent
6ecfa0139b
commit
925ab9e3c2
@ -15,16 +15,15 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { Mindmap } from '../..';
|
|
||||||
import Exporter from './Exporter';
|
import Exporter from './Exporter';
|
||||||
import SVGExporter from './SVGExporter';
|
import SVGExporter from './SVGExporter';
|
||||||
/**
|
/**
|
||||||
* Based on https://mybyways.com/blog/convert-svg-to-png-using-your-browser
|
* Based on https://mybyways.com/blog/convert-svg-to-png-using-your-browser
|
||||||
*/
|
*/
|
||||||
class BinaryImageExporter extends Exporter {
|
class BinaryImageExporter extends Exporter {
|
||||||
private svgElement: Element;
|
private static maxAllowedSize = 10000;
|
||||||
|
|
||||||
private mindmap: Mindmap;
|
private svgElement: Element;
|
||||||
|
|
||||||
private width: number;
|
private width: number;
|
||||||
|
|
||||||
@ -32,10 +31,9 @@ class BinaryImageExporter extends Exporter {
|
|||||||
|
|
||||||
private adjustToFit: boolean;
|
private adjustToFit: boolean;
|
||||||
|
|
||||||
constructor(mindmap: Mindmap, svgElement: Element, width: number, height: number, imgFormat: 'image/png' | 'image/jpeg', adjustToFit = true) {
|
constructor(svgElement: Element, width: number, height: number, imgFormat: 'image/png' | 'image/jpeg', adjustToFit = true) {
|
||||||
super(imgFormat.split('/')[0], imgFormat);
|
super(imgFormat.split('/')[0], imgFormat);
|
||||||
this.svgElement = svgElement;
|
this.svgElement = svgElement;
|
||||||
this.mindmap = mindmap;
|
|
||||||
this.adjustToFit = adjustToFit;
|
this.adjustToFit = adjustToFit;
|
||||||
this.width = width;
|
this.width = width;
|
||||||
this.height = height;
|
this.height = height;
|
||||||
@ -66,6 +64,14 @@ class BinaryImageExporter extends Exporter {
|
|||||||
width = (this.width * dpr);
|
width = (this.width * dpr);
|
||||||
height = (this.height * dpr);
|
height = (this.height * dpr);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Prevents an image too big. Failures seen during export in couple of browsers
|
||||||
|
if (Math.max(width, height) > BinaryImageExporter.maxAllowedSize) {
|
||||||
|
const scale = Math.max(width, height) / BinaryImageExporter.maxAllowedSize;
|
||||||
|
width /= scale;
|
||||||
|
height /= scale;
|
||||||
|
}
|
||||||
|
|
||||||
canvas.setAttribute('width', width.toFixed(0));
|
canvas.setAttribute('width', width.toFixed(0));
|
||||||
canvas.setAttribute('height', height.toFixed(0));
|
canvas.setAttribute('height', height.toFixed(0));
|
||||||
|
|
||||||
|
@ -15,14 +15,13 @@
|
|||||||
* See the License for the specific language governing permissions and
|
* See the License for the specific language governing permissions and
|
||||||
* limitations under the License.
|
* limitations under the License.
|
||||||
*/
|
*/
|
||||||
import { Mindmap } from '../..';
|
|
||||||
import BinaryImageExporter from './BinaryImageExporter';
|
import BinaryImageExporter from './BinaryImageExporter';
|
||||||
import Exporter from './Exporter';
|
import Exporter from './Exporter';
|
||||||
import SVGExporter from './SVGExporter';
|
import SVGExporter from './SVGExporter';
|
||||||
|
|
||||||
type imageType = 'svg' | 'png' | 'jpg';
|
type imageType = 'svg' | 'png' | 'jpg';
|
||||||
class ImageExpoterFactory {
|
class ImageExpoterFactory {
|
||||||
static create(type: imageType, mindmap: Mindmap, svgElement: Element, width: number, height: number, adjustToFit = true): Exporter {
|
static create(type: imageType, svgElement: Element, width: number, height: number, adjustToFit = true): Exporter {
|
||||||
let result: Exporter;
|
let result: Exporter;
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'svg': {
|
case 'svg': {
|
||||||
@ -30,11 +29,11 @@ class ImageExpoterFactory {
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'png': {
|
case 'png': {
|
||||||
result = new BinaryImageExporter(mindmap, svgElement, width, height, 'image/png', adjustToFit);
|
result = new BinaryImageExporter(svgElement, width, height, 'image/png', adjustToFit);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'jpg': {
|
case 'jpg': {
|
||||||
result = new BinaryImageExporter(mindmap, svgElement, width, height, 'image/jpeg', adjustToFit);
|
result = new BinaryImageExporter(svgElement, width, height, 'image/jpeg', adjustToFit);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
default:
|
default:
|
||||||
|
@ -105,7 +105,7 @@ const ExportDialog = ({
|
|||||||
case 'png':
|
case 'png':
|
||||||
case 'jpg':
|
case 'jpg':
|
||||||
case 'svg': {
|
case 'svg': {
|
||||||
exporter = ImageExporterFactory.create(formatType, mindmap, svgElement, size.width, size.height, zoomToFit);
|
exporter = ImageExporterFactory.create(formatType, svgElement, size.width, size.height, zoomToFit);
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case 'wxml':
|
case 'wxml':
|
||||||
|
Loading…
Reference in New Issue
Block a user