As I mentioned, there will be a dynamic list, generated from 2 different scenarios for the same relative timeline. I'm not really seeing how this dynamically generates the stacked-fragment-series and callout-layer objects.

Both scenarios will always have the exact same list of products, but generally they will only include 10-40 of the 200+ products in the system.

The data looks a lot more like this:

    this.data = [
      { Scenario: 'A', Series: 'Star Wars (Classic)', Classification: 'Vehicle', Kit: 'AT-AT Walker', "Q1'21": 5, "Q2'21": 4, "Q3'21": 3, "Q4'21": 4, },
      { Scenario: 'B', Series: 'Star Wars (Classic)', Classification: 'Vehicle', Kit: 'AT-AT Walker', "Q1'21": 7, "Q2'21": 2, "Q3'21": 6, "Q4'21": 1, },
      { Scenario: 'A', Series: 'Star Wars (Disney)', Classification: 'Vehicle', Kit: 'AT-AT Walker', "Q1'21": 4, "Q2'21": 5, "Q3'21": 4, "Q4'21": 3, },
      { Scenario: 'B', Series: 'Star Wars (Disney)', Classification: 'Vehicle', Kit: 'AT-AT Walker', "Q1'21": 3, "Q2'21": 10, "Q3'21": 2, "Q4'21": 6, },
      { Scenario: 'A', Series: 'Marvel', Classification: 'Building', Kit: 'Avengers Tower', "Q1'21": 3, "Q2'21": 4, "Q3'21": 5, "Q4'21": 4, },
      { Scenario: 'B', Series: 'Marvel', Classification: 'Building', Kit: 'Avengers Tower', "Q1'21": 5, "Q2'21": 7, "Q3'21": 9, "Q4'21": 7, },
      { Scenario: 'A', Series: 'Marvel', Classification: 'Building', Kit: "Stark's Mansion", "Q1'21": 2, "Q2'21": 3, "Q3'21": 4, "Q4'21": 5, },
      { Scenario: 'B', Series: 'Marvel', Classification: 'Building', Kit: "Stark's Mansion", "Q1'21": 4, "Q2'21": 9, "Q3'21": 5, "Q4'21": 3, }
    ];

Where we expect a range of time periods, so they are contained in their own array (typically we break it down to a week at a time, but quarters is fine for the purpose of demonstration).

Essentially, we'll have multiple time periods for each Series-Kit mapping in each scenario, and we would normally have close to 11 different metrics per time period. The charts will be generated per metric, filter-able by Series, Classification, or down to specific Kits across 2 scenarios.

I'm expecting to need ngFor to fill igx-stacked-line-series with Scenario A, igx-stacked-area-series with Scenario B, and igx-callout-layer with Scenario B. There's no example of that, yet.

Updated to accurate representation of filtered data for the selected metric. Please build a working example in Stackblitz from these parameters.

Thanks!

I will try each option until I find one that works. I can let you know which is most viable and provide some implementation details, if you like.

The dotted line suggestion was submitted almost 3 years ago and is the highest voted suggestion at present. I wonder if someone should circle back around with that team to see when it will actually get into their backlog/worklist...

Thanks again for all your help!

That helped a lot. I was able to resolve that use case.

The other use case that I am working on is a comparison between 3 scenarios (2 quarterly projections and a scenario of actual production/sales values), comparing two parameters (let's say number of kits produced vs percentage of kits sold against that production value).

Because the use case is much more complex, I will need to dynamically create a separate chart for each product in its own tab. There will be a line for the percentage (sold vs production count) with its y-axis on the left for each scenario and likewise, there will be a bar for each scenario for the production count with a y-axis on the right.

Your first example shows me how to chart the resultant data the way I need to, with one exception. Users would like to see a dotted line for the Actual percentage.

I'm envisioning two different ways of doing this:

• An array of tabs holding separate charts (*ngFor and ViewChild nightmare), each with their own set of controls similar to the previously attached example.
• An array of tabs (still *ngFor frustration) but with the exact same chart declared within and basically changing the values in the chart based on which tab (index - 1 of product in array) was selected.

I'm open to other suggestions you have for proceeding forward, and thanks again for all the help to this point.