How to show multiple Series of line charts in Views with the Charts module? I need to create multiple line charts in the same chart.  I have a year column, a product column, and a consumer column.  I can plot product and year or consumer and year, but when I use all three columns I get a chart that puts both product and consumer data on the same line.

I am using the Charts module, with the Highcharts library as its charting engine and its views integration.

How can I get a product and consumer line to appear on the same graph?  I was hoping for the chart to look like Preview 6 here: https://www.drupal.org/node/2426177#preview6

Here is what my chart looks like.

Data:



Products:





Consumer:





Both:
The way to get this to work (to put those charts together), is to work with what's called  &quot;parent charts&quot; and &quot;child charts&quot;, as explained within Steps to create charts using the views UI. More specifically what's detailed within the paragraph &quot;Creating Multiple Series and Combo Charts in the UI&quot;. Here is a quote from it:

... you can combine multiple charts on top of each other. The &quot;parent&quot; chart provides the global information, such as the height, width, title, and other properties. Charts that are &quot;children&quot; provide only data and (optionally) a secondary axis. After you've assembled the first series of data in your chart according to the instructions in the Creating Charts using the Views UI section, add a new display to the same view of the type &quot;Chart Add-on&quot;. The &quot;Chart Add-on&quot; type is added the same way you would add a new Page or Block display, from the &quot;+ Add&quot; menu at the top of the view configuration.
After this new display has been added, find the setting for &quot;Combine with parent chart&quot; and change this value to point at the parent chart you have already assembled. Then adjust the settings for the child chart to pull in different data (often by overriding the filter settings). Now you can go back to your parent display, and see that the results from the child chart have been merged into the results from the parent chart. You can even use this approach to combine different types of charts, such as a line chart over the top of a column chart. Note that not all chart types can be combined together and invalid combinations may cause your chart to throw errors.

Refer to &quot;Combination chart without aggregation&quot; for an online demo of such chart. Here is a quote from it:

The chart below (created using the &quot;charts&quot; module) shows a
combination chart about all nodes of content type &quot;Article&quot;, which has
these fields with these &quot;machine names&quot; (+ values):

&quot;field_optionlist&quot; (with some select list values, such as the &quot;year&quot;)
&quot;field_free_format_text&quot; (assumed to contain some numeric values), with Y-axis left, is used in the parent chart.
&quot;field_free_format_nr&quot; (assumed to contain some numeric values), with Y-axis right, is used in the child chart.


This online demo consists of a combination of 2 &quot;Area charts&quot;. If you only change the &quot;settings&quot; for each of the 2 charts to &quot;Line chart&quot; (within &quot;format&quot; of each view), you'd get a similar set of combined charts but shown as line charts instead. Here is the view (in views export format) that created that chart (using &quot;Line chart&quot; as the format for both charts):
$view = new view();
$view-&gt;name = 'combination_chart_without_using_aggregation';
$view-&gt;description = '';
$view-&gt;tag = 'default';
$view-&gt;base_table = 'node';
$view-&gt;human_name = 'Combination chart without using aggregation';
$view-&gt;core = 7;
$view-&gt;api_version = '3.0';
$view-&gt;disabled = FALSE; /* Edit this to true to make a default view disabled initially */

/* Display: Master */
$handler = $view-&gt;new_display('default', 'Master', 'default');
$handler-&gt;display-&gt;display_options['title'] = 'Combination chart without aggregation';
$handler-&gt;display-&gt;display_options['use_more_always'] = FALSE;
$handler-&gt;display-&gt;display_options['access']['type'] = 'perm';
$handler-&gt;display-&gt;display_options['cache']['type'] = 'none';
$handler-&gt;display-&gt;display_options['query']['type'] = 'views_query';
$handler-&gt;display-&gt;display_options['exposed_form']['type'] = 'basic';
$handler-&gt;display-&gt;display_options['pager']['type'] = 'full';
$handler-&gt;display-&gt;display_options['pager']['options']['items_per_page'] = '10';
$handler-&gt;display-&gt;display_options['style_plugin'] = 'chart';
$handler-&gt;display-&gt;display_options['style_options']['type'] = 'line';
$handler-&gt;display-&gt;display_options['style_options']['label_field'] = 'body';
$handler-&gt;display-&gt;display_options['style_options']['data_fields'] = array(
  'field_free_format_text' =&gt; 'field_free_format_text',
  'body' =&gt; 0,
);
$handler-&gt;display-&gt;display_options['style_options']['field_colors'] = array(
  'body' =&gt; '#2f7ed8',
  'field_free_format_text' =&gt; '#233a99',
);
/* Header: Global: Text area */
$handler-&gt;display-&gt;display_options['header']['area']['id'] = 'area';
$handler-&gt;display-&gt;display_options['header']['area']['table'] = 'views';
$handler-&gt;display-&gt;display_options['header']['area']['field'] = 'area';
$handler-&gt;display-&gt;display_options['header']['area']['content'] = 'The chart below (created using the &quot;charts&quot; module) shows a combination chart about all nodes of content type &quot;Article&quot;, which has these fields with these &quot;machine names&quot; (+ values):

- &quot;field_optionlist&quot; (with some select list values, such as the &quot;year&quot;)
- &quot;field_free_format_text&quot; (assumed to contain some numeric values), with Y-axis left, is used in the parent chart.
- &quot;field_free_format_nr&quot; (assumed to contain some numeric values), with Y-axis right, is used in the child chart.';
$handler-&gt;display-&gt;display_options['header']['area']['format'] = 'filtered_html';
/* Field: Content: Free Format Text */
$handler-&gt;display-&gt;display_options['fields']['field_free_format_text']['id'] = 'field_free_format_text';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_text']['table'] = 'field_data_field_free_format_text';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_text']['field'] = 'field_free_format_text';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_text']['label'] = 'Products';
/* Field: Content: OptionList */
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['id'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['table'] = 'field_data_field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['field'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['label'] = 'Year';
/* Sort criterion: Content: Post date */
$handler-&gt;display-&gt;display_options['sorts']['created']['id'] = 'created';
$handler-&gt;display-&gt;display_options['sorts']['created']['table'] = 'node';
$handler-&gt;display-&gt;display_options['sorts']['created']['field'] = 'created';
$handler-&gt;display-&gt;display_options['sorts']['created']['order'] = 'DESC';
/* Filter criterion: Content: Published */
$handler-&gt;display-&gt;display_options['filters']['status']['id'] = 'status';
$handler-&gt;display-&gt;display_options['filters']['status']['table'] = 'node';
$handler-&gt;display-&gt;display_options['filters']['status']['field'] = 'status';
$handler-&gt;display-&gt;display_options['filters']['status']['value'] = 1;
$handler-&gt;display-&gt;display_options['filters']['status']['group'] = 1;
$handler-&gt;display-&gt;display_options['filters']['status']['expose']['operator'] = FALSE;
/* Filter criterion: Content: Type */
$handler-&gt;display-&gt;display_options['filters']['type']['id'] = 'type';
$handler-&gt;display-&gt;display_options['filters']['type']['table'] = 'node';
$handler-&gt;display-&gt;display_options['filters']['type']['field'] = 'type';
$handler-&gt;display-&gt;display_options['filters']['type']['value'] = array(
  'article' =&gt; 'article',
);
/* Filter criterion: Content: OptionList (field_optionlist) */
$handler-&gt;display-&gt;display_options['filters']['field_optionlist_value']['id'] = 'field_optionlist_value';
$handler-&gt;display-&gt;display_options['filters']['field_optionlist_value']['table'] = 'field_data_field_optionlist';
$handler-&gt;display-&gt;display_options['filters']['field_optionlist_value']['field'] = 'field_optionlist_value';
$handler-&gt;display-&gt;display_options['filters']['field_optionlist_value']['value'] = array(
  13 =&gt; '13',
  14 =&gt; '14',
  15 =&gt; '15',
);

/* Display: Chart */
$handler = $view-&gt;new_display('page', 'Chart', 'page');
$handler-&gt;display-&gt;display_options['defaults']['style_plugin'] = FALSE;
$handler-&gt;display-&gt;display_options['style_plugin'] = 'chart';
$handler-&gt;display-&gt;display_options['style_options']['type'] = 'line';
$handler-&gt;display-&gt;display_options['style_options']['xaxis_title'] = 'Year';
$handler-&gt;display-&gt;display_options['style_options']['yaxis_title'] = 'Nr of Products';
$handler-&gt;display-&gt;display_options['style_options']['label_field'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['style_options']['data_fields'] = array(
  'field_free_format_text' =&gt; 'field_free_format_text',
  'field_optionlist' =&gt; 0,
);
$handler-&gt;display-&gt;display_options['style_options']['field_colors'] = array(
  'field_free_format_text' =&gt; '#7b0d49',
  'field_optionlist' =&gt; '#8bbc21',
);
$handler-&gt;display-&gt;display_options['defaults']['style_options'] = FALSE;
$handler-&gt;display-&gt;display_options['defaults']['row_plugin'] = FALSE;
$handler-&gt;display-&gt;display_options['defaults']['row_options'] = FALSE;
$handler-&gt;display-&gt;display_options['path'] = 'combinatuion_chart_with_no_aggregation';

/* Display: Chart add-on */
$handler = $view-&gt;new_display('chart', 'Chart add-on', 'chart_1');
$handler-&gt;display-&gt;display_options['pager']['type'] = 'some';
$handler-&gt;display-&gt;display_options['defaults']['style_plugin'] = FALSE;
$handler-&gt;display-&gt;display_options['style_plugin'] = 'chart_extension';
$handler-&gt;display-&gt;display_options['style_options']['type'] = 'line';
$handler-&gt;display-&gt;display_options['style_options']['label_field'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['style_options']['data_fields'] = array(
  'field_free_format_nr' =&gt; 'field_free_format_nr',
  'field_optionlist' =&gt; 0,
);
$handler-&gt;display-&gt;display_options['style_options']['field_colors'] = array(
  'field_optionlist' =&gt; '#2f7ed8',
  'field_free_format_nr' =&gt; '#006d1a',
);
$handler-&gt;display-&gt;display_options['defaults']['style_options'] = FALSE;
$handler-&gt;display-&gt;display_options['defaults']['row_plugin'] = FALSE;
$handler-&gt;display-&gt;display_options['defaults']['row_options'] = FALSE;
$handler-&gt;display-&gt;display_options['defaults']['fields'] = FALSE;
/* Field: Content: OptionList */
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['id'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['table'] = 'field_data_field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['field'] = 'field_optionlist';
$handler-&gt;display-&gt;display_options['fields']['field_optionlist']['label'] = 'Year';
/* Field: Content: Free Format Nr */
$handler-&gt;display-&gt;display_options['fields']['field_free_format_nr']['id'] = 'field_free_format_nr';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_nr']['table'] = 'field_data_field_free_format_nr';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_nr']['field'] = 'field_free_format_nr';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_nr']['label'] = 'Enduser Price';
$handler-&gt;display-&gt;display_options['fields']['field_free_format_nr']['settings'] = array(
  'thousand_separator' =&gt; '',
  'prefix_suffix' =&gt; 1,
);
$handler-&gt;display-&gt;display_options['parent_display'] = 'page';
$handler-&gt;display-&gt;display_options['inherit_yaxis'] = '0';