here is an example of my md file
%%{init: {'securityLevel': 'loose', 'theme': 'base', 'themeVariables': { 'darkMode': false, 'primaryColor': '#ffaacc', 'fontSize': '14px', 'lineColoe': '#0404ff', 'edgeLabelBackground':'#ffffaa'}}}%%
graph LR
id0[皇马]o==>id2[对]o-->id3[奥尼尔]-->id4[不]-->id5[感]-->id6[兴趣]
the above file is applied in docsify server. and the corresponding js configuration in index.html is like this:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.css">
<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
and
var num = 0;
mermaid.initialize({ startOnLoad: false });
window.$docsify = {
name: '',
repo: '',
el: '#app',
maxLevel: 6,
loadNavbar: true,
loadSidebar: 'summary.md',
themeable: {
readyTransition: true, // default
responsiveTables: true // default
},
markdown: {
renderer: {
code: function (code, lang) {
if (lang === "mermaid") {
return (
'<div class="mermaid">' + mermaid.render('mermaid-svg-' + num++, code) + "</div>"
);
} ;
return this.origin.code.apply(this, arguments);
}
}
}
and I get the graph like this:
and I am confused of the color tuning of the arrows. cause the color of arrows is gray and the color of lines is black.
I wanna change the color of arrows to pure black.
thanks for telling me how to change and config
You must use this sentence:
linkStyle default stroke: black
And this will modify all the links on your diagram. If you want to change a specifically link you can use:
linkStyle 0 stroke: blue
When 0 is the number of link on the chart that you want to change, in the order that you has wrote them.
More info in: https://youtu.be/-XV1JBfhgWo?t=890