Hello,
Implementing jsmind into our project and quite happy with the result but for some reason, i'm running into the following issue:
When i load the mindmap for the the first time, the root node is not centered.
If i clear it and load it again, it is centered.
I did change the css as follow to have the root node multiline and adjust a bit the expander that wasn't well aligned:
jmnode{
font: 14px/1.125 Verdana, Arial, Helvetica, sans-serif;
}
jmnode.root{
font-size: 16px;
text-align: center;
max-width: 350px;
white-space: normal!important;
text-overflow: inherit!important;
}
jmexpander {
width: 13px!important;
height: 13px!important;
line-height: 8px!important;
font-size: 16px!important;
}
and in js (vue3 application) i do the following:
// on page load only in onMounted() event
var options = {
container:'jsmind_container',
editable:false,
theme:'primary',
view: {
engine: 'svg',
line_color:'#83bcea',
zoom: {
min: 0.5,
max: 2,
step: 0.1
},
draggable: true,
hide_scrollbars_when_draggable: true
}
};
jm = new window.jsMind(options);
// on click event on a button to display the mindmap
var entries = { /* data */ }
var mind = {
"meta":{
"name":"Brainstorming",
"author":"hizzgdev@163.com",
"version":"0.2"
},
"format":"node_tree",
"data":{"id":"root", "topic": brainstorming.question, "children": entries}
};
jm.show(mind);
// if i uncomment the following and call show twice in a row, it is centered right away
// jm.show(mind);
Any idea what i could be missing?
Hello,
Implementing jsmind into our project and quite happy with the result but for some reason, i'm running into the following issue:
When i load the mindmap for the the first time, the root node is not centered.
If i clear it and load it again, it is centered.
I did change the css as follow to have the root node multiline and adjust a bit the expander that wasn't well aligned:
and in js (vue3 application) i do the following:
Any idea what i could be missing?