hyperprop-charting-library 0.1.76 → 0.1.78

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.
@@ -2429,6 +2429,25 @@ function createChart(element, options = {}) {
2429
2429
  ctx.fillStyle = lossFill;
2430
2430
  ctx.fillRect(boxX0, Math.min(entryY, stopY), boxW, Math.abs(stopY - entryY));
2431
2431
  ctx.restore();
2432
+ const livePoint = data[data.length - 1];
2433
+ if (livePoint) {
2434
+ const tickerOpts2 = mergedOptions.tickerLine ?? DEFAULT_OPTIONS.tickerLine;
2435
+ const livePrice = tickerOpts2.smoothing && smoothedTickerPrice !== null ? smoothedTickerPrice : livePoint.c;
2436
+ const lo = Math.min(target.price, stop.price);
2437
+ const hi = Math.max(target.price, stop.price);
2438
+ const clampedLive = Math.min(hi, Math.max(lo, livePrice));
2439
+ const dir = target.price - entry.price;
2440
+ const moved = clampedLive - entry.price;
2441
+ if (dir !== 0 && Math.abs(moved) > 0) {
2442
+ const towardTarget = moved * dir > 0;
2443
+ const liveY = yFromPrice(clampedLive);
2444
+ ctx.save();
2445
+ ctx.globalAlpha = draft ? 0.5 : 1;
2446
+ ctx.fillStyle = hexToRgba(towardTarget ? profitColor : lossColor, 0.22);
2447
+ ctx.fillRect(boxX0, Math.min(entryY, liveY), boxW, Math.abs(liveY - entryY));
2448
+ ctx.restore();
2449
+ }
2450
+ }
2432
2451
  if (isSelected) {
2433
2452
  ctx.save();
2434
2453
  ctx.setLineDash([]);
@@ -2698,6 +2717,23 @@ function createChart(element, options = {}) {
2698
2717
  }
2699
2718
  }
2700
2719
  ctx.restore();
2720
+ const positionAxisGutter = Math.max(0, width - chartRight);
2721
+ if (positionAxisGutter > 0) {
2722
+ for (const positionDrawing of [...drawings, ...draftDrawing ? [draftDrawing] : []]) {
2723
+ if (!positionDrawing.visible) continue;
2724
+ if (positionDrawing.type !== "long-position" && positionDrawing.type !== "short-position") continue;
2725
+ const targetPoint = positionDrawing.points[1];
2726
+ const stopPoint = positionDrawing.points[2];
2727
+ if (!targetPoint || !stopPoint) continue;
2728
+ const bandTop = clamp(Math.min(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2729
+ const bandBottom = clamp(Math.max(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2730
+ if (bandBottom - bandTop < 1) continue;
2731
+ ctx.save();
2732
+ ctx.fillStyle = "rgba(148,163,184,0.18)";
2733
+ ctx.fillRect(chartRight, bandTop, positionAxisGutter, bandBottom - bandTop);
2734
+ ctx.restore();
2735
+ }
2736
+ }
2701
2737
  if (activeSeparateIndicators.length > 0) {
2702
2738
  const xFromIndex = (index) => chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth;
2703
2739
  let paneTopCursor = chartBottom + paneGap;
@@ -3909,7 +3945,8 @@ function createChart(element, options = {}) {
3909
3945
  if (activeDrawingTool === "long-position" || activeDrawingTool === "short-position") {
3910
3946
  const isLong = activeDrawingTool === "long-position";
3911
3947
  const tick = getConfiguredTickSize();
3912
- const priceOffset = tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3948
+ const visibleRange = drawState.yMax - drawState.yMin;
3949
+ const priceOffset = visibleRange > 0 ? visibleRange * 0.12 : tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3913
3950
  const width2 = Math.max(8, Math.round(xSpan * 0.2));
3914
3951
  const entryPrice = point.price;
3915
3952
  const targetPrice = isLong ? entryPrice + priceOffset : entryPrice - priceOffset;
@@ -2403,6 +2403,25 @@ function createChart(element, options = {}) {
2403
2403
  ctx.fillStyle = lossFill;
2404
2404
  ctx.fillRect(boxX0, Math.min(entryY, stopY), boxW, Math.abs(stopY - entryY));
2405
2405
  ctx.restore();
2406
+ const livePoint = data[data.length - 1];
2407
+ if (livePoint) {
2408
+ const tickerOpts2 = mergedOptions.tickerLine ?? DEFAULT_OPTIONS.tickerLine;
2409
+ const livePrice = tickerOpts2.smoothing && smoothedTickerPrice !== null ? smoothedTickerPrice : livePoint.c;
2410
+ const lo = Math.min(target.price, stop.price);
2411
+ const hi = Math.max(target.price, stop.price);
2412
+ const clampedLive = Math.min(hi, Math.max(lo, livePrice));
2413
+ const dir = target.price - entry.price;
2414
+ const moved = clampedLive - entry.price;
2415
+ if (dir !== 0 && Math.abs(moved) > 0) {
2416
+ const towardTarget = moved * dir > 0;
2417
+ const liveY = yFromPrice(clampedLive);
2418
+ ctx.save();
2419
+ ctx.globalAlpha = draft ? 0.5 : 1;
2420
+ ctx.fillStyle = hexToRgba(towardTarget ? profitColor : lossColor, 0.22);
2421
+ ctx.fillRect(boxX0, Math.min(entryY, liveY), boxW, Math.abs(liveY - entryY));
2422
+ ctx.restore();
2423
+ }
2424
+ }
2406
2425
  if (isSelected) {
2407
2426
  ctx.save();
2408
2427
  ctx.setLineDash([]);
@@ -2672,6 +2691,23 @@ function createChart(element, options = {}) {
2672
2691
  }
2673
2692
  }
2674
2693
  ctx.restore();
2694
+ const positionAxisGutter = Math.max(0, width - chartRight);
2695
+ if (positionAxisGutter > 0) {
2696
+ for (const positionDrawing of [...drawings, ...draftDrawing ? [draftDrawing] : []]) {
2697
+ if (!positionDrawing.visible) continue;
2698
+ if (positionDrawing.type !== "long-position" && positionDrawing.type !== "short-position") continue;
2699
+ const targetPoint = positionDrawing.points[1];
2700
+ const stopPoint = positionDrawing.points[2];
2701
+ if (!targetPoint || !stopPoint) continue;
2702
+ const bandTop = clamp(Math.min(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2703
+ const bandBottom = clamp(Math.max(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2704
+ if (bandBottom - bandTop < 1) continue;
2705
+ ctx.save();
2706
+ ctx.fillStyle = "rgba(148,163,184,0.18)";
2707
+ ctx.fillRect(chartRight, bandTop, positionAxisGutter, bandBottom - bandTop);
2708
+ ctx.restore();
2709
+ }
2710
+ }
2675
2711
  if (activeSeparateIndicators.length > 0) {
2676
2712
  const xFromIndex = (index) => chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth;
2677
2713
  let paneTopCursor = chartBottom + paneGap;
@@ -3883,7 +3919,8 @@ function createChart(element, options = {}) {
3883
3919
  if (activeDrawingTool === "long-position" || activeDrawingTool === "short-position") {
3884
3920
  const isLong = activeDrawingTool === "long-position";
3885
3921
  const tick = getConfiguredTickSize();
3886
- const priceOffset = tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3922
+ const visibleRange = drawState.yMax - drawState.yMin;
3923
+ const priceOffset = visibleRange > 0 ? visibleRange * 0.12 : tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3887
3924
  const width2 = Math.max(8, Math.round(xSpan * 0.2));
3888
3925
  const entryPrice = point.price;
3889
3926
  const targetPrice = isLong ? entryPrice + priceOffset : entryPrice - priceOffset;
package/dist/index.cjs CHANGED
@@ -2429,6 +2429,25 @@ function createChart(element, options = {}) {
2429
2429
  ctx.fillStyle = lossFill;
2430
2430
  ctx.fillRect(boxX0, Math.min(entryY, stopY), boxW, Math.abs(stopY - entryY));
2431
2431
  ctx.restore();
2432
+ const livePoint = data[data.length - 1];
2433
+ if (livePoint) {
2434
+ const tickerOpts2 = mergedOptions.tickerLine ?? DEFAULT_OPTIONS.tickerLine;
2435
+ const livePrice = tickerOpts2.smoothing && smoothedTickerPrice !== null ? smoothedTickerPrice : livePoint.c;
2436
+ const lo = Math.min(target.price, stop.price);
2437
+ const hi = Math.max(target.price, stop.price);
2438
+ const clampedLive = Math.min(hi, Math.max(lo, livePrice));
2439
+ const dir = target.price - entry.price;
2440
+ const moved = clampedLive - entry.price;
2441
+ if (dir !== 0 && Math.abs(moved) > 0) {
2442
+ const towardTarget = moved * dir > 0;
2443
+ const liveY = yFromPrice(clampedLive);
2444
+ ctx.save();
2445
+ ctx.globalAlpha = draft ? 0.5 : 1;
2446
+ ctx.fillStyle = hexToRgba(towardTarget ? profitColor : lossColor, 0.22);
2447
+ ctx.fillRect(boxX0, Math.min(entryY, liveY), boxW, Math.abs(liveY - entryY));
2448
+ ctx.restore();
2449
+ }
2450
+ }
2432
2451
  if (isSelected) {
2433
2452
  ctx.save();
2434
2453
  ctx.setLineDash([]);
@@ -2698,6 +2717,23 @@ function createChart(element, options = {}) {
2698
2717
  }
2699
2718
  }
2700
2719
  ctx.restore();
2720
+ const positionAxisGutter = Math.max(0, width - chartRight);
2721
+ if (positionAxisGutter > 0) {
2722
+ for (const positionDrawing of [...drawings, ...draftDrawing ? [draftDrawing] : []]) {
2723
+ if (!positionDrawing.visible) continue;
2724
+ if (positionDrawing.type !== "long-position" && positionDrawing.type !== "short-position") continue;
2725
+ const targetPoint = positionDrawing.points[1];
2726
+ const stopPoint = positionDrawing.points[2];
2727
+ if (!targetPoint || !stopPoint) continue;
2728
+ const bandTop = clamp(Math.min(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2729
+ const bandBottom = clamp(Math.max(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2730
+ if (bandBottom - bandTop < 1) continue;
2731
+ ctx.save();
2732
+ ctx.fillStyle = "rgba(148,163,184,0.18)";
2733
+ ctx.fillRect(chartRight, bandTop, positionAxisGutter, bandBottom - bandTop);
2734
+ ctx.restore();
2735
+ }
2736
+ }
2701
2737
  if (activeSeparateIndicators.length > 0) {
2702
2738
  const xFromIndex = (index) => chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth;
2703
2739
  let paneTopCursor = chartBottom + paneGap;
@@ -3909,7 +3945,8 @@ function createChart(element, options = {}) {
3909
3945
  if (activeDrawingTool === "long-position" || activeDrawingTool === "short-position") {
3910
3946
  const isLong = activeDrawingTool === "long-position";
3911
3947
  const tick = getConfiguredTickSize();
3912
- const priceOffset = tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3948
+ const visibleRange = drawState.yMax - drawState.yMin;
3949
+ const priceOffset = visibleRange > 0 ? visibleRange * 0.12 : tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3913
3950
  const width2 = Math.max(8, Math.round(xSpan * 0.2));
3914
3951
  const entryPrice = point.price;
3915
3952
  const targetPrice = isLong ? entryPrice + priceOffset : entryPrice - priceOffset;
package/dist/index.js CHANGED
@@ -2403,6 +2403,25 @@ function createChart(element, options = {}) {
2403
2403
  ctx.fillStyle = lossFill;
2404
2404
  ctx.fillRect(boxX0, Math.min(entryY, stopY), boxW, Math.abs(stopY - entryY));
2405
2405
  ctx.restore();
2406
+ const livePoint = data[data.length - 1];
2407
+ if (livePoint) {
2408
+ const tickerOpts2 = mergedOptions.tickerLine ?? DEFAULT_OPTIONS.tickerLine;
2409
+ const livePrice = tickerOpts2.smoothing && smoothedTickerPrice !== null ? smoothedTickerPrice : livePoint.c;
2410
+ const lo = Math.min(target.price, stop.price);
2411
+ const hi = Math.max(target.price, stop.price);
2412
+ const clampedLive = Math.min(hi, Math.max(lo, livePrice));
2413
+ const dir = target.price - entry.price;
2414
+ const moved = clampedLive - entry.price;
2415
+ if (dir !== 0 && Math.abs(moved) > 0) {
2416
+ const towardTarget = moved * dir > 0;
2417
+ const liveY = yFromPrice(clampedLive);
2418
+ ctx.save();
2419
+ ctx.globalAlpha = draft ? 0.5 : 1;
2420
+ ctx.fillStyle = hexToRgba(towardTarget ? profitColor : lossColor, 0.22);
2421
+ ctx.fillRect(boxX0, Math.min(entryY, liveY), boxW, Math.abs(liveY - entryY));
2422
+ ctx.restore();
2423
+ }
2424
+ }
2406
2425
  if (isSelected) {
2407
2426
  ctx.save();
2408
2427
  ctx.setLineDash([]);
@@ -2672,6 +2691,23 @@ function createChart(element, options = {}) {
2672
2691
  }
2673
2692
  }
2674
2693
  ctx.restore();
2694
+ const positionAxisGutter = Math.max(0, width - chartRight);
2695
+ if (positionAxisGutter > 0) {
2696
+ for (const positionDrawing of [...drawings, ...draftDrawing ? [draftDrawing] : []]) {
2697
+ if (!positionDrawing.visible) continue;
2698
+ if (positionDrawing.type !== "long-position" && positionDrawing.type !== "short-position") continue;
2699
+ const targetPoint = positionDrawing.points[1];
2700
+ const stopPoint = positionDrawing.points[2];
2701
+ if (!targetPoint || !stopPoint) continue;
2702
+ const bandTop = clamp(Math.min(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2703
+ const bandBottom = clamp(Math.max(yFromPrice(targetPoint.price), yFromPrice(stopPoint.price)), chartTop, chartBottom);
2704
+ if (bandBottom - bandTop < 1) continue;
2705
+ ctx.save();
2706
+ ctx.fillStyle = "rgba(148,163,184,0.18)";
2707
+ ctx.fillRect(chartRight, bandTop, positionAxisGutter, bandBottom - bandTop);
2708
+ ctx.restore();
2709
+ }
2710
+ }
2675
2711
  if (activeSeparateIndicators.length > 0) {
2676
2712
  const xFromIndex = (index) => chartLeft + (index + 0.5 - xStart) / xSpan * chartWidth;
2677
2713
  let paneTopCursor = chartBottom + paneGap;
@@ -3883,7 +3919,8 @@ function createChart(element, options = {}) {
3883
3919
  if (activeDrawingTool === "long-position" || activeDrawingTool === "short-position") {
3884
3920
  const isLong = activeDrawingTool === "long-position";
3885
3921
  const tick = getConfiguredTickSize();
3886
- const priceOffset = tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3922
+ const visibleRange = drawState.yMax - drawState.yMin;
3923
+ const priceOffset = visibleRange > 0 ? visibleRange * 0.12 : tick > 0 ? tick * 60 : Math.abs(point.price) * 0.025 || 1;
3887
3924
  const width2 = Math.max(8, Math.round(xSpan * 0.2));
3888
3925
  const entryPrice = point.price;
3889
3926
  const targetPrice = isLong ? entryPrice + priceOffset : entryPrice - priceOffset;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hyperprop-charting-library",
3
- "version": "0.1.76",
3
+ "version": "0.1.78",
4
4
  "description": "Lightweight TypeScript charting core",
5
5
  "type": "module",
6
6
  "main": "./dist/hyperprop-charting-library.cjs",