Add ability to edit point attributes on a line chart.

[ThePoShWolf]

Add ability to edit Point attributes on the line graphs

First off, I love the charting in PSHTML! I'd also like if it was possible to edit the point attributes on a line chart.

Specifically, looking at the Chart.js docs they mention several attributes that I'd like to be able to set with PSHTML:

pointRadius (this is hard coded to 4 in Class datasetline)
pointHitRadius
pointHoverRadius

Steps to reproduce

Create a line chart and the script will contain:

"pointRadius":4, ... "pointHitRadius":null, ... "pointHoverRadius":0

I'm happy to take this issue, but wanted to submit it before working on it.

[Stephanevg]

Hi @ThePoShWolf thank you SO much for opening this issue.
I am SO thrilled to the idea you live streaming this. I'll defenitley try to connect. 🤞 😃

I agree with you, that it would be great this available, and I am so happy you want to work on this one 🎉 👍

Do you have already an idea of how you want to implement this? (Have a look at the diagram here under before answering this question ;) )

Also, on a side note: I realized I never created the Class diagram for the charting functionality, I have done this a few minutes ago, and you can have a look at the UML(ish) diagram here --> Class Diagram
I think this really helps to have a good global understanding / overview of the solution.

[ThePoShWolf]

Hey! Glad to hear it. I can't emphasize enough how excited I was when I found PSHTML and saw that it could chart 😃

The datasetline class already has the properties, they just aren't parameterized. So I think it is as simple as adding the parameters to New-PSHTMLChartLineDataSet and then setting them on the $DataChart object within that function like you already set the other properties.

In fact, just looking through it now, it might actually be a lot easier than I initially thought. We'll see!

Great idea on the diagrams. That helps a lot!

[Stephanevg]

Awesome @ThePoShWolf. I am really curious to see what you have built with PSHTML up until now. 👀

Concerning the parameters, what do you think if we added Getters and setters on the DataSetLine class first, and reuse these ones in New-PSHTMLChartLineDataset (which will be filled using Parameters passed on cmdlet) ?

Like that, we could potentially reuse these in the future ( if needed of course)

[ThePoShWolf]

My first project is a pet project tracking some stats for a game that I play 😆 You can see how that is coming along here: http://utographs.com. If you look at one of the longer charts you can see how the points are all overlapping. That is what I'm trying to solve.

That entire site is all generated using PSHTML and hosted in an Azure storage account with static hosting enabled. Its not much at this point, but PSHTML makes it possible!

Yeah, that would work. Are you thinking along the lines of:

$DataChart.SetPointRadius(0,4,4)

And then the method be something like:

void SetPointRadius([int]$PointRadius,[int]$PointHitRadius,{int]$PointHoverRadius){
    #Code
}

And of course a corresponding

PS> $DataChart.GetPointRadius()

PointRadius      : 0
PointHitRadius   : 4
PointHoverRadius : 4

Or something different?

[Stephanevg]

That is so cool to see the module in action. what is that game actually about? I have difficulties to understand the meaning behind the numbers.

I am unfamiliar with the settings of a point to be honnest, but when seeing a method called SetPointRadius I would assume it would only set the point radius, and not the PointHitRadius & PointHoverRadius.

If I read your example correctly, you are setting the Properties or settings of the point actually, right?

What do you think of something like this?

void SetPointSettings([int]$PointRadius,[int]$PointHitRadius,{int]$PointHoverRadius){
    
  $this.SetPointRadius([int]$PointRadius)
  $this.SetPointHitRadius([int]$PointHitRadius)
  #code...
}

Using the internal methods would allow us to reuse these setters for other stuff, and also have it available if only one setting needs to be set for instance etc..

That method can then be called in the Function as you suggested before. Easy peasy!

Also, you were mentioning that it might be quicker then what you thought to fix this. If you are searching for more content around this, perhaps you can try to have a look / try to create the pester tests for that method.

[ThePoShWolf]

Ah, good point. I'll use SetPointSettings or something similar.

And sure, I'm not all that good with Pester, but I'm always looking to improve. Would that be in: Chart.DatasetLine.Tests.ps1?

[Stephanevg]

wow you are quick! Yeah that would be in that file.
btw, I have made some arrangements, so that I can join your live stream session tomorrow 🎉

[Stephanevg]

@ThePoShWolf Concerning the Pester tests, it got me thinking, you can always generate them automatically using Write-CUPesterTest from PSClassUtils.

You will have to be carefull though, as it will generate the basic set of steps, overwriting the already existing tests. So I'd recommend that if you use it, you use it along these lines.

Write-CUPesterTest -Path $SourcefileFullName -ExportFolderPath $FolderPath -AddInModuleScope PSHTML

I am planning to add functionality to generate tests only for a specific Class / Constructor / Method but I am not quite there yet.

[ThePoShWolf]

That is sweet. I'll have to spend some time with PSClassUtils now 😃

[Stephanevg]

Adding this tweet https://twitter.com/Stephanevg/status/1106720563467300864?s=19 as i think it is a part of this conversation.
cc: @ThePoShWolf