Skip to content

Commit b2f2a29

Browse files
michelezandamichelezanda
committed
Chart label sizing enhanced. In particular for single pie charts. Testing needed before tagging.
1 parent 54b878e commit b2f2a29

5 files changed

Lines changed: 43 additions & 39 deletions

File tree

‎dist_ion/plotly-ion.js‎

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -25054,34 +25054,31 @@ module.exports = function draw(gd) {
2505425054

2505525055
computeLegendDimensions(gd, groups, traces);
2505625056

25057+
if (opts.orientation === "v" && opts.width > 150) {
25058+
opts.width = 150;
25059+
}
25060+
if (opts.orientation === "v" && fullLayout._hasPie && gd.data.length === 1) {
25061+
opts.width = Math.max(fullLayout.width * 0.37, 70);
25062+
}
25063+
2505725064
// ion: HIDE the legend if it's too big and would
2505825065
// result in covering the chart
25059-
if((opts.orientation === "v" && opts.width > fullLayout.width * 0.45) ||
25066+
if((opts.orientation === "v" && opts.width > fullLayout.width * 0.45 && !fullLayout._hasPie) ||
25067+
(opts.orientation === "v" && opts.width > fullLayout.width * 0.5 && fullLayout._hasPie) ||
2506025068
(opts.orientation === "h" && opts.height > fullLayout.height * 0.4) ||
2506125069
( (opts.xanchor !== 'left' && opts.xanchor !== 'right') && opts.orientation === "v" && opts.height > fullLayout.height * 0.4) ) {
2506225070
fullLayout._infolayer.selectAll('.legend').remove();
2506325071
fullLayout._topdefs.select('#' + clipId).remove();
2506425072

2506525073
return;
2506625074
}
25067-
25068-
if (opts.orientation === "v") {
25069-
if (opts.width < fullLayout._size.r && fullLayout._hasPie) {
25070-
if (fullLayout._size.r < fullLayout.width * 0.4) {
25071-
opts.width = fullLayout._size.r;
25072-
}
25073-
}
25074-
else if (opts.width > 146) {
25075-
opts.width = 150;
25076-
}
25077-
}
25075+
25076+
2507825077

2507925078
if(opts.height > lyMax) {
2508025079
// If the legend doesn't fit in the plot area,
2508125080
// do not expand the vertical margins.
2508225081
expandHorizontalMargin(gd);
25083-
} else if (opts.width > fullLayout.width * 0.3 && fullLayout._hasPie) {
25084-
// do nothing
2508525082
} else {
2508625083
expandMargin(gd);
2508725084
}
@@ -38112,15 +38109,15 @@ function buildSVGText(containerNode, str, gd, IONFormat) {
3811238109

3811338110
// In case ION new line logic applies to the legend labels
3811438111
var numCharsInLabel = 17;
38115-
if (gd._fullLayout._hasPie && gd._fullLayout.legend && gd._fullLayout.legend.orientation === 'v' && gd._fullLayout._size.r > 150 && gd._fullLayout._size.r < gd._fullLayout.width * 0.4) {
38116-
numCharsInLabel = 17 + Math.floor((gd._fullLayout._size.r - 155)/3.9);
38112+
if (gd._fullLayout._hasPie && gd._fullLayout.legend && gd._fullLayout.legend.orientation === 'v' && gd._fullLayout.width > 220 && gd.data.length === 1) {
38113+
numCharsInLabel = 5 + Math.ceil((gd._fullLayout.width - 220)/25);
3811738114
}
3811838115

3811938116
// In case BR is already used for hovertooltip custom formatting
3812038117
if (IONFormat && str.indexOf("<br>")<0 && str.length > numCharsInLabel) {
3812138118
var upToPos = numCharsInLabel;
3812238119
var spaceFound = false;
38123-
for (let i = numCharsInLabel; i > upToPos - 10; i--) {
38120+
for (let i = numCharsInLabel; i > upToPos - 11 && i > 0; i--) {
3812438121
if (str.charAt(i) === " ") {
3812538122
upToPos = i;
3812638123
spaceFound = true;
@@ -38133,7 +38130,7 @@ function buildSVGText(containerNode, str, gd, IONFormat) {
3813338130
strION = strION.substr(0, upToPos) + "<br>" + strION.substr(upToPos);
3813438131
}
3813538132
if (strION.length > numCharsInLabel * 2) {
38136-
strION = strION.substr(0, (numCharsInLabel * 2) - 3 ) + "...";
38133+
strION = strION.substr(0, (numCharsInLabel * 2) + 4 - 3 ) + "...";
3813738134
}
3813838135
}
3813938136
var parts = strION.split(SPLIT_TAGS);
@@ -67886,7 +67883,12 @@ function scalePies(cdpie, plotSize) {
6788667883

6788767884
cd0.r = Math.min(pieBoxWidth, pieBoxHeight) / (2 + 2 * maxPull);
6788867885

67889-
cd0.cx = plotSize.l + plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
67886+
if (cdpie.length === 1) {
67887+
cd0.cx = plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
67888+
} else {
67889+
cd0.cx = plotSize.l + plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
67890+
}
67891+
6789067892
cd0.cy = plotSize.t + plotSize.h * (2 - trace.domain.y[1] - trace.domain.y[0]) / 2;
6789167893

6789267894
if(trace.scalegroup && scaleGroups.indexOf(trace.scalegroup) === -1) {

‎dist_ion/plotly-ion.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/legend/draw.js‎

Lines changed: 11 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -141,34 +141,31 @@ module.exports = function draw(gd) {
141141

142142
computeLegendDimensions(gd, groups, traces);
143143

144+
if (opts.orientation === "v" && opts.width > 150) {
145+
opts.width = 150;
146+
}
147+
if (opts.orientation === "v" && fullLayout._hasPie && gd.data.length === 1) {
148+
opts.width = Math.max(fullLayout.width * 0.37, 70);
149+
}
150+
144151
// ion: HIDE the legend if it's too big and would
145152
// result in covering the chart
146-
if((opts.orientation === "v" && opts.width > fullLayout.width * 0.45) ||
153+
if((opts.orientation === "v" && opts.width > fullLayout.width * 0.45 && !fullLayout._hasPie) ||
154+
(opts.orientation === "v" && opts.width > fullLayout.width * 0.5 && fullLayout._hasPie) ||
147155
(opts.orientation === "h" && opts.height > fullLayout.height * 0.4) ||
148156
( (opts.xanchor !== 'left' && opts.xanchor !== 'right') && opts.orientation === "v" && opts.height > fullLayout.height * 0.4) ) {
149157
fullLayout._infolayer.selectAll('.legend').remove();
150158
fullLayout._topdefs.select('#' + clipId).remove();
151159

152160
return;
153161
}
154-
155-
if (opts.orientation === "v") {
156-
if (opts.width < fullLayout._size.r && fullLayout._hasPie) {
157-
if (fullLayout._size.r < fullLayout.width * 0.4) {
158-
opts.width = fullLayout._size.r;
159-
}
160-
}
161-
else if (opts.width > 146) {
162-
opts.width = 150;
163-
}
164-
}
162+
163+
165164

166165
if(opts.height > lyMax) {
167166
// If the legend doesn't fit in the plot area,
168167
// do not expand the vertical margins.
169168
expandHorizontalMargin(gd);
170-
} else if (opts.width > fullLayout.width * 0.3 && fullLayout._hasPie) {
171-
// do nothing
172169
} else {
173170
expandMargin(gd);
174171
}

‎src/lib/svg_text_utils.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -428,15 +428,15 @@ function buildSVGText(containerNode, str, gd, IONFormat) {
428428

429429
// In case ION new line logic applies to the legend labels
430430
var numCharsInLabel = 17;
431-
if (gd._fullLayout._hasPie && gd._fullLayout.legend && gd._fullLayout.legend.orientation === 'v' && gd._fullLayout._size.r > 150 && gd._fullLayout._size.r < gd._fullLayout.width * 0.4) {
432-
numCharsInLabel = 17 + Math.floor((gd._fullLayout._size.r - 155)/3.9);
431+
if (gd._fullLayout._hasPie && gd._fullLayout.legend && gd._fullLayout.legend.orientation === 'v' && gd._fullLayout.width > 220 && gd.data.length === 1) {
432+
numCharsInLabel = 5 + Math.ceil((gd._fullLayout.width - 220)/25);
433433
}
434434

435435
// In case BR is already used for hovertooltip custom formatting
436436
if (IONFormat && str.indexOf("<br>")<0 && str.length > numCharsInLabel) {
437437
var upToPos = numCharsInLabel;
438438
var spaceFound = false;
439-
for (let i = numCharsInLabel; i > upToPos - 10; i--) {
439+
for (let i = numCharsInLabel; i > upToPos - 11 && i > 0; i--) {
440440
if (str.charAt(i) === " ") {
441441
upToPos = i;
442442
spaceFound = true;
@@ -449,7 +449,7 @@ function buildSVGText(containerNode, str, gd, IONFormat) {
449449
strION = strION.substr(0, upToPos) + "<br>" + strION.substr(upToPos);
450450
}
451451
if (strION.length > numCharsInLabel * 2) {
452-
strION = strION.substr(0, (numCharsInLabel * 2) - 3 ) + "...";
452+
strION = strION.substr(0, (numCharsInLabel * 2) + 4 - 3 ) + "...";
453453
}
454454
}
455455
var parts = strION.split(SPLIT_TAGS);

‎src/traces/pie/plot.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -592,7 +592,12 @@ function scalePies(cdpie, plotSize) {
592592

593593
cd0.r = Math.min(pieBoxWidth, pieBoxHeight) / (2 + 2 * maxPull);
594594

595-
cd0.cx = plotSize.l + plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
595+
if (cdpie.length === 1) {
596+
cd0.cx = plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
597+
} else {
598+
cd0.cx = plotSize.l + plotSize.w * (trace.domain.x[1] + trace.domain.x[0]) / 2;
599+
}
600+
596601
cd0.cy = plotSize.t + plotSize.h * (2 - trace.domain.y[1] - trace.domain.y[0]) / 2;
597602

598603
if(trace.scalegroup && scaleGroups.indexOf(trace.scalegroup) === -1) {

0 commit comments

Comments
 (0)