chartist 1.3.1 → 1.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/charts/PieChart/PieChart.d.ts +8 -0
- package/dist/charts/PieChart/PieChart.d.ts.map +1 -1
- package/dist/charts/PieChart/PieChart.types.d.ts +5 -1
- package/dist/charts/PieChart/PieChart.types.d.ts.map +1 -1
- package/dist/index.cjs +25 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +25 -1
- package/dist/index.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
|
@@ -83,6 +83,14 @@ export declare class PieChart extends BaseChart<PieChartEventsTypes> {
|
|
|
83
83
|
* ```
|
|
84
84
|
*/
|
|
85
85
|
constructor(query: string | Element | null, data: PieChartData, options?: PieChartOptions, responsiveOptions?: ResponsiveOptions<PieChartOptions>);
|
|
86
|
+
/**
|
|
87
|
+
* Check if a label has overlapping text then move it the number of pixels up and left based on textSize.
|
|
88
|
+
* @param labelPos - Label position that chartist will be checking does not overlap with the list of LabelPositions.
|
|
89
|
+
* @param existingLabelPos - Label position that has already been placed that chartist will check against.
|
|
90
|
+
* @param textOffset - this is configured with preventOverlappingLabelOffset option.
|
|
91
|
+
* @param length - How many characters long the label is.
|
|
92
|
+
*/
|
|
93
|
+
moveLabel(labelPos: Dot, existingLabelPos: Dot, textOffset: number, length: number): void;
|
|
86
94
|
/**
|
|
87
95
|
* Creates the pie chart
|
|
88
96
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PieChart.d.ts","sourceRoot":"","sources":["../../../src/charts/PieChart/PieChart.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,cAAc,EACd,GAAG,EACH,YAAY,EACZ,eAAe,EACf,2BAA2B,EAI3B,mBAAmB,EACpB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAkBpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"PieChart.d.ts","sourceRoot":"","sources":["../../../src/charts/PieChart/PieChart.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,cAAc,EACd,GAAG,EACH,YAAY,EACZ,eAAe,EACf,2BAA2B,EAI3B,mBAAmB,EACpB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAkBpD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AA8CzC;;GAEG;AACH,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,GAAG,EACX,KAAK,EAAE,GAAG,EACV,SAAS,EAAE,cAAc,GACxB,cAAc,CAgBhB;AAED,qBAAa,QAAS,SAAQ,SAAS,CAAC,mBAAmB,CAAC;cA8ErC,IAAI,EAAE,YAAY;IA7EvC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0EG;gBAED,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,EACX,IAAI,EAAE,YAAY,EACrC,OAAO,CAAC,EAAE,eAAe,EACzB,iBAAiB,CAAC,EAAE,iBAAiB,CAAC,eAAe,CAAC;IAWxD;;;;;;OAMG;IACH,SAAS,CACP,QAAQ,EAAE,GAAG,EACb,gBAAgB,EAAE,GAAG,EACrB,UAAU,EAAE,MAAM,EAClB,MAAM,EAAE,MAAM;IAchB;;;;OAIG;IACH,WAAW,CAAC,OAAO,EAAE,2BAA2B;CAwRjD"}
|
|
@@ -68,8 +68,12 @@ export interface PieChartOptions extends Omit<Options, 'axisX' | 'axisY'> {
|
|
|
68
68
|
* If true empty values will be ignored to avoid drawing unnecessary slices and labels
|
|
69
69
|
*/
|
|
70
70
|
ignoreEmptyValues?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* If nonzero labels will not overlap.
|
|
73
|
+
*/
|
|
74
|
+
preventOverlappingLabelOffset?: number;
|
|
71
75
|
}
|
|
72
|
-
export declare type PieChartOptionsWithDefaults = RequiredKeys<PieChartOptions, 'chartPadding' | 'startAngle' | 'donutWidth' | 'showLabel' | 'labelOffset' | 'labelPosition' | 'labelInterpolationFnc' | 'labelDirection', 'classNames'>;
|
|
76
|
+
export declare type PieChartOptionsWithDefaults = RequiredKeys<PieChartOptions, 'chartPadding' | 'startAngle' | 'donutWidth' | 'showLabel' | 'labelOffset' | 'labelPosition' | 'labelInterpolationFnc' | 'labelDirection' | 'preventOverlappingLabelOffset', 'classNames'>;
|
|
73
77
|
export declare type PieChartCreatedEvent = Omit<CreatedEvent<PieChartOptions>, 'axisX' | 'axisY'>;
|
|
74
78
|
export interface SliceDrawEvent extends Omit<DrawEvent, 'axisX' | 'axisY' | 'seriesIndex'> {
|
|
75
79
|
type: 'slice';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PieChart.types.d.ts","sourceRoot":"","sources":["../../../src/charts/PieChart/PieChart.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,OAAO,EACP,KAAK,EACL,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,SAAS,EACT,qBAAqB,EACtB,MAAM,YAAY,CAAC;AACpB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAErD,oBAAY,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;AAE5C,oBAAY,cAAc,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;AAE/D,oBAAY,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAExD,oBAAY,mBAAmB,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,CAAC;AAElE,MAAM,WAAW,GAAG;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAAC;IACvE;;OAEG;IACH,UAAU,CAAC,EAAE;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,CAAC;IACF;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IACpC;;OAEG;IACH,qBAAqB,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC;IAC9E;;;;OAIG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"PieChart.types.d.ts","sourceRoot":"","sources":["../../../src/charts/PieChart/PieChart.types.ts"],"names":[],"mappings":"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"}
|
package/dist/index.cjs
CHANGED
|
@@ -3277,7 +3277,9 @@ class BarChart extends BaseChart {
|
|
|
3277
3277
|
// Label direction can be 'neutral', 'explode' or 'implode'. The labels anchor will be positioned based on those settings as well as the fact if the labels are on the right or left side of the center of the chart. Usually explode is useful when labels are positioned far away from the center.
|
|
3278
3278
|
labelDirection: "neutral",
|
|
3279
3279
|
// If true empty values will be ignored to avoid drawing unnecessary slices and labels
|
|
3280
|
-
ignoreEmptyValues: false
|
|
3280
|
+
ignoreEmptyValues: false,
|
|
3281
|
+
// If Nonzero check if a label has overlapping text then move it the number of pixels up and left (Should be half of label font size + 1 but you can tweak it as you prefer)
|
|
3282
|
+
preventOverlappingLabelOffset: 0
|
|
3281
3283
|
};
|
|
3282
3284
|
/**
|
|
3283
3285
|
* Determines SVG anchor position based on direction and center parameter
|
|
@@ -3293,6 +3295,19 @@ class BarChart extends BaseChart {
|
|
|
3293
3295
|
}
|
|
3294
3296
|
class PieChart extends BaseChart {
|
|
3295
3297
|
/**
|
|
3298
|
+
* Check if a label has overlapping text then move it the number of pixels up and left based on textSize.
|
|
3299
|
+
* @param labelPos - Label position that chartist will be checking does not overlap with the list of LabelPositions.
|
|
3300
|
+
* @param existingLabelPos - Label position that has already been placed that chartist will check against.
|
|
3301
|
+
* @param textOffset - this is configured with preventOverlappingLabelOffset option.
|
|
3302
|
+
* @param length - How many characters long the label is.
|
|
3303
|
+
*/ moveLabel(labelPos, existingLabelPos, textOffset, length) {
|
|
3304
|
+
if (labelPos.y > existingLabelPos.y - textOffset && labelPos.y < existingLabelPos.y + textOffset && labelPos.x > existingLabelPos.x - length * textOffset && labelPos.x < existingLabelPos.x + length * textOffset) {
|
|
3305
|
+
labelPos.y -= textOffset;
|
|
3306
|
+
labelPos.x -= textOffset;
|
|
3307
|
+
this.moveLabel(labelPos, existingLabelPos, textOffset, length);
|
|
3308
|
+
}
|
|
3309
|
+
}
|
|
3310
|
+
/**
|
|
3296
3311
|
* Creates the pie chart
|
|
3297
3312
|
*
|
|
3298
3313
|
* @param options
|
|
@@ -3301,6 +3316,7 @@ class PieChart extends BaseChart {
|
|
|
3301
3316
|
const normalizedData = normalizeData(data);
|
|
3302
3317
|
const seriesGroups = [];
|
|
3303
3318
|
let labelsGroup;
|
|
3319
|
+
const labelPositions = [];
|
|
3304
3320
|
let labelRadius;
|
|
3305
3321
|
let startAngle = options.startAngle;
|
|
3306
3322
|
// Create SVG.js draw
|
|
@@ -3444,6 +3460,14 @@ class PieChart extends BaseChart {
|
|
|
3444
3460
|
}
|
|
3445
3461
|
const interpolatedValue = options.labelInterpolationFnc(rawValue, index);
|
|
3446
3462
|
if (interpolatedValue || interpolatedValue === 0) {
|
|
3463
|
+
if (options.preventOverlappingLabelOffset) {
|
|
3464
|
+
const textOffset = options.preventOverlappingLabelOffset;
|
|
3465
|
+
const length = String(normalizedData.labels[index]).length;
|
|
3466
|
+
labelPositions.forEach((item)=>{
|
|
3467
|
+
this.moveLabel(labelPosition, item, textOffset, length);
|
|
3468
|
+
});
|
|
3469
|
+
labelPositions.push(labelPosition);
|
|
3470
|
+
}
|
|
3447
3471
|
const labelElement = labelsGroup.elem("text", {
|
|
3448
3472
|
dx: labelPosition.x,
|
|
3449
3473
|
dy: labelPosition.y,
|