hyperprop-charting-library 0.1.152 → 0.1.153

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.
@@ -6289,6 +6289,8 @@ function createChart(element, options = {}) {
6289
6289
  const palette = drawing.colors.length > 0 ? drawing.colors : null;
6290
6290
  const levelColorAt = (index) => palette ? palette[index % palette.length] : drawing.color;
6291
6291
  const move = p1.price - p0.price;
6292
+ const lineLeft = Math.min(x0, x1, x2);
6293
+ const lineRight = Math.max(x0, x1, x2);
6292
6294
  const levelLines = FIB_EXT_RATIOS.map((ratio) => {
6293
6295
  const price = p2.price + move * ratio;
6294
6296
  return { ratio, price, y: yFromPrice(price) };
@@ -6301,7 +6303,7 @@ function createChart(element, options = {}) {
6301
6303
  ctx.save();
6302
6304
  ctx.fillStyle = hexToRgba(levelColorAt(index), 0.1);
6303
6305
  ctx.globalAlpha = draft ? 0.5 : 1;
6304
- ctx.fillRect(chartLeft, bandTop, chartRight - chartLeft, bandBottom - bandTop);
6306
+ ctx.fillRect(lineLeft, bandTop, lineRight - lineLeft, bandBottom - bandTop);
6305
6307
  ctx.restore();
6306
6308
  }
6307
6309
  ctx.save();
@@ -6310,8 +6312,8 @@ function createChart(element, options = {}) {
6310
6312
  levelLines.forEach((level, index) => {
6311
6313
  ctx.strokeStyle = levelColorAt(index);
6312
6314
  ctx.beginPath();
6313
- ctx.moveTo(crisp(chartLeft), crisp(level.y));
6314
- ctx.lineTo(crisp(chartRight), crisp(level.y));
6315
+ ctx.moveTo(crisp(lineLeft), crisp(level.y));
6316
+ ctx.lineTo(crisp(lineRight), crisp(level.y));
6315
6317
  ctx.stroke();
6316
6318
  });
6317
6319
  ctx.restore();
@@ -6321,7 +6323,7 @@ function createChart(element, options = {}) {
6321
6323
  const labelText = `${level.ratio} (${formatPrice(level.price)})`;
6322
6324
  const textWidth = measureTextWidth(labelText);
6323
6325
  const padding = 4;
6324
- const bgX = chartLeft + 4;
6326
+ const bgX = Math.max(chartLeft + 2, lineLeft - textWidth - padding * 2 - 4);
6325
6327
  const bgY = level.y - 9;
6326
6328
  ctx.fillStyle = mergedOptions.backgroundColor;
6327
6329
  fillRoundedRect(bgX, bgY, textWidth + padding * 2, 16, 3);
@@ -9387,12 +9389,16 @@ function createChart(element, options = {}) {
9387
9389
  if (Math.hypot(x - x2, y - y2) <= 9 * hitTolerance) {
9388
9390
  return { drawing, target: "handle", pointIndex: 1 };
9389
9391
  }
9390
- const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9391
- for (const ratio of fibRatios) {
9392
- const price = first.price + (second.price - first.price) * (1 - ratio);
9393
- const lineY = canvasYFromDrawingPrice(price);
9394
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9395
- return { drawing, target: "line" };
9392
+ const fibLeft = Math.min(x1, x2) - 5 * hitTolerance;
9393
+ const fibRight = Math.max(x1, x2) + 5 * hitTolerance;
9394
+ if (x >= fibLeft && x <= fibRight) {
9395
+ const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9396
+ for (const ratio of fibRatios) {
9397
+ const price = first.price + (second.price - first.price) * (1 - ratio);
9398
+ const lineY = canvasYFromDrawingPrice(price);
9399
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9400
+ return { drawing, target: "line" };
9401
+ }
9396
9402
  }
9397
9403
  }
9398
9404
  } else if (drawing.type === "fib-extension") {
@@ -9417,11 +9423,15 @@ function createChart(element, options = {}) {
9417
9423
  return { drawing, target: "handle", pointIndex: 2 };
9418
9424
  }
9419
9425
  const move = p1.price - p0.price;
9420
- const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9421
- for (const ratio of fibExtRatios) {
9422
- const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9423
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9424
- return { drawing, target: "line" };
9426
+ const extLeft = Math.min(x0, x1, x2) - 5 * hitTolerance;
9427
+ const extRight = Math.max(x0, x1, x2) + 5 * hitTolerance;
9428
+ if (x >= extLeft && x <= extRight) {
9429
+ const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9430
+ for (const ratio of fibExtRatios) {
9431
+ const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9432
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9433
+ return { drawing, target: "line" };
9434
+ }
9425
9435
  }
9426
9436
  }
9427
9437
  if (distanceToSegment(x, y, x0, y0, x1, y1) <= 6 * hitTolerance || distanceToSegment(x, y, x1, y1, x2, y2) <= 6 * hitTolerance) {
@@ -6253,6 +6253,8 @@ function createChart(element, options = {}) {
6253
6253
  const palette = drawing.colors.length > 0 ? drawing.colors : null;
6254
6254
  const levelColorAt = (index) => palette ? palette[index % palette.length] : drawing.color;
6255
6255
  const move = p1.price - p0.price;
6256
+ const lineLeft = Math.min(x0, x1, x2);
6257
+ const lineRight = Math.max(x0, x1, x2);
6256
6258
  const levelLines = FIB_EXT_RATIOS.map((ratio) => {
6257
6259
  const price = p2.price + move * ratio;
6258
6260
  return { ratio, price, y: yFromPrice(price) };
@@ -6265,7 +6267,7 @@ function createChart(element, options = {}) {
6265
6267
  ctx.save();
6266
6268
  ctx.fillStyle = hexToRgba(levelColorAt(index), 0.1);
6267
6269
  ctx.globalAlpha = draft ? 0.5 : 1;
6268
- ctx.fillRect(chartLeft, bandTop, chartRight - chartLeft, bandBottom - bandTop);
6270
+ ctx.fillRect(lineLeft, bandTop, lineRight - lineLeft, bandBottom - bandTop);
6269
6271
  ctx.restore();
6270
6272
  }
6271
6273
  ctx.save();
@@ -6274,8 +6276,8 @@ function createChart(element, options = {}) {
6274
6276
  levelLines.forEach((level, index) => {
6275
6277
  ctx.strokeStyle = levelColorAt(index);
6276
6278
  ctx.beginPath();
6277
- ctx.moveTo(crisp(chartLeft), crisp(level.y));
6278
- ctx.lineTo(crisp(chartRight), crisp(level.y));
6279
+ ctx.moveTo(crisp(lineLeft), crisp(level.y));
6280
+ ctx.lineTo(crisp(lineRight), crisp(level.y));
6279
6281
  ctx.stroke();
6280
6282
  });
6281
6283
  ctx.restore();
@@ -6285,7 +6287,7 @@ function createChart(element, options = {}) {
6285
6287
  const labelText = `${level.ratio} (${formatPrice(level.price)})`;
6286
6288
  const textWidth = measureTextWidth(labelText);
6287
6289
  const padding = 4;
6288
- const bgX = chartLeft + 4;
6290
+ const bgX = Math.max(chartLeft + 2, lineLeft - textWidth - padding * 2 - 4);
6289
6291
  const bgY = level.y - 9;
6290
6292
  ctx.fillStyle = mergedOptions.backgroundColor;
6291
6293
  fillRoundedRect(bgX, bgY, textWidth + padding * 2, 16, 3);
@@ -9351,12 +9353,16 @@ function createChart(element, options = {}) {
9351
9353
  if (Math.hypot(x - x2, y - y2) <= 9 * hitTolerance) {
9352
9354
  return { drawing, target: "handle", pointIndex: 1 };
9353
9355
  }
9354
- const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9355
- for (const ratio of fibRatios) {
9356
- const price = first.price + (second.price - first.price) * (1 - ratio);
9357
- const lineY = canvasYFromDrawingPrice(price);
9358
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9359
- return { drawing, target: "line" };
9356
+ const fibLeft = Math.min(x1, x2) - 5 * hitTolerance;
9357
+ const fibRight = Math.max(x1, x2) + 5 * hitTolerance;
9358
+ if (x >= fibLeft && x <= fibRight) {
9359
+ const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9360
+ for (const ratio of fibRatios) {
9361
+ const price = first.price + (second.price - first.price) * (1 - ratio);
9362
+ const lineY = canvasYFromDrawingPrice(price);
9363
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9364
+ return { drawing, target: "line" };
9365
+ }
9360
9366
  }
9361
9367
  }
9362
9368
  } else if (drawing.type === "fib-extension") {
@@ -9381,11 +9387,15 @@ function createChart(element, options = {}) {
9381
9387
  return { drawing, target: "handle", pointIndex: 2 };
9382
9388
  }
9383
9389
  const move = p1.price - p0.price;
9384
- const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9385
- for (const ratio of fibExtRatios) {
9386
- const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9387
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9388
- return { drawing, target: "line" };
9390
+ const extLeft = Math.min(x0, x1, x2) - 5 * hitTolerance;
9391
+ const extRight = Math.max(x0, x1, x2) + 5 * hitTolerance;
9392
+ if (x >= extLeft && x <= extRight) {
9393
+ const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9394
+ for (const ratio of fibExtRatios) {
9395
+ const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9396
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9397
+ return { drawing, target: "line" };
9398
+ }
9389
9399
  }
9390
9400
  }
9391
9401
  if (distanceToSegment(x, y, x0, y0, x1, y1) <= 6 * hitTolerance || distanceToSegment(x, y, x1, y1, x2, y2) <= 6 * hitTolerance) {
package/dist/index.cjs CHANGED
@@ -6289,6 +6289,8 @@ function createChart(element, options = {}) {
6289
6289
  const palette = drawing.colors.length > 0 ? drawing.colors : null;
6290
6290
  const levelColorAt = (index) => palette ? palette[index % palette.length] : drawing.color;
6291
6291
  const move = p1.price - p0.price;
6292
+ const lineLeft = Math.min(x0, x1, x2);
6293
+ const lineRight = Math.max(x0, x1, x2);
6292
6294
  const levelLines = FIB_EXT_RATIOS.map((ratio) => {
6293
6295
  const price = p2.price + move * ratio;
6294
6296
  return { ratio, price, y: yFromPrice(price) };
@@ -6301,7 +6303,7 @@ function createChart(element, options = {}) {
6301
6303
  ctx.save();
6302
6304
  ctx.fillStyle = hexToRgba(levelColorAt(index), 0.1);
6303
6305
  ctx.globalAlpha = draft ? 0.5 : 1;
6304
- ctx.fillRect(chartLeft, bandTop, chartRight - chartLeft, bandBottom - bandTop);
6306
+ ctx.fillRect(lineLeft, bandTop, lineRight - lineLeft, bandBottom - bandTop);
6305
6307
  ctx.restore();
6306
6308
  }
6307
6309
  ctx.save();
@@ -6310,8 +6312,8 @@ function createChart(element, options = {}) {
6310
6312
  levelLines.forEach((level, index) => {
6311
6313
  ctx.strokeStyle = levelColorAt(index);
6312
6314
  ctx.beginPath();
6313
- ctx.moveTo(crisp(chartLeft), crisp(level.y));
6314
- ctx.lineTo(crisp(chartRight), crisp(level.y));
6315
+ ctx.moveTo(crisp(lineLeft), crisp(level.y));
6316
+ ctx.lineTo(crisp(lineRight), crisp(level.y));
6315
6317
  ctx.stroke();
6316
6318
  });
6317
6319
  ctx.restore();
@@ -6321,7 +6323,7 @@ function createChart(element, options = {}) {
6321
6323
  const labelText = `${level.ratio} (${formatPrice(level.price)})`;
6322
6324
  const textWidth = measureTextWidth(labelText);
6323
6325
  const padding = 4;
6324
- const bgX = chartLeft + 4;
6326
+ const bgX = Math.max(chartLeft + 2, lineLeft - textWidth - padding * 2 - 4);
6325
6327
  const bgY = level.y - 9;
6326
6328
  ctx.fillStyle = mergedOptions.backgroundColor;
6327
6329
  fillRoundedRect(bgX, bgY, textWidth + padding * 2, 16, 3);
@@ -9387,12 +9389,16 @@ function createChart(element, options = {}) {
9387
9389
  if (Math.hypot(x - x2, y - y2) <= 9 * hitTolerance) {
9388
9390
  return { drawing, target: "handle", pointIndex: 1 };
9389
9391
  }
9390
- const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9391
- for (const ratio of fibRatios) {
9392
- const price = first.price + (second.price - first.price) * (1 - ratio);
9393
- const lineY = canvasYFromDrawingPrice(price);
9394
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9395
- return { drawing, target: "line" };
9392
+ const fibLeft = Math.min(x1, x2) - 5 * hitTolerance;
9393
+ const fibRight = Math.max(x1, x2) + 5 * hitTolerance;
9394
+ if (x >= fibLeft && x <= fibRight) {
9395
+ const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9396
+ for (const ratio of fibRatios) {
9397
+ const price = first.price + (second.price - first.price) * (1 - ratio);
9398
+ const lineY = canvasYFromDrawingPrice(price);
9399
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9400
+ return { drawing, target: "line" };
9401
+ }
9396
9402
  }
9397
9403
  }
9398
9404
  } else if (drawing.type === "fib-extension") {
@@ -9417,11 +9423,15 @@ function createChart(element, options = {}) {
9417
9423
  return { drawing, target: "handle", pointIndex: 2 };
9418
9424
  }
9419
9425
  const move = p1.price - p0.price;
9420
- const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9421
- for (const ratio of fibExtRatios) {
9422
- const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9423
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9424
- return { drawing, target: "line" };
9426
+ const extLeft = Math.min(x0, x1, x2) - 5 * hitTolerance;
9427
+ const extRight = Math.max(x0, x1, x2) + 5 * hitTolerance;
9428
+ if (x >= extLeft && x <= extRight) {
9429
+ const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9430
+ for (const ratio of fibExtRatios) {
9431
+ const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9432
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9433
+ return { drawing, target: "line" };
9434
+ }
9425
9435
  }
9426
9436
  }
9427
9437
  if (distanceToSegment(x, y, x0, y0, x1, y1) <= 6 * hitTolerance || distanceToSegment(x, y, x1, y1, x2, y2) <= 6 * hitTolerance) {
package/dist/index.js CHANGED
@@ -6253,6 +6253,8 @@ function createChart(element, options = {}) {
6253
6253
  const palette = drawing.colors.length > 0 ? drawing.colors : null;
6254
6254
  const levelColorAt = (index) => palette ? palette[index % palette.length] : drawing.color;
6255
6255
  const move = p1.price - p0.price;
6256
+ const lineLeft = Math.min(x0, x1, x2);
6257
+ const lineRight = Math.max(x0, x1, x2);
6256
6258
  const levelLines = FIB_EXT_RATIOS.map((ratio) => {
6257
6259
  const price = p2.price + move * ratio;
6258
6260
  return { ratio, price, y: yFromPrice(price) };
@@ -6265,7 +6267,7 @@ function createChart(element, options = {}) {
6265
6267
  ctx.save();
6266
6268
  ctx.fillStyle = hexToRgba(levelColorAt(index), 0.1);
6267
6269
  ctx.globalAlpha = draft ? 0.5 : 1;
6268
- ctx.fillRect(chartLeft, bandTop, chartRight - chartLeft, bandBottom - bandTop);
6270
+ ctx.fillRect(lineLeft, bandTop, lineRight - lineLeft, bandBottom - bandTop);
6269
6271
  ctx.restore();
6270
6272
  }
6271
6273
  ctx.save();
@@ -6274,8 +6276,8 @@ function createChart(element, options = {}) {
6274
6276
  levelLines.forEach((level, index) => {
6275
6277
  ctx.strokeStyle = levelColorAt(index);
6276
6278
  ctx.beginPath();
6277
- ctx.moveTo(crisp(chartLeft), crisp(level.y));
6278
- ctx.lineTo(crisp(chartRight), crisp(level.y));
6279
+ ctx.moveTo(crisp(lineLeft), crisp(level.y));
6280
+ ctx.lineTo(crisp(lineRight), crisp(level.y));
6279
6281
  ctx.stroke();
6280
6282
  });
6281
6283
  ctx.restore();
@@ -6285,7 +6287,7 @@ function createChart(element, options = {}) {
6285
6287
  const labelText = `${level.ratio} (${formatPrice(level.price)})`;
6286
6288
  const textWidth = measureTextWidth(labelText);
6287
6289
  const padding = 4;
6288
- const bgX = chartLeft + 4;
6290
+ const bgX = Math.max(chartLeft + 2, lineLeft - textWidth - padding * 2 - 4);
6289
6291
  const bgY = level.y - 9;
6290
6292
  ctx.fillStyle = mergedOptions.backgroundColor;
6291
6293
  fillRoundedRect(bgX, bgY, textWidth + padding * 2, 16, 3);
@@ -9351,12 +9353,16 @@ function createChart(element, options = {}) {
9351
9353
  if (Math.hypot(x - x2, y - y2) <= 9 * hitTolerance) {
9352
9354
  return { drawing, target: "handle", pointIndex: 1 };
9353
9355
  }
9354
- const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9355
- for (const ratio of fibRatios) {
9356
- const price = first.price + (second.price - first.price) * (1 - ratio);
9357
- const lineY = canvasYFromDrawingPrice(price);
9358
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9359
- return { drawing, target: "line" };
9356
+ const fibLeft = Math.min(x1, x2) - 5 * hitTolerance;
9357
+ const fibRight = Math.max(x1, x2) + 5 * hitTolerance;
9358
+ if (x >= fibLeft && x <= fibRight) {
9359
+ const fibRatios = [0, 0.236, 0.382, 0.5, 0.618, 0.786, 1, 1.618];
9360
+ for (const ratio of fibRatios) {
9361
+ const price = first.price + (second.price - first.price) * (1 - ratio);
9362
+ const lineY = canvasYFromDrawingPrice(price);
9363
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9364
+ return { drawing, target: "line" };
9365
+ }
9360
9366
  }
9361
9367
  }
9362
9368
  } else if (drawing.type === "fib-extension") {
@@ -9381,11 +9387,15 @@ function createChart(element, options = {}) {
9381
9387
  return { drawing, target: "handle", pointIndex: 2 };
9382
9388
  }
9383
9389
  const move = p1.price - p0.price;
9384
- const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9385
- for (const ratio of fibExtRatios) {
9386
- const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9387
- if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9388
- return { drawing, target: "line" };
9390
+ const extLeft = Math.min(x0, x1, x2) - 5 * hitTolerance;
9391
+ const extRight = Math.max(x0, x1, x2) + 5 * hitTolerance;
9392
+ if (x >= extLeft && x <= extRight) {
9393
+ const fibExtRatios = [0, 0.382, 0.5, 0.618, 1, 1.272, 1.618, 2.618];
9394
+ for (const ratio of fibExtRatios) {
9395
+ const lineY = canvasYFromDrawingPrice(p2.price + move * ratio);
9396
+ if (Math.abs(y - lineY) <= 5 * hitTolerance) {
9397
+ return { drawing, target: "line" };
9398
+ }
9389
9399
  }
9390
9400
  }
9391
9401
  if (distanceToSegment(x, y, x0, y0, x1, y1) <= 6 * hitTolerance || distanceToSegment(x, y, x1, y1, x2, y2) <= 6 * hitTolerance) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hyperprop-charting-library",
3
- "version": "0.1.152",
3
+ "version": "0.1.153",
4
4
  "description": "Lightweight TypeScript charting core",
5
5
  "type": "module",
6
6
  "main": "./dist/hyperprop-charting-library.cjs",