bo_knows
bo_knows

Reputation: 866

Dygraphs change series name dynamically?

I have a dygraphs chart that has 115 or so series plotted on it. It works great. However, I'm trying to figure out how to retrieve the series name of the highlighted series, and how to format that number.

Example on the dygraph fiddle page (though, I use a big php string for data, which won't be shown). http://jsfiddle.net/eM2Mg/861/

I end up with a highlighted label of something like "Year: 1955 Y73 Portfolio: $1,000,000". I want to be able to retrieve that 73 number, and edit what it says. I can't find in the dygraph js file a specific label formatter for the series number ,or a method to retrieve it. I don't want to have to label every series manually.

Ideas? This is a great charting software.

gr = new Dygraph(
// containing div
document.getElementById("graphdiv2"),
// CSV or path to a CSV file.
<?php echo $chartDataString2; ?>,
{
    title: 'Spending Level',
    ylabel: 'Spending ($)',
    xlabel: 'Year',
    labelsDivStyles: { 'textAlign': 'right' },
    digitsAfterDecimal: 0,
    yAxisLabelWidth: 100,
    axes: {
        y: {


                labelsKMB: false,
                maxNumberWidth: 11,
                valueFormatter: function numberWithCommas(x) {
                    return 'Spending: $' + x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                },
                axisLabelFormatter: function numberWithCommas(x) {
                    return '$' + x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                }
        },
        x: {
            valueFormatter: function numberWithCommas(x) {
                    return 'Year: ' + x;
                },
        },
    },
    showLabelsOnHighlight: true,
    highlightCircleSize: 3,
    strokeWidth: 1.5,
    strokeBorderWidth: 0,
 highlightSeriesBackgroundAlpha: 1.0,
    highlightSeriesOpts: {
      strokeWidth: 4,
      strokeBorderWidth: 2,
      highlightCircleSize: 5,
    },
}
);

Upvotes: 0

Views: 1777

Answers (1)

danvk
danvk

Reputation: 16945

The built-in dygraphs legend is good for most charts, but at some point you outgrow it. It sounds like you've reached that point. I'd suggest hiding the built-in legend and implementing your own using highlightCallback and unhighlightCallback. You can get access to the series names via g.getLabels().

Upvotes: 1

Related Questions