C3.js line chart color at URL

Question

So, I am having problems trying to change the colors of my line chart, which is created from JSON from a URL. Here is my code to generate the chart:

var chart = c3.generate({ bindto: '#chart', data: { url: '../URL.JSON', mimeType: 'json', keys: { x: 'Date', value: ["Line1", "Line2", "Line3", "Line4"] }, type: 'line' }, axis: { x: { type: 'category' } }, size: { height: 500 }, colors: { 'Line1': '#ff0000' } }); 

And here is my JSON format:

 [ {'Date': '9/23/2014', 'Line1': 12, 'Line2': 54, 'Line3': 23, 'Line4': 5}, {'Date': '9/22/2014', 'Line1': 56, 'Line2': 18, 'Line3': 25, 'Line4': 0} ] 

For some reason, the color does not change at all for Line1 with a set of color attributes. So I was wondering if anyone knows how to change the colors to the generated c3 url graph.

Thankyou.

Answer 1

I understood the answer to my question, so I thought I'd post it here.

I had to add:

 color: { pattern: ['#363FBC', '#363FBC', '#B73540', '#B73540'] } 

Instead:

 colors: { 'Line1': '#ff0000' } 

Answer 2

The colors parameter must be inside the data object, for example:

 data: { columns: [ ['data1', 30, 20, 50, 40, 60, 50], ['data2', 200, 130, 90, 240, 130, 220], ['data3', 300, 200, 160, 400, 250, 250] ], type: 'bar', colors: { data1: '#ff0000', data2: '#00ff00', data3: '#0000ff' } }