Question

I have multiple graphs on one page and I am unable to change the color of the lines no matter how I try to explicitly state it. I followed the official documentation and the colors do not change. https://github.com/areski/django-nvd3/blob/master/demoproject/demoproject/views.py#L275

extra_series1 = {"tooltip": {"y_start": "", "y_end": " Mbps"},
               "date_format": tooltip_date,
               'color': '#555555'}

chartdata = {
    'x': xdata,
    'name1': 'Requests Per Second', 'y1': ydata, 'extra1': extra_series1
}

I can however in extra:

    'extra': {
        'x_is_date': True,
        'x_axis_format': '%H:%M:%S',
        'tag_script_js': True,
        'jquery_on_ready': False,
        'color_category':'category10',

And graphs with multiple lines will have a color palette to graph from. However, I need different colors for 1 line graphs.

Based off what pip displays - I have the newest version.

django-nvd3==0.6.0

Was it helpful?

Solution

I know it's a very old topic, but I had the issue myself running:

django-nvd3==0.9.7
python-nvd3==0.14.2

If you take a look at the python-nvd3 lineChart.py (line 27) code example, you'll see the color must be passed as keyword argument like so:

kwargs2 = {'color': 'red'}
chart.add_serie(y=ydata, x=xdata, name='sine', extra=extra_serie, **kwargs1)

Then if you take a look at django_nvd3/templatetags/nvd3_tags.py#L67 source you can see the this same keyword argument is recreated from each series just like the "extra1" and "extra2" is created from their demo_linechart. So if you want to have one line red and the other one blue you can do the following:

chartdata = {
    'x': xdata,
    # series 1
    'name1': 'series 1',
    'y1': ydata,
    'extra1': extra_serie1,
    'kwargs1': { 'color': 'red'}, # <- the important part
    # series 2
    'name2': 'series 1',
    'y2': ydata2,
    'extra2': extra_serie2,
    'kwargs2': { 'color': 'blue'}, # <- the important part
}

I'll probably create a pool request with the fix.

Edit: I've created a pull request that fixes the code example.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top