angular-sunburst-radar-chart
Version:
A Sunburst Radar chart with SVG,No Dependencies
42 lines • 7.26 kB
JavaScript
import { convertToPercentage } from './math';
import { polarToCartesian } from './trignometry';
import { createCircle } from './elements';
import { createText } from './textelement';
export function createLegendWithOptions({ startPoint, center, startRadius, endRadius, degreeToBeDrawn, maxScore }) {
const [centerX, centerY] = [center.x, center.y];
const actRadius = endRadius - startRadius;
const axisIncrement = maxScore / 4;
const legendRadius = convertToPercentage({ plotMax: actRadius, actualScore: axisIncrement, maxScore });
const smallCircleRadius = Math.round(0.083 * actRadius);
const smallCircleFontSize = Math.round(0.067 * actRadius);
const groups = [1, 2, 3]
.map(val => {
return { radius: val * legendRadius, content: Math.round(val * axisIncrement) };
})
.map(res => {
const { radius, content } = res;
const { x, y } = polarToCartesian(startPoint.x, startPoint.y, radius, degreeToBeDrawn);
const circle = createCircle({
x,
y,
radius: smallCircleRadius,
'fillColor': '#000000'
});
const legendCircle = createCircle({
x: centerX,
y: centerY,
radius: startRadius + radius,
'stroke-dasharray': 4,
'stroke-opacity': 0.3
});
const fontSize = smallCircleFontSize + "px";
//console.log("font-size",fontSize)
const text = createText({ content, x, y, 'stroke': 'white', 'font-size': fontSize });
return [circle, legendCircle, text];
});
return [].concat.apply([], groups);
}
export function createLegends({ startPoint, radius, degreeToBeDrawn, maxScore }) {
return createLegendWithOptions({ startPoint, center: startPoint, startRadius: 0, endRadius: radius, degreeToBeDrawn, maxScore });
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGVnZW5kLmpzIiwic291cmNlUm9vdCI6Im5nOi8vYW5ndWxhci1zdW5idXJzdC1yYWRhci1jaGFydC8iLCJzb3VyY2VzIjpbImxpYi91dGlscy9sZWdlbmQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLG1CQUFtQixFQUFDLE1BQU0sUUFBUSxDQUFDO0FBQzNDLE9BQU8sRUFBQyxnQkFBZ0IsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUMvQyxPQUFPLEVBQUMsWUFBWSxFQUFDLE1BQU0sWUFBWSxDQUFDO0FBQ3hDLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFHekMsTUFBTSxVQUFVLHVCQUF1QixDQUFDLEVBQUMsVUFBVSxFQUFFLE1BQU0sRUFBRSxXQUFXLEVBQUUsU0FBUyxFQUFHLGVBQWUsRUFBQyxRQUFRLEVBQUM7SUFFN0csTUFBTSxDQUFDLE9BQU8sRUFBRSxPQUFPLENBQUMsR0FBRyxDQUFDLE1BQU0sQ0FBQyxDQUFDLEVBQUUsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBRWhELE1BQU0sU0FBUyxHQUFHLFNBQVMsR0FBRyxXQUFXLENBQUM7SUFFMUMsTUFBTSxhQUFhLEdBQUcsUUFBUSxHQUFDLENBQUMsQ0FBQTtJQUNoQyxNQUFNLFlBQVksR0FBRyxtQkFBbUIsQ0FBQyxFQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsV0FBVyxFQUFFLGFBQWEsRUFBQyxRQUFRLEVBQUMsQ0FBQyxDQUFDO0lBRXBHLE1BQU0saUJBQWlCLEdBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLEdBQUUsU0FBUyxDQUFDLENBQUE7SUFDcEQsTUFBTSxtQkFBbUIsR0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssR0FBRSxTQUFTLENBQUMsQ0FBQTtJQUV0RCxNQUFNLE1BQU0sR0FBRyxDQUFDLENBQUMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDO1NBQ3JCLEdBQUcsQ0FBQyxHQUFHLENBQUMsRUFBRTtRQUNULE9BQU8sRUFBQyxNQUFNLEVBQUUsR0FBRyxHQUFHLFlBQVksRUFBRSxPQUFPLEVBQUUsSUFBSSxDQUFDLEtBQUssQ0FBQyxHQUFHLEdBQUcsYUFBYSxDQUFDLEVBQUUsQ0FBQztJQUNqRixDQUFDLENBQUM7U0FDRCxHQUFHLENBQUMsR0FBRyxDQUFDLEVBQUU7UUFFVCxNQUFNLEVBQUMsTUFBTSxFQUFFLE9BQU8sRUFBQyxHQUFHLEdBQUcsQ0FBQztRQUM5QixNQUFNLEVBQUMsQ0FBQyxFQUFFLENBQUMsRUFBQyxHQUFHLGdCQUFnQixDQUFDLFVBQVUsQ0FBQyxDQUFDLEVBQUUsVUFBVSxDQUFDLENBQUMsRUFBRSxNQUFNLEVBQUUsZUFBZSxDQUFDLENBQUM7UUFHckYsTUFBTSxNQUFNLEdBQUcsWUFBWSxDQUFDO1lBQzFCLENBQUM7WUFDRCxDQUFDO1lBQ0QsTUFBTSxFQUFFLGlCQUFpQjtZQUN6QixXQUFXLEVBQUUsU0FBUztTQUN2QixDQUFDLENBQUM7UUFDSCxNQUFNLFlBQVksR0FBRyxZQUFZLENBQUM7WUFDaEMsQ0FBQyxFQUFFLE9BQU87WUFDVixDQUFDLEVBQUUsT0FBTztZQUNWLE1BQU0sRUFBRSxXQUFXLEdBQUcsTUFBTTtZQUM1QixrQkFBa0IsRUFBRSxDQUFDO1lBQ3JCLGdCQUFnQixFQUFFLEdBQUc7U0FDdEIsQ0FBQyxDQUFDO1FBSUgsTUFBTSxRQUFRLEdBQUUsbUJBQW1CLEdBQUUsSUFBSSxDQUFBO1FBQ3pDLG1DQUFtQztRQUNuQyxNQUFNLElBQUksR0FBRyxVQUFVLENBQUMsRUFBQyxPQUFPLEVBQUUsQ0FBQyxFQUFFLENBQUMsRUFBRSxRQUFRLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSxRQUFRLEVBQUMsQ0FBQyxDQUFDO1FBRW5GLE9BQU8sQ0FBQyxNQUFNLEVBQUUsWUFBWSxFQUFFLElBQUksQ0FBQyxDQUFDO0lBRXRDLENBQUMsQ0FBQyxDQUFDO0lBR0wsT0FBTyxFQUFFLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxFQUFFLEVBQUUsTUFBTSxDQUFDLENBQUM7QUFJckMsQ0FBQztBQUVELE1BQU0sVUFBVSxhQUFhLENBQUMsRUFBQyxVQUFVLEVBQUUsTUFBTSxFQUFHLGVBQWUsRUFBQyxRQUFRLEVBQUM7SUFFM0UsT0FBTyx1QkFBdUIsQ0FBQyxFQUFDLFVBQVUsRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFLFdBQVcsRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRyxlQUFlLEVBQUMsUUFBUSxFQUFDLENBQUMsQ0FBQztBQUVqSSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtjb252ZXJ0VG9QZXJjZW50YWdlfSBmcm9tICcuL21hdGgnO1xyXG5pbXBvcnQge3BvbGFyVG9DYXJ0ZXNpYW59IGZyb20gJy4vdHJpZ25vbWV0cnknO1xyXG5pbXBvcnQge2NyZWF0ZUNpcmNsZX0gZnJvbSAnLi9lbGVtZW50cyc7XHJcbmltcG9ydCB7Y3JlYXRlVGV4dH0gZnJvbSAnLi90ZXh0ZWxlbWVudCc7XHJcblxyXG5cclxuZXhwb3J0IGZ1bmN0aW9uIGNyZWF0ZUxlZ2VuZFdpdGhPcHRpb25zKHtzdGFydFBvaW50LCBjZW50ZXIsIHN0YXJ0UmFkaXVzLCBlbmRSYWRpdXMsICBkZWdyZWVUb0JlRHJhd24sbWF4U2NvcmV9KSB7XHJcblxyXG4gIGNvbnN0IFtjZW50ZXJYLCBjZW50ZXJZXSA9IFtjZW50ZXIueCwgY2VudGVyLnldO1xyXG5cclxuICBjb25zdCBhY3RSYWRpdXMgPSBlbmRSYWRpdXMgLSBzdGFydFJhZGl1cztcclxuXHJcbiAgY29uc3QgYXhpc0luY3JlbWVudCA9IG1heFNjb3JlLzRcclxuICBjb25zdCBsZWdlbmRSYWRpdXMgPSBjb252ZXJ0VG9QZXJjZW50YWdlKHtwbG90TWF4OiBhY3RSYWRpdXMsIGFjdHVhbFNjb3JlOiBheGlzSW5jcmVtZW50LG1heFNjb3JlfSk7XHJcblxyXG4gIGNvbnN0IHNtYWxsQ2lyY2xlUmFkaXVzPU1hdGgucm91bmQoMC4wODMgKmFjdFJhZGl1cylcclxuICBjb25zdCBzbWFsbENpcmNsZUZvbnRTaXplPU1hdGgucm91bmQoMC4wNjcgKmFjdFJhZGl1cylcclxuXHJcbiAgY29uc3QgZ3JvdXBzID0gWzEsIDIsIDNdXHJcbiAgICAubWFwKHZhbCA9PiB7XHJcbiAgICAgIHJldHVybiB7cmFkaXVzOiB2YWwgKiBsZWdlbmRSYWRpdXMsIGNvbnRlbnQ6IE1hdGgucm91bmQodmFsICogYXhpc0luY3JlbWVudCkgfTtcclxuICAgIH0pXHJcbiAgICAubWFwKHJlcyA9PiB7XHJcblxyXG4gICAgICBjb25zdCB7cmFkaXVzLCBjb250ZW50fSA9IHJlcztcclxuICAgICAgY29uc3Qge3gsIHl9ID0gcG9sYXJUb0NhcnRlc2lhbihzdGFydFBvaW50LngsIHN0YXJ0UG9pbnQueSwgcmFkaXVzLCBkZWdyZWVUb0JlRHJhd24pO1xyXG5cclxuXHJcbiAgICAgIGNvbnN0IGNpcmNsZSA9IGNyZWF0ZUNpcmNsZSh7XHJcbiAgICAgICAgeCxcclxuICAgICAgICB5LFxyXG4gICAgICAgIHJhZGl1czogc21hbGxDaXJjbGVSYWRpdXMsXHJcbiAgICAgICAgJ2ZpbGxDb2xvcic6ICcjMDAwMDAwJ1xyXG4gICAgICB9KTtcclxuICAgICAgY29uc3QgbGVnZW5kQ2lyY2xlID0gY3JlYXRlQ2lyY2xlKHtcclxuICAgICAgICB4OiBjZW50ZXJYLFxyXG4gICAgICAgIHk6IGNlbnRlclksXHJcbiAgICAgICAgcmFkaXVzOiBzdGFydFJhZGl1cyArIHJhZGl1cyxcclxuICAgICAgICAnc3Ryb2tlLWRhc2hhcnJheSc6IDQsXHJcbiAgICAgICAgJ3N0cm9rZS1vcGFjaXR5JzogMC4zXHJcbiAgICAgIH0pO1xyXG5cclxuXHJcblxyXG4gICAgICBjb25zdCBmb250U2l6ZT0gc21hbGxDaXJjbGVGb250U2l6ZSArXCJweFwiXHJcbiAgICAgIC8vY29uc29sZS5sb2coXCJmb250LXNpemVcIixmb250U2l6ZSlcclxuICAgICAgY29uc3QgdGV4dCA9IGNyZWF0ZVRleHQoe2NvbnRlbnQsIHgsIHksICdzdHJva2UnOiAnd2hpdGUnLCAnZm9udC1zaXplJzogZm9udFNpemV9KTtcclxuXHJcbiAgICAgIHJldHVybiBbY2lyY2xlLCBsZWdlbmRDaXJjbGUsIHRleHRdO1xyXG5cclxuICAgIH0pO1xyXG5cclxuXHJcbiAgcmV0dXJuIFtdLmNvbmNhdC5hcHBseShbXSwgZ3JvdXBzKTtcclxuXHJcblxyXG5cclxufVxyXG5cclxuZXhwb3J0IGZ1bmN0aW9uIGNyZWF0ZUxlZ2VuZHMoe3N0YXJ0UG9pbnQsIHJhZGl1cywgIGRlZ3JlZVRvQmVEcmF3bixtYXhTY29yZX0pIHtcclxuXHJcbiAgcmV0dXJuIGNyZWF0ZUxlZ2VuZFdpdGhPcHRpb25zKHtzdGFydFBvaW50LCBjZW50ZXI6IHN0YXJ0UG9pbnQsIHN0YXJ0UmFkaXVzOiAwLCBlbmRSYWRpdXM6IHJhZGl1cywgIGRlZ3JlZVRvQmVEcmF3bixtYXhTY29yZX0pO1xyXG5cclxufVxyXG4iXX0=