jingrow/charts
1
0
Fork 0
Code Pull Requests Activity

Fixing label support.

Browse Source
This commit is contained in:
Kaleb White 2021-11-12 19:02:04 -08:00
parent a5a5fc051b
commit 5034c7a954
3 changed files with 62 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/assets/js/frappe-charts.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
docs/assets/js/frappe-charts.min.js.map
View File

File diff suppressed because one or more lines are too long

116
src/js/utils/draw.js
View File

@ -319,47 +319,50 @@ function makeVertLine(x, label, y1, y2, options={}) {
return line; return line;
} }
function makeHoriLine(y, label, x1, x2, options={}) { function makeHoriLine(y, label, x1, x2, options = {}) {
if(!options.stroke) options.stroke = BASE_LINE_COLOR; if (!options.stroke) options.stroke = BASE_LINE_COLOR;
if(!options.lineType) options.lineType = ''; if (!options.lineType) options.lineType = '';
if (options.shortenNumbers) label = shortenLargeNumber(label); if (!options.alignment) options.alignment = 'left';
if (options.shortenNumbers) label = shortenLargeNumber(label);
let className = 'line-horizontal ' + options.className + let className =
(options.lineType === "dashed" ? "dashed": ""); 'line-horizontal ' +
options.className +
(options.lineType === 'dashed' ? 'dashed' : '');
let l = createSVG('line', { let l = createSVG('line', {
className: className, className: className,
x1: x1, x1: x1,
x2: x2, x2: x2,
y1: 0, y1: 0,
y2: 0, y2: 0,
styles: { styles: {
stroke: options.stroke stroke: options.stroke
} }
}); });
let text = createSVG('text', { let text = createSVG('text', {
x: x1 < x2 ? x1 - LABEL_MARGIN : x1 + LABEL_MARGIN, x: options.alignment === 'left' ? x1 - LABEL_MARGIN : x2 + LABEL_MARGIN * 4,
y: 0, y: 0,
dy: (FONT_SIZE / 2 - 2) + 'px', dy: FONT_SIZE / 2 - 2 + 'px',
'font-size': FONT_SIZE + 'px', 'font-size': FONT_SIZE + 'px',
'text-anchor': x1 < x2 ? 'end' : 'start', 'text-anchor': x1 < x2 ? 'end' : 'start',
innerHTML: label+"" innerHTML: label + ''
}); });
let line = createSVG('g', { let line = createSVG('g', {
transform: `translate(0, ${y})`, transform: `translate(0, ${y})`,
'stroke-opacity': 1 'stroke-opacity': 1
}); });
if(text === 0 || text === '0') { if (text === 0 || text === '0') {
line.style.stroke = "rgba(27, 31, 35, 0.6)"; line.style.stroke = 'rgba(27, 31, 35, 0.6)';
} }
line.appendChild(l); line.appendChild(l);
line.appendChild(text); line.appendChild(text);
return line; return line;
} }
export function generateAxisLabel(options) { export function generateAxisLabel(options) {
@ -386,34 +389,35 @@ export function generateAxisLabel(options) {
return labelSvg; return labelSvg;
} }
export function yLine(y, label, width, options={}) { export function yLine(y, label, width, options = {}) {
if (!isValidNumber(y)) y = 0; if (!isValidNumber(y)) y = 0;
if(!options.pos) options.pos = 'left'; if (!options.pos) options.pos = 'left';
if(!options.offset) options.offset = 0; if (!options.offset) options.offset = 0;
if(!options.mode) options.mode = 'span'; if (!options.mode) options.mode = 'span';
if(!options.stroke) options.stroke = BASE_LINE_COLOR; if (!options.stroke) options.stroke = BASE_LINE_COLOR;
if(!options.className) options.className = ''; if (!options.className) options.className = '';
let x1 = -1 * AXIS_TICK_LENGTH; let x1 = -1 * AXIS_TICK_LENGTH;
let x2 = options.mode === 'span' ? width + AXIS_TICK_LENGTH : 0; let x2 = options.mode === 'span' ? width + AXIS_TICK_LENGTH : 0;
if(options.mode === 'tick' && options.pos === 'right') { if (options.mode === 'tick' && options.pos === 'right') {
x1 = width + AXIS_TICK_LENGTH; x1 = width + AXIS_TICK_LENGTH;
x2 = width; x2 = width;
} }
// let offset = options.pos === 'left' ? -1 * options.offset : options.offset; let offset = options.pos === 'left' ? -1 * options.offset : options.offset;
x1 += options.offset; x1 += offset;
x2 += options.offset; x2 += offset;
return makeHoriLine(y, label, x1, x2, { return makeHoriLine(y, label, x1, x2, {
stroke: options.stroke, stroke: options.stroke,
className: options.className, className: options.className,
lineType: options.lineType, lineType: options.lineType,
shortenNumbers: options.shortenNumbers alignment: options.pos,
}); shortenNumbers: options.shortenNumbers
});
} }
export function xLine(x, label, height, options={}) { export function xLine(x, label, height, options={}) {