Question

I m using dotnetHightcharts

BasicColumnChart

public static Highcharts BasicColumnChart(Series[] Series, string[] Categories, string Title = "", string SubTitle = "", string XAxisTitle = "", string YAxisTitle = "", string ToolTipFormat = "", string YAxisLabel = "")
{
    Highcharts chart = new Highcharts("chart")
        .InitChart(new Chart { DefaultSeriesType = ChartTypes.Column, Height = 300 })
        .SetTitle(new Title { Text = Title })
        .SetSubtitle(new Subtitle { Text = SubTitle })
        .SetXAxis(new XAxis { Categories = Categories })
        .SetYAxis(new YAxis
        {
            Min = 0,
            Title = new YAxisTitle { Text = YAxisTitle },
            Labels = new YAxisLabels
            {
                 Formatter = @"function() { return this.value +' " + YAxisLabel + "';}"
            }
        })
        .SetLegend(new Legend
        {
            Layout = Layouts.Vertical,
            VerticalAlign = VerticalAligns.Top,
            Align = HorizontalAligns.Right,
            Shadow = true,
            BackgroundColor = ColorTranslator.FromHtml("#FFFFFF"),
            Floating = true
        })
        .SetTooltip(new Tooltip { Formatter = @"function() { return ''+ this.x +' - '+ this.y +' " + ToolTipFormat + "'; }" })
        .SetPlotOptions(new PlotOptions
        {
            Column = new PlotOptionsColumn
            {
                PointPadding = 0.2,
                BorderWidth = 0
            }
        })
        .SetSeries(Series);

    return chart;
}

I can set same tooltipFormat for every series with following line:

.SetTooltip(new Tooltip { Formatter = @"function() { return ''+ this.x +' - '+ this.y +' " + ToolTipFormat + "'; }" })

Above code output : date - value tooltipFormat

But I want to show different format for each series. Why do I want this, Because I want to show different data that has different unit, for example:

value[0] = 220 V    //Volt
value[1] = 5 A      //Ampere
...
value[15] = 1200 kW //Kilowatt

there are a lot of example about this topic but, these examples only change text. My data views like this:

NAME     VALUE    UNIT

Volt     220      V
Ampere     5      A
....

I want to change tooltipFormat for each series dynamicly. I want to add UNIT field dynamicly. How can I do this?

Thanks.

Answer 1

You can add custom attribute in series object:

series:{name:'series1',unit:'%'}

and can access it in tooltip formatter function:

this.series.options.unit