Skip to content

Commit 5dcdc29

Browse files
committed
Merge branch 'master' into bugfix/479-getNodeState-vertical-nodes
# Conflicts: # dist/js/jquery.orgchart.min.js # dist/js/jquery.orgchart.min.js.map
2 parents 3963936 + 2bb9f05 commit 5dcdc29

File tree

12 files changed

+9533
-4071
lines changed

12 files changed

+9533
-4071
lines changed

README.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
![OrgChart](http://dabeng.github.io/OrgChart/img/orgchart-heading.png)
22

33
# [Vue.js Version](https://github.com/dabeng/vue-orgchart)
4-
# [Native JavaScript(ES6) Version](http://github.com/dabeng/OrgChart.js)
4+
# [ES6 Version](http://github.com/dabeng/OrgChart.js)
55
# [Web Components Version](http://github.com/dabeng/OrgChart-Webcomponents)
66

77
## Foreword
@@ -18,7 +18,7 @@
1818
- Supports exporting chart as a picture or pdf document.
1919
- Supports pan and zoom
2020
- Users can adopt multiple solutions to build up a huge organization chart(please refer to multiple-layers or hybrid layout sections)
21-
- touch-enabled plugin for mobile divice
21+
- touch-enabled plugin for mobile device
2222

2323
## CDN
2424
Users could find the related CDN support for OrgChart's CSS and JavaScript.
@@ -94,7 +94,7 @@ Users are allowed to drag & drop the nodes of orgchart when option "draggable" i
9494

9595
Furthermore, users can make use of option dropCriteria to inject their custom limitations on drag & drop. As shown below, we don't want an manager employee to be under a engineer under no circumstance.
9696

97-
- [I want a method that can decribe the hierarchy of orgchart](https://rawgit.com/dabeng/OrgChart/master/demo/get-hierarchy.html)
97+
- [I want a method that can describe the hierarchy of orgchart](https://rawgit.com/dabeng/OrgChart/master/demo/get-hierarchy.html)
9898

9999
That's where getHierarchy() comes in.
100100

@@ -221,10 +221,10 @@ var oc = $('#chartContainerId').orgchart(options);
221221
<td>nodeId</td><td>string</td><td>no</td><td>"id"</td><td>It sets one property of datasource as unique identifier of every orgchart node.</td>
222222
</tr>
223223
<tr>
224-
<td>nodeTemplate</td><td>function</td><td>no</td><td></td><td>It's a template generation function used to customize any complex internal structure of node. It recieves only one parameter: "data" stands for json datasoure which will be use to render one node.</td>
224+
<td>nodeTemplate</td><td>function</td><td>no</td><td></td><td>It's a template generation function used to customize any complex internal structure of node. It receives only one parameter: "data" stands for json datasoure which will be use to render one node.</td>
225225
</tr>
226226
<tr>
227-
<td>createNode</td><td>function</td><td>no</td><td></td><td>It's a callback function used to customize every orgchart node. It recieves two parameters: "$node" stands for jquery object of single node div; "data" stands for datasource of single node.</td>
227+
<td>createNode</td><td>function</td><td>no</td><td></td><td>It's a callback function used to customize every orgchart node. It receives two parameters: "$node" stands for jquery object of single node div; "data" stands for datasource of single node.</td>
228228
</tr>
229229
<tr>
230230
<td>exportButton</td><td>boolean</td><td>no</td><td>false</td><td>It enable the export button for orgchart.</td>
@@ -245,7 +245,7 @@ var oc = $('#chartContainerId').orgchart(options);
245245
<td>dropCriteria</td><td>function</td><td>no</td><td></td><td>Users can construct their own criteria to limit the relationships between dragged node and drop zone. Furtherly, this function accept three arguments(draggedNode, dragZone, dropZone) and just only return boolen values.</td>
246246
</tr>
247247
<tr>
248-
<td>initCompleted</td><td>function</td><td>no</td><td></td><td>It can often be useful to know when your table has fully been initialised, data loaded and rendered, particularly when using an ajax data source. It recieves one parament: "$chart" stands for jquery object of initialised chart.</td>
248+
<td>initCompleted</td><td>function</td><td>no</td><td></td><td>It can often be useful to know when your table has fully been initialised, data loaded and rendered, particularly when using an ajax data source. It receives one parament: "$chart" stands for jquery object of initialised chart.</td>
249249
</tr>
250250
</tbody>
251251
</table>

demo/css/jquery.orgchart.css

Lines changed: 13 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -158,12 +158,11 @@
158158
padding: 3px;
159159
border: 2px dashed transparent;
160160
text-align: center;
161-
width: 130px;
162161
}
163162

164163
.orgchart.l2r .node, .orgchart.r2l .node {
165164
width: 50px;
166-
height: 130px;
165+
height: 140px;
167166
}
168167

169168
.orgchart .node>.spinner {
@@ -202,11 +201,13 @@
202201
}
203202

204203
.orgchart .node .title {
204+
box-sizing: border-box;
205+
padding: 2px;
206+
width: 130px;
205207
text-align: center;
206-
font-size: 12px;
208+
font-size: 0.75rem;
207209
font-weight: bold;
208210
height: 20px;
209-
line-height: 20px;
210211
overflow: hidden;
211212
text-overflow: ellipsis;
212213
white-space: nowrap;
@@ -221,15 +222,13 @@
221222
}
222223

223224
.orgchart.l2r .node .title {
224-
transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);
225+
transform: rotate(-90deg) translate(-45px, -45px) rotateY(180deg);
225226
transform-origin: bottom center;
226-
width: 120px;
227227
}
228228

229229
.orgchart.r2l .node .title {
230-
transform: rotate(-90deg) translate(-40px, -40px);
230+
transform: rotate(-90deg) translate(-45px, -45px);
231231
transform-origin: bottom center;
232-
width: 120px;
233232
}
234233

235234
.orgchart .node .title .symbol {
@@ -240,16 +239,14 @@
240239

241240
.orgchart .node .content {
242241
box-sizing: border-box;
243-
width: 100%;
242+
padding: 2px;
244243
height: 20px;
245-
font-size: 11px;
246-
line-height: 18px;
244+
font-size: 0.625rem;
247245
border: 1px solid rgba(217, 83, 79, 0.8);
248246
border-radius: 0 0 4px 4px;
249247
text-align: center;
250248
background-color: #fff;
251249
color: #333;
252-
overflow: hidden;
253250
text-overflow: ellipsis;
254251
white-space: nowrap;
255252
}
@@ -260,15 +257,15 @@
260257
}
261258

262259
.orgchart.l2r .node .content {
263-
transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);
260+
transform: rotate(-90deg) translate(-45px, -45px) rotateY(180deg);
264261
transform-origin: top center;
265-
width: 120px;
262+
width: 130px;
266263
}
267264

268265
.orgchart.r2l .node .content {
269-
transform: rotate(-90deg) translate(-40px, -40px);
266+
transform: rotate(-90deg) translate(-45px, -45px);
270267
transform-origin: top center;
271-
width: 120px;
268+
width: 130px;
272269
}
273270

274271
.orgchart .node .edge {

demo/js/jquery.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

demo/js/jspdf.min.js

Lines changed: 104 additions & 120 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/css/jquery.orgchart.css

Lines changed: 13 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -158,12 +158,11 @@
158158
padding: 3px;
159159
border: 2px dashed transparent;
160160
text-align: center;
161-
width: 130px;
162161
}
163162

164163
.orgchart.l2r .node, .orgchart.r2l .node {
165164
width: 50px;
166-
height: 130px;
165+
height: 140px;
167166
}
168167

169168
.orgchart .node>.spinner {
@@ -202,11 +201,13 @@
202201
}
203202

204203
.orgchart .node .title {
204+
box-sizing: border-box;
205+
padding: 2px;
206+
width: 130px;
205207
text-align: center;
206-
font-size: 12px;
208+
font-size: 0.75rem;
207209
font-weight: bold;
208210
height: 20px;
209-
line-height: 20px;
210211
overflow: hidden;
211212
text-overflow: ellipsis;
212213
white-space: nowrap;
@@ -221,15 +222,13 @@
221222
}
222223

223224
.orgchart.l2r .node .title {
224-
transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);
225+
transform: rotate(-90deg) translate(-45px, -45px) rotateY(180deg);
225226
transform-origin: bottom center;
226-
width: 120px;
227227
}
228228

229229
.orgchart.r2l .node .title {
230-
transform: rotate(-90deg) translate(-40px, -40px);
230+
transform: rotate(-90deg) translate(-45px, -45px);
231231
transform-origin: bottom center;
232-
width: 120px;
233232
}
234233

235234
.orgchart .node .title .symbol {
@@ -240,16 +239,14 @@
240239

241240
.orgchart .node .content {
242241
box-sizing: border-box;
243-
width: 100%;
242+
padding: 2px;
244243
height: 20px;
245-
font-size: 11px;
246-
line-height: 18px;
244+
font-size: 0.625rem;
247245
border: 1px solid rgba(217, 83, 79, 0.8);
248246
border-radius: 0 0 4px 4px;
249247
text-align: center;
250248
background-color: #fff;
251249
color: #333;
252-
overflow: hidden;
253250
text-overflow: ellipsis;
254251
white-space: nowrap;
255252
}
@@ -260,15 +257,15 @@
260257
}
261258

262259
.orgchart.l2r .node .content {
263-
transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);
260+
transform: rotate(-90deg) translate(-45px, -45px) rotateY(180deg);
264261
transform-origin: top center;
265-
width: 120px;
262+
width: 130px;
266263
}
267264

268265
.orgchart.r2l .node .content {
269-
transform: rotate(-90deg) translate(-40px, -40px);
266+
transform: rotate(-90deg) translate(-45px, -45px);
270267
transform-origin: top center;
271-
width: 120px;
268+
width: 130px;
272269
}
273270

274271
.orgchart .node .edge {

0 commit comments

Comments
 (0)