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

Merge pull request #1285 from mermaid-js/bug/1269_fix_label_background_on_safari

Browse Source 
Bug/1269 fix label background on safari
This commit is contained in:
Knut Sveidqvist
2020-02-29 15:49:23 +01:00
committed by GitHub
parent df6c5dd22e 756927b6f8
commit de11dc43ab
2 changed files with 25 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
cypress/platform/current.html
View File

@@ -20,15 +20,10 @@
<h1>info below</h1>
<div style="display: flex;width: 100%; height: 100%">
<div class="mermaid" style="width: 100%; height: 100%">
sequenceDiagram
Alice->>John: Hello John, how are you?
loop Healthcheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
stateDiagram
O --> A : ong line using<br/>should work<br/>should work<br/>should work
A --> B : ong line using<br/>should work
B --> C : Sing line
</div>
</div>

26
src/diagrams/state/shapes.js
View File

@@ -4,6 +4,7 @@ import stateDb from './stateDb';
import utils from '../../utils';
import common from '../common/common';
import { getConfig } from '../../config';
import { logger } from '../../logger';
// let conf;
@@ -456,6 +457,9 @@ export const drawEdge = function(elem, path, relation) {
let titleHeight = 0;
const titleRows = [];
let maxWidth = 0;
let minX = 0;
for (let i = 0; i <= rows.length; i++) {
const title = label
.append('text')
@@ -464,27 +468,39 @@ export const drawEdge = function(elem, path, relation) {
.attr('x', x)
.attr('y', y + titleHeight);
const boundstmp = title.node().getBBox();
maxWidth = Math.max(maxWidth, boundstmp.width);
minX = Math.min(minX, boundstmp.x);
logger.info(boundstmp.x, x, y + titleHeight);
if (titleHeight === 0) {
const titleBox = title.node().getBBox();
titleHeight = titleBox.height;
logger.info('Title height', titleHeight, y);
}
titleRows.push(title);
}
let boxHeight = titleHeight * rows.length;
if (rows.length > 1) {
const heightAdj = rows.length * titleHeight * 0.25;
const heightAdj = (rows.length - 1) * titleHeight * 0.5;
titleRows.forEach((title, i) => title.attr('y', y + i * titleHeight - heightAdj));
boxHeight = titleHeight * rows.length;
}
const bounds = label.node().getBBox();
label
.insert('rect', ':first-child')
.attr('class', 'box')
.attr('x', bounds.x - getConfig().state.padding / 2)
.attr('y', bounds.y - getConfig().state.padding / 2)
.attr('width', bounds.width + getConfig().state.padding)
.attr('height', bounds.height + getConfig().state.padding);
.attr('x', x - maxWidth / 2 - getConfig().state.padding / 2)
.attr('y', y - boxHeight / 2 - getConfig().state.padding / 2 - 3.5)
.attr('width', maxWidth + getConfig().state.padding)
.attr('height', boxHeight + getConfig().state.padding);
logger.info(bounds);
//label.attr('transform', '0 -' + (bounds.y / 2));