mariusmuntean / ChartJs.Blazor

Brings Chart.js charts to Blazor
https://www.iheartblazor.com/
MIT License
677 stars 151 forks source link

Ranges (floating-bars) in Bar Chart #100

Closed Capplequoppe closed 4 years ago

Capplequoppe commented 4 years ago

Describe your question

How can I display a bar chart with ranges in the dataset? Currently I only see wrappers for single values, but ChartJs supports ranges as well. Is it possible to do in the current version?

Which Blazor project type is your question related to?

Which charts is this question related to?

Additional context

Add any additional context, screenshots or code about the question here.

Joelius300 commented 4 years ago

Thanks for the report.

Unfortunately, that's not supported yet. If you've looked at #96 you might've seen that I've used that feature as an example there. I don't know when it'll be implemented. Maybe as part of #96, maybe sooner, maybe later but I'm open for a pull request if you want to take a crack at it.

You should be able to convert this struct to a class (code from #96):

[JsonConverter(typeof(FloatingBarPointConverter))]
public readonly struct FloatingBarPoint : IEquatable<FloatingBarPoint>
{
    public readonly double Start, End;

    public FloatingBarPoint(double start, double end)
    {
        Start = start;
        End = end;
    }

    public override bool Equals(object obj) => obj is FloatingBarPoint point && Equals(point);
    public bool Equals(FloatingBarPoint other) => Start == other.Start && End == other.End;
    public override int GetHashCode() => HashCode.Combine(Start, End);

    public static bool operator ==(FloatingBarPoint left, FloatingBarPoint right) => left.Equals(right);
    public static bool operator !=(FloatingBarPoint left, FloatingBarPoint right) => !(left == right);
}

And add this converter (again from #96):

internal class FloatingBarPointConverter : JsonConverter<FloatingBarPoint>
{
    public override FloatingBarPoint ReadJson(JsonReader reader, Type objectType, FloatingBarPoint existingValue, bool hasExistingValue, JsonSerializer serializer)
    {
        //todo
        throw new NotImplementedException();
    }

    public override void WriteJson(JsonWriter writer, FloatingBarPoint value, JsonSerializer serializer)
    {
        writer.WriteStartArray();
        writer.WriteValue(value.Start);
        writer.WriteValue(value.End);
        writer.WriteEndArray();
    }
}

When you have that you should be able to use BarDataset<FloatingBarPoint> and everything should work fine. I'd love to hear your feeback on how it went :)

Ps. If you want to open a pull request, you'd only need to add summaries and implement the ReadJson method of the FloatingBarPointConverter.