DSFSparkline icon indicating copy to clipboard operation
DSFSparkline copied to clipboard

SparkLine with list of same values and zero line overlay not displayed.

Open martindufort opened this issue 1 year ago • 6 comments

In some cases, my sparkline will have a series of identical values. Example:

var activityArray = [CGFloat](repeating: 20.0, count: 30)

I want to show them in a DSFSparklineZeroLineGraphView but for those cases, nothing is displayed. I even set the zeroLineVisible attribute to true.

Anything specific I'm missing? All my values will be positive values but I cannot control if they are all identical or not. Let me know where to investigate.

Thanks.

martindufort avatar Jan 11 '24 23:01 martindufort

I setup the y-range to always start at 0 and now all my values are properly displayed.

Also I noticed a little clipping when the value goes from zero to 1 and back down to zero. Here's the screenshot. Not a showstopper for me...

CleanShot 2024-01-11 at 19 10 33@2x

martindufort avatar Jan 12 '24 00:01 martindufort

Hi @martindufort ,

I want to show them in a DSFSparklineZeroLineGraphView but for those cases, nothing is displayed. I even set the zeroLineVisible attribute to true.

The DSFSparklineZeroLineGraphView should not be used directly to display a graph, you indirectly use it via one of the standard overloaded graphs (as a number of different graph types support drawing a zero line). So if you're wanting to draw a line graph, use the DSFSparklineLineGraphView instead (which inherits from DSFSparklineZeroLineGraphView).

You should really be using DSFSparklineLineGraphView instead.

dagronf avatar Jan 16 '24 02:01 dagronf

@martindufort for example, here is an example I just wrote

class ViewController: NSViewController {

   @IBOutlet weak var graph: DSFSparklineLineGraphView!
   
   override func viewDidLoad() {
      super.viewDidLoad()

      // Do any additional setup after loading the view.

      let activityArray = [CGFloat](repeating: 20.0, count: 30)

      let ds = DSFSparkline.DataSource(values: activityArray, range: 0 ... 30)
      ds.zeroLineValue = 10
      graph.dataSource = ds

      graph.layer!.borderColor = .init(gray: 0.5, alpha: 0.5)
      graph.layer!.borderWidth = 0.5
   }

   override var representedObject: Any? {
      didSet {
      // Update the view, if already loaded.
      }
   }
}
image

dagronf avatar Jan 16 '24 02:01 dagronf

@martindufort,

Also I noticed a little clipping when the value goes from zero to 1 and back down to zero. Here's the screenshot. Not a showstopper for me...

I just quickly adapted the example above with a 0 ... 1 range and values from zero to 1 and back down to zero. I'm not seeing the clipping you're talking about - is it possible to send me a minimal example project that displays the issue you're showing?

class ViewController: NSViewController {

   @IBOutlet weak var graph: DSFSparklineLineGraphView!
   
   override func viewDidLoad() {
      super.viewDidLoad()

      // Do any additional setup after loading the view.

      let activityArray: [CGFloat] = [ 0, 0, 1, 0, 0, 1, 0, 0, 0, 0, 0.5, 1, 1, 0 ]

      let ds = DSFSparkline.DataSource(values: activityArray, range: 0 ... 1)
      ds.zeroLineValue = 0
      graph.dataSource = ds

      graph.interpolated = true

      graph.layer!.borderColor = .init(gray: 0.5, alpha: 0.5)
      graph.layer!.borderWidth = 0.5
   }

   override var representedObject: Any? {
      didSet {
      // Update the view, if already loaded.
      }
   }
}
image

dagronf avatar Jan 16 '24 03:01 dagronf

Thanks for the explanation. Will change my code to use DSFSparklineLineGraphView instead. As for the clipping, I will try to create a sample project.

However comparing your screenshot and mine, seems my zero-line has no space underneath while yours as some buffer. This is running on Ventura 13.6

martindufort avatar Jan 16 '24 17:01 martindufort

This is my init code. I"ve added a border around the graph like you did:

                self.activitySpark.wantsLayer = true
		self.activityDataSource = DSFSparkline.DataSource(windowSize: 30, range: 0.0...2.0)
		self.activityDataSource.zeroLineValue = 0.0
		self.activitySpark.dataSource = self.activityDataSource
		self.activitySpark.interpolated = true

		self.activitySpark.layer!.borderColor = .init(gray: 0.5, alpha: 0.5)
		self.activitySpark.layer!.borderWidth = 0.5

The border is flush with the graph with no space underneath the zero line.

CleanShot 2024-01-16 at 12 32 47@2x

martindufort avatar Jan 16 '24 17:01 martindufort