jingrow/charts
1
0
Fork 0
Code Pull Requests Activity

feat: update legendBar

Browse Source
This commit is contained in:
Shivam Mishra 2020-10-22 12:13:50 +05:30
parent 610cfb1f6d
commit d84614cb65
2 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/js/charts/AxisChart.js
View File

@ -422,17 +422,13 @@ export default class AxisChart extends BaseChart {
renderLegend() { renderLegend() {
let s = this.data; let s = this.data;
if(s.datasets.length > 1) { if (s.datasets.length > 1) {
this.legendArea.textContent = ''; this.legendArea.textContent = '';
let barWidth = AXIS_LEGEND_BAR_SIZE;
s.datasets.map((d, i) => { s.datasets.map((d, i) => {
let barWidth = AXIS_LEGEND_BAR_SIZE;
// let rightEndPoint = this.baseWidth - this.measures.margins.left - this.measures.margins.right;
// let multiplier = s.datasets.length - i;
let rect = legendBar( let rect = legendBar(
// rightEndPoint - multiplier * barWidth, // To right align
barWidth * i, barWidth * i,
'0', '0',
barWidth,
this.colors[i], this.colors[i],
d.name, d.name,
this.config.truncateLegends); this.config.truncateLegends);

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

@ -223,22 +223,26 @@ export function heatSquare(className, x, y, size, radius, fill='none', data={})
return createSVG("rect", args); return createSVG("rect", args);
} }
export function legendBar(x, y, size, fill='none', label, truncate=false) { export function legendBar(x, y, fill = 'none', label, truncate = true) {
label = truncate ? truncateString(label, LABEL_MAX_CHARS) : label; label = truncate ? truncateString(label, LABEL_MAX_CHARS) : label;
let args = { let args = {
className: 'legend-bar', className: 'legend-bar',
x: 0, x: 0,
y: 0, y: 0,
width: size, width: '12px',
height: '2px', height: '12px',
rx: '2px',
ry: '2px',
fill: fill fill: fill
}; };
let text = createSVG('text', { let text = createSVG('text', {
className: 'legend-dataset-text', className: 'legend-dataset-text',
x: 0, x: 0,
y: 0, y: 0,
dy: (FONT_SIZE * 2) + 'px', dy: (FONT_SIZE) + 'px',
dx: (FONT_SIZE * 1.5) + 'px',
'font-size': (FONT_SIZE * 1.2) + 'px', 'font-size': (FONT_SIZE * 1.2) + 'px',
'text-anchor': 'start', 'text-anchor': 'start',
fill: FONT_FILL, fill: FONT_FILL,