datly 0.0.7 → 0.0.9

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.
Files changed (6) hide show
  1. package/dist/datly.cjs +1 -1
  2. package/dist/datly.mjs +1 -1
  3. package/dist/datly.umd.js +1 -1
  4. package/package.json +1 -1
  5. package/src/code.js +13 -2
  6. package/src/plot.js +50 -22
package/src/plot.js CHANGED
@@ -44,6 +44,9 @@ const defaultConfig = {
44
44
  title: "",
45
45
  xlabel: "",
46
46
  ylabel: "",
47
+ axisColor: "#000000",
48
+ xAxisColor: null,
49
+ yAxisColor: null
47
50
  };
48
51
 
49
52
  function createSvg(userSelector, opts) {
@@ -80,6 +83,13 @@ function createSvg(userSelector, opts) {
80
83
  return { svg, config };
81
84
  }
82
85
 
86
+ // ✅ Função para aplicar cor nos eixos
87
+ function styleAxis(axisSelection, color) {
88
+ axisSelection.selectAll("path").attr("stroke", color);
89
+ axisSelection.selectAll("line").attr("stroke", color);
90
+ axisSelection.selectAll("text").attr("fill", color);
91
+ }
92
+
83
93
  // =======================================================
84
94
  // HISTOGRAM
85
95
  // =======================================================
@@ -105,8 +115,10 @@ export function plotHistogram(data, options = {}, selector) {
105
115
  .attr("height", (d) => height - y(d.length))
106
116
  .attr("fill", config.color);
107
117
 
108
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
109
- g.append("g").call(axisLeft(y));
118
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
119
+ const yAxis = g.append("g").call(axisLeft(y));
120
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
121
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
110
122
  }
111
123
 
112
124
  // =======================================================
@@ -161,8 +173,10 @@ export function plotBoxplot(data, options = {}, selector) {
161
173
  .attr("stroke", config.color);
162
174
  });
163
175
 
164
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
165
- g.append("g").call(axisLeft(y));
176
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
177
+ const yAxis = g.append("g").call(axisLeft(y));
178
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
179
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
166
180
  }
167
181
 
168
182
  // =======================================================
@@ -187,8 +201,10 @@ export function plotScatter(xData, yData, options = {}, selector) {
187
201
  .attr("r", options.size || 4)
188
202
  .attr("fill", config.color);
189
203
 
190
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
191
- g.append("g").call(axisLeft(y));
204
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
205
+ const yAxis = g.append("g").call(axisLeft(y));
206
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
207
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
192
208
  }
193
209
 
194
210
  // =======================================================
@@ -227,8 +243,10 @@ export function plotLine(xData, yData, options = {}, selector) {
227
243
  .attr("fill", config.color);
228
244
  }
229
245
 
230
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
231
- g.append("g").call(axisLeft(y));
246
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
247
+ const yAxis = g.append("g").call(axisLeft(y));
248
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
249
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
232
250
  }
233
251
 
234
252
  // =======================================================
@@ -254,8 +272,10 @@ export function plotBar(categories, values, options = {}, selector) {
254
272
  .attr("height", (d) => height - y(d))
255
273
  .attr("fill", config.color);
256
274
 
257
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
258
- g.append("g").call(axisLeft(y));
275
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
276
+ const yAxis = g.append("g").call(axisLeft(y));
277
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
278
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
259
279
  }
260
280
 
261
281
  // =======================================================
@@ -331,8 +351,10 @@ export function plotHeatmap(matrix, options = {}, selector) {
331
351
  .text(d => d.value.toFixed(2));
332
352
  }
333
353
 
334
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
335
- g.append("g").call(axisLeft(y));
354
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
355
+ const yAxis = g.append("g").call(axisLeft(y));
356
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
357
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
336
358
  }
337
359
 
338
360
  // =======================================================
@@ -384,8 +406,10 @@ export function plotViolin(groups, options = {}, selector) {
384
406
  .attr("d", mirrored);
385
407
  });
386
408
 
387
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
388
- g.append("g").call(axisLeft(y));
409
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
410
+ const yAxis = g.append("g").call(axisLeft(y));
411
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
412
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
389
413
  }
390
414
 
391
415
  // =======================================================
@@ -413,8 +437,10 @@ export function plotDensity(data, options = {}, selector) {
413
437
  .attr("stroke-width", 2)
414
438
  .attr("d", path);
415
439
 
416
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
417
- g.append("g").call(axisLeft(y));
440
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
441
+ const yAxis = g.append("g").call(axisLeft(y));
442
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
443
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
418
444
  }
419
445
 
420
446
  function kernelDensityEstimator(kernel, X) {
@@ -442,7 +468,6 @@ export function plotQQ(data, options = {}, selector) {
442
468
  plotScatter(theoretical, sorted, options, selector);
443
469
  }
444
470
 
445
- // Z-score inverse (approx)
446
471
  function normalQuantile(p) {
447
472
  const a1 = -39.6968302866538, a2 = 220.946098424521, a3 = -275.928510446969;
448
473
  const a4 = 138.357751867269, a5 = -30.6647980661472, a6 = 2.50662827745924;
@@ -501,10 +526,11 @@ export function plotParallel(data, dimensions, options = {}, selector) {
501
526
  .attr("opacity", 0.6);
502
527
 
503
528
  dimensions.forEach(dim => {
504
- g.append("g")
529
+ const axis = g.append("g")
505
530
  .attr("transform", `translate(${x(dim)},0)`)
506
- .call(axisLeft(y[dim]))
507
- .append("text")
531
+ .call(axisLeft(y[dim]));
532
+ styleAxis(axis, config.yAxisColor || config.axisColor);
533
+ axis.append("text")
508
534
  .style("text-anchor", "middle")
509
535
  .attr("y", -9)
510
536
  .text(dim);
@@ -604,6 +630,8 @@ export function plotMultiline(series, options = {}, selector) {
604
630
  });
605
631
  }
606
632
 
607
- g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
608
- g.append("g").call(axisLeft(y));
633
+ const xAxis = g.append("g").attr("transform", `translate(0,${height})`).call(axisBottom(x));
634
+ const yAxis = g.append("g").call(axisLeft(y));
635
+ styleAxis(xAxis, config.xAxisColor || config.axisColor);
636
+ styleAxis(yAxis, config.yAxisColor || config.axisColor);
609
637
  }