Draggable StripLines in Candlestick Chart without JQuery

• May 25, 2020 at 11:57 am #29342
  
  mnash

  I’m trying to create a candlestick chart with multiple striplines, which I have done. I’m using Angular, with Bootstrap and JQuery3.4.1 Slim.

  My issue is with making the striplines draggable. I found this example, https://jsfiddle.net/canvasjs/ef097412/, which works nicely and if I copy the exact code into my index.html it also works. It’s when I try to remove the JQuery syntax and revert back to basic HTML/Typescript that I seem to have issues. For example how do I calculate the offsets when I only have the event property? It also seems that the stripLines function .get(“bounds”) doesn’t exist or returns null.

  Do you think you could create an example the same as https://jsfiddle.net/canvasjs/ef097412/ but without using JQuery please? That would really help me. Thank you in advance.

  May 25, 2020 at 11:34 pm #29353
  
  Indranil

  @mnash,

  Please take a look at this updated JSFiddle for the same example without jQuery(plain JavaScript).

  ___________
  Indranil Deo
  Team CanvasJS

  May 26, 2020 at 8:39 pm #29365
  
  mnash

  Thank you – that’s really useful.

  One further question please, I have added ability to click the chart to add a stripline manually. This automatically creates an area and adds another stripline some distance away, but sometimes this auto-calculated stripline is off the scale of the chart. Is there a way to trigger the chart to re-calculate the x-axis scale?

  May 27, 2020 at 6:49 pm #29374
  
  Indranil

  @mnash,

  Can you kindly create a JSFiddle reproducing the issue you are facing and share it with us so that we can look into your code, understand the scenario better, and help you out?

  ___________
  Indranil Deo
  Team CanvasJS