Opened

Charts: Displaying scale title

trygvonometry commented

Good morning.

I want to display some string to the X and Y axes of a Chart.
As far as I'm able to tell from the source code, ChartAxisScaleLabel seems to be the appropriate type to encapsulate options for this.
However, ChartOptions doesn't contain any references to this class or any option I can use to set axis titles. In fact, there aren't any references to ChartAxisScaleLab, as far as I can tell.

What's the intended way to display axis titles in Blazorise.Charts?

Thank you for your help in advance.

mladenmacanovic commented

Are you on Blazorise v1.0.x? The options class that you mention is only introduced with the last version.

trygvonometry commented

Yes, currently on v1.0.0.

mladenmacanovic commented

I don't how it happens but yes, you're right. The ChartAxisScaleLabel is not referenced anywhere. I need to investigate of it valid anymore or it can be removed altogether.

trygvonometry commented

Alright, keep me posted :) If there's any other way to get to display scale titles, let me know.

mladenmacanovic commented

So you need to show these?

trygvonometry commented

No, I want to display the scale title (in your figure above, that would be "Kelvins", which makes me very hopeful that I've overlooked something).

trygvonometry commented

What version of Blazorise is that for? On 1.0.0, ChartAxis (which is the options type of lineChartOptions.Scales.Y) doesn't have a property named "Text", and I get a build error.

mladenmacanovic commented

It's on 1.0.5. We added some missing chart option APIs with each update from 1.0.0.

trygvonometry commented

Yes, I've updated my package reference to Blazorise.Chart==1.0.5 and "Title" is indeed a Property of ChartAxis, which is great. However, after following the example you linked to (in particular, instantiating the Text option using a string literal) I the following error in the browser console:
Unhandled exception rendering component: Property accessor 'IndexedValues' on object 'Blazorise.Charts.IndexableOption`1[[System.String, System.Private.CoreLib, Version=6.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]]' threw the following exception:'This instance represents a single value. The indexed values are not available.'

After looking a little bit in the source code I'm guessing this is the throwing line: https://github.com/Megabit/Blazorise/blob/67da3e1fb3256f83f25eb378026eda10768322b5/Source/Extensions/Blazorise.Charts/IndexableOption.cs#L35

mladenmacanovic commented

Can you post a snippet of your chart options?

trygvonometry commented edited

Sure thing:

private LineChartOptions Options { get; set; } = new() {
    AspectRatio = 1.5,
    Scales = new() {
        X = new() {
            Title = new() {
                Display = true,
                Text = "X scale title"
            }
        },
        Y = new() {
            Title = new() {
                Display = true,
                Text = "Y scale title"
            }
        }
    }
};
trygvonometry commented

A little more info: The stack trace indicates that this is the line where the exception is raised, and in particular Converters.ToDictionary( Options ).

A fuller exception stack trace:
---> System.InvalidOperationException: This instance represents a single value. The indexed values are not available.
at Blazorise.Charts.IndexableOption1[[System.String, System.Private.CoreLib, Version=6.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]].get_IndexedValues() at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture) --- End of inner exception stack trace --- at System.ComponentModel.ReflectPropertyDescriptor.GetValue(Object component) at Blazorise.Utilities.Converters.ToDictionary(Object source, Boolean addEmptyObjects, Boolean forceCamelCase) at Blazorise.Utilities.Converters.<ToDictionary>g__ProcessValue|1_0(Object value, Boolean emitDefaultValue, <>c__DisplayClass1_0& ) at Blazorise.Utilities.Converters.ToDictionary(Object source, Boolean addEmptyObjects, Boolean forceCamelCase) at Blazorise.Utilities.Converters.<ToDictionary>g__ProcessValue|1_0(Object value, Boolean emitDefaultValue, <>c__DisplayClass1_0& ) at Blazorise.Utilities.Converters.ToDictionary(Object source, Boolean addEmptyObjects, Boolean forceCamelCase) at Blazorise.Utilities.Converters.<ToDictionary>g__ProcessValue|1_0(Object value, Boolean emitDefaultValue, <>c__DisplayClass1_0& ) at Blazorise.Utilities.Converters.ToDictionary(Object source, Boolean addEmptyObjects, Boolean forceCamelCase) at Blazorise.Utilities.Converters.<ToDictionary>g__ProcessValue|1_0(Object value, Boolean emitDefaultValue, <>c__DisplayClass1_0& ) at Blazorise.Utilities.Converters.ToDictionary(Object source, Boolean addEmptyObjects, Boolean forceCamelCase) at Blazorise.Charts.BaseChart4.

mladenmacanovic commented

I'm trying your options all is fine in the demo app


Can you also post your Data settings?

trygvonometry commented edited

Is it the LineChartDataset instances you mean?
If so, these are created as

var dataset = new LineChartDataset<float> {
	Label = "Label for dataset",
	Data = <A List<float> instance>,
	Fill = false,
	Stepped = true,
	Hidden = false
}

which are attached to the linechart with

await lineChart.AddLabelsDatasetsAndUpdate( <a string[] instance>, dataset);
await lineChart.SetOptions(Options);
trygvonometry commented edited

Okey, so I followed the demo you linked to a little more closely, and a difference between my code and yours was that I set the options using await lineChart.SetOptions( Options ) right around when I'm adding the dataset. But in the demo the options are set in the razor file as
<LineChart @ref="lineChart" TItem="float" Options="@Options">

After changing to the latter variant it works for me too.

My hypothesis:

nathanh commented

Is there anyway to fix this as I am trying to use SetOptions() to update the Axis Titles after the initial render, so simply using the Options property doesn't really work for me.

Want to comment on this issue? Log in and write your comment.
Asignee
No assignee
Labels
No Labels