mirror of
https://github.com/mermaid-js/mermaid.git
synced 2025-09-17 22:39:56 +02:00
Cherry pick of config changes
This commit is contained in:
@@ -21,6 +21,7 @@
|
|||||||
<body>
|
<body>
|
||||||
<h1>info below</h1>
|
<h1>info below</h1>
|
||||||
<div class="mermaid" style="width: 100%; height: 20%;">
|
<div class="mermaid" style="width: 100%; height: 20%;">
|
||||||
|
%%{init: {'theme': 'base', 'fontFamily': 'arial', 'themeVariables': { 'primaryColor': '#ff0000'}}}%%
|
||||||
classDiagram-v2
|
classDiagram-v2
|
||||||
class BankAccount{
|
class BankAccount{
|
||||||
+String owner
|
+String owner
|
||||||
@@ -42,6 +43,15 @@
|
|||||||
<<interface>> classB
|
<<interface>> classB
|
||||||
classB : method2() int
|
classB : method2() int
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="mermaid" style="width: 100%; height: 20%;">
|
||||||
|
classDiagram-v2
|
||||||
|
|
||||||
|
classA -- classB : Inheritance
|
||||||
|
classA -- classC : link
|
||||||
|
classC -- classD : link
|
||||||
|
classB -- classD
|
||||||
|
</div>
|
||||||
<script src="./mermaid.js"></script>
|
<script src="./mermaid.js"></script>
|
||||||
<script>
|
<script>
|
||||||
mermaid.parseError = function (err, hash) {
|
mermaid.parseError = function (err, hash) {
|
||||||
@@ -56,7 +66,10 @@
|
|||||||
// gantt: { axisFormat: '%m/%d/%Y' },
|
// gantt: { axisFormat: '%m/%d/%Y' },
|
||||||
sequence: { actorMargin: 50, showSequenceNumbers: true },
|
sequence: { actorMargin: 50, showSequenceNumbers: true },
|
||||||
// sequenceDiagram: { actorMargin: 300 } // deprecated
|
// sequenceDiagram: { actorMargin: 300 } // deprecated
|
||||||
fontFamily: '"arial", sans-serif',
|
// fontFamily: '"arial", sans-serif',
|
||||||
|
// themeVariables: {
|
||||||
|
// fontFamily: '"arial", sans-serif',
|
||||||
|
// },
|
||||||
curve: 'linear',
|
curve: 'linear',
|
||||||
securityLevel: 'loose'
|
securityLevel: 'loose'
|
||||||
});
|
});
|
||||||
|
@@ -49,7 +49,6 @@ export const updateCurrentConfig = (siteCfg, _directives) => {
|
|||||||
* @returns {*} - the siteConfig
|
* @returns {*} - the siteConfig
|
||||||
*/
|
*/
|
||||||
export const setSiteConfig = conf => {
|
export const setSiteConfig = conf => {
|
||||||
console.warn('Setting site config');
|
|
||||||
siteConfig = assignWithDepth({}, defaultConfig);
|
siteConfig = assignWithDepth({}, defaultConfig);
|
||||||
siteConfig = assignWithDepth(siteConfig, conf);
|
siteConfig = assignWithDepth(siteConfig, conf);
|
||||||
|
|
||||||
@@ -138,6 +137,15 @@ export const sanitize = options => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export const addDirective = directive => {
|
export const addDirective = directive => {
|
||||||
|
if (directive.fontFamily) {
|
||||||
|
if (!directive.themeVariables) {
|
||||||
|
directive.themeVariables = { fontFamily: directive.fontFamily };
|
||||||
|
} else {
|
||||||
|
if (!directive.themeVariables.fontFamily) {
|
||||||
|
directive.themeVariables = { fontFamily: directive.fontFamily };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
directives.push(directive);
|
directives.push(directive);
|
||||||
updateCurrentConfig(siteConfig, directives);
|
updateCurrentConfig(siteConfig, directives);
|
||||||
};
|
};
|
||||||
|
@@ -220,7 +220,7 @@ const render = function(id, _txt, cb, container) {
|
|||||||
// console.warn('Render fetching config');
|
// console.warn('Render fetching config');
|
||||||
|
|
||||||
const cnf = configApi.getConfig();
|
const cnf = configApi.getConfig();
|
||||||
console.warn('Render with config after adding new directives', cnf.themeVariables.primaryColor);
|
console.warn('Render with config after adding new directives', cnf.fontFamily);
|
||||||
// Check the maximum allowed text size
|
// Check the maximum allowed text size
|
||||||
if (_txt.length > cnf.maxTextSize) {
|
if (_txt.length > cnf.maxTextSize) {
|
||||||
txt = 'graph TB;a[Maximum text size in diagram exceeded];style a fill:#faa';
|
txt = 'graph TB;a[Maximum text size in diagram exceeded];style a fill:#faa';
|
||||||
@@ -553,6 +553,18 @@ function reinitialize() {
|
|||||||
|
|
||||||
function initialize(options) {
|
function initialize(options) {
|
||||||
console.warn(`mermaidAPI.initialize: v${pkg.version} `, options);
|
console.warn(`mermaidAPI.initialize: v${pkg.version} `, options);
|
||||||
|
|
||||||
|
// Handle legacy location of font-family configuration
|
||||||
|
// console.warn('Conf - ', options.themeVariables.fontFamily);
|
||||||
|
if (options.fontFamily) {
|
||||||
|
if (!options.themeVariables) {
|
||||||
|
options.themeVariables = { fontFamily: options.fontFamily };
|
||||||
|
} else {
|
||||||
|
if (!options.themeVariables.fontFamily) {
|
||||||
|
options.themeVariables = { fontFamily: options.fontFamily };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
// Set default options
|
// Set default options
|
||||||
|
|
||||||
if (options && options.theme && theme[options.theme]) {
|
if (options && options.theme && theme[options.theme]) {
|
||||||
|
@@ -29,6 +29,7 @@ const themes = {
|
|||||||
export const calcThemeVariables = (theme, userOverRides) => theme.calcColors(userOverRides);
|
export const calcThemeVariables = (theme, userOverRides) => theme.calcColors(userOverRides);
|
||||||
|
|
||||||
const getStyles = (type, userStyles, options) => {
|
const getStyles = (type, userStyles, options) => {
|
||||||
|
console.warn('options in styles: ', options);
|
||||||
return ` {
|
return ` {
|
||||||
font-family: ${options.fontFamily};
|
font-family: ${options.fontFamily};
|
||||||
font-size: ${options.fontSize};
|
font-size: ${options.fontSize};
|
||||||
|
Reference in New Issue
Block a user