marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-09-17 06:20:07 +02:00
Code Issues Packages Projects Releases Wiki Activity

Updated viewBox settings

Browse Source
This commit is contained in:
Knut Sveidqvist
2022-08-27 15:03:29 +02:00
parent 0779c39654
commit 2968b400c4
4 changed files with 60 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/utils.js
View File

@@ -742,12 +742,12 @@ const d3Attrs = function (d3Elem, attrs) {
*/
export const calculateSvgSizeAttrs = function (height, width, useMaxWidth) {
let attrs = new Map();
attrs.set('height', height);
// attrs.set('height', height);
if (useMaxWidth) {
attrs.set('width', '100%');
attrs.set('style', `max-width: ${width}px;`);
attrs.set('style', `max-width: ${width * 1.2}px;`);
} else {
attrs.set('width', width);
attrs.set('width', width * 1.2);
}
return attrs;
};
@@ -769,8 +769,12 @@ export const setupGraphViewbox = function (graph, svgElem, padding, useMaxWidth)
const sWidth = svgBounds.width;
const sHeight = svgBounds.height;
log.info(`SVG bounds: ${sWidth}x${sHeight}`, svgBounds);
let width = graph._label.width;
let height = graph._label.height;
log.info(`Graph bounds: ${width}x${height}`, graph);
let tx = 0;
let ty = 0;
if (sWidth > width) {
@@ -785,11 +789,16 @@ export const setupGraphViewbox = function (graph, svgElem, padding, useMaxWidth)
ty = (sHeight - height) / 2 + padding;
height = sHeight + padding * 2;
}
log.info(`Calculated bounds: ${width}x${height}`);
configureSvgSize(svgElem, height, width, useMaxWidth);
// Ensure the viewBox includes the whole svgBounds area with extra space for padding
const vBox = `0 0 ${width} ${height}`;
log.debug(
// const vBox = `0 0 ${width} ${height}`;
const vBox = `${svgBounds.x - padding} ${svgBounds.y - padding} ${
svgBounds.width + 2 * padding
} ${svgBounds.height + 2 * padding}`;
log.info(
'Graph.label',
graph._label,
'swidth',
@@ -808,7 +817,7 @@ export const setupGraphViewbox = function (graph, svgElem, padding, useMaxWidth)
vBox
);
svgElem.attr('viewBox', vBox);
svgElem.select('g').attr('transform', `translate(${tx}, ${ty})`);
// svgElem.select('g').attr('transform', `translate(${tx}, ${ty})`);
};
export const initIdGenerator = class iterator {