Comments (12)
Hi. It's not a big deal. You can use the following code snippets to implement this feature:
$('#chart-container').orgchart({
'data' : datascource,
'createNode': function($node, data) {
if (data.name === 'Keyser Soze') {
$node.append(<div class="assistant">Kobayashi</div>);
}
}
});
from orgchart.
Ye, but how it will work with rendered structure :
we have space between node1 and node2 we must have space to add assistant
from orgchart.
It doesn't matter. You just need to append some styles of node to enlarge the distance between normal nodes in horizontally and then you will got the large enough space to place the assistant node. For example:
.orgchart .node {
margin: 0 30px;
}
On the other hand, you also need to append relative position settings for assistant node.
from orgchart.
Another proposal, I think it will be better if we remain the distance between normal nodes and add show/hide effects for assistant nodes. If I were you, I would add icon standing for assistant role into the content section of normal node and toggle the assistant node by clicking the icon. By doing so, we can save lots of space to show more nodes and hierarchies.
from orgchart.
drag and drop in IE is not working.can you do needful.
from orgchart.
Hi @HariBabuThubati , which version of your IE browser ?
from orgchart.
Hi dabeng, IE11 i am using.
from orgchart.
in fact, I have tested drag&drop feature on IE 11, it works well. So I wanna know did you change any core code snippets of drag&drop example?
from orgchart.
Hi dabeng, i just download and ran the example for drag drop.
from orgchart.
Hi @HariBabuThubati ,
This line in lib. is responsible for drag and drop problem in IE.
event.originalEvent.dataTransfer.setData('text/html', 'hack for firefox');
// line 674
Kindly wrap this line inside a check, so it only executes in firefox. You will be good to go.
from orgchart.
Thank you guys for your deep insight. This bug has been fixed in version 1.1.4.
from orgchart.
Hi @dabeng, i want to have chart similar as what @wispoz did. I already tried your suggestions too.
Here is my orgchart:
But, since Employee 2 only need 1 assistant-node, so I use margin-right only and here is the result:
The problem is, I want the 'top-line' in the middle of 'Employee 2' node not in between 'Employee 2' node and asisstant-node.
Is it possible to do that? I already tried but still can't get what I want.
from orgchart.
Related Issues (20)
- 如何通过参数设置隐藏兄弟节点 HOT 1
- 请问大佬data-prop-compact.html这个demo是不是有异常 HOT 3
- not able export chart in png roper
- ajaxURL HOT 2
- Sort siblings HOT 1
- orgchart with nodes of different widths don't work HOT 1
- drag & drop the nodes of orgchart don't work
- multiple-layers chart don't work HOT 1
- specific children of a certain branch of the chart to be displayed as vertical. the possibility to set VerticalLevel by data don't work. HOT 1
- I want to using 'compact' and 'verticalLevel' option together.
- Option to see that nodes have relations (parent/son/sibling) although they may not be visible without hovering over nodes individually HOT 2
- If you call oc.init(...) multiple times, some values are not reset resulting in unexpected behavior.
- Combining collapsed and hybrid modes
- options.compact() does not prevail over data.compact (as documented)
- Copying and pasting a CDN link directly can result in errors.
- 为增加兄弟节点函数增加指定增加到右边的参数选项
- rendering graph in bullet list format HOT 1
- orgchart() undefined
- Wrap Edges in button tags (Accessibility)
- How can I implement dabeng/OrgChart to livewire app
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from orgchart.