title: Display daily and weekly data on AmChart
body: <p>Hello fellow human beings</p>
  <p>I've been looking through the net and the AmChart docs, and I can't find a good solution to this.
  I want to display daily candlestick data, and under that, display the corresponding weekly candlestick data.</p>
  <p>I can get it to work, but it doesn't look right.
  As there are less weekly candles, I want them to take up more horizontal space, or something similar.</p>
  <p>I found some useful properties, like scale, but that scales both horizontal and vertical.</p>
  <p>Does anyone have any tips or an elegant solution for displaying both daily and weekly candlesticks underneath one another?</p>
  <p>Here is some code that I've been fiddling with.</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>am4core.ready(function() {
  
  var chart = am4core.create("chartdiv", am4charts.XYChart);
  //chart.paddingRight = 10;
  
  chart.leftAxesContainer.layout = "vertical"; // stacks charts vertically
  
  chart.dateFormatter.inputDateFormat = "yyyy-MM-dd";
  
  var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
  dateAxis.skipEmptyPeriods = true; // no gaps inbetween candles
  
  // base granularity for the data
  dateAxis.baseInterval =
  {
      timeUnit: 'day',
      count: 1
  };
  
  // base granularity for the grid lines
  dateAxis.gridIntervals.setAll([
      { timeUnit: 'week' , count: 1 },
      { timeUnit: 'week' , count: 5 }
  ]);
  
  dateAxis.paddingRight = '36px'; // creates a little space on the right of the data
  dateAxis.endLocation = 1; // creates a little space on the right of the data
  
  var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
  valueAxis.height = am4core.percent(50);
  valueAxis.tooltip.disabled = true;
  
  var series = chart.series.push(new am4charts.CandlestickSeries());
  
  series.dataFields.dateX = "date";
  series.dataFields.valueY = "close";
  series.dataFields.openValueY = "open";
  series.dataFields.lowValueY = "low";
  series.dataFields.highValueY = "high";
  series.xAxis = dateAxis;
  series.yAxis = valueAxis;
  series.simplifiedProcessing = true;
  series.clustered = false;
  
  
  
  var dateAxis2 = chart.xAxes.push(new am4charts.DateAxis());
  dateAxis2.skipEmptyPeriods = true; // no gaps inbetween candles
  
  // base granularity for the data
  dateAxis2.baseInterval =
  {
      timeUnit: 'week',
      count: 1
  };
  
  // base granularity for the grid lines
  dateAxis2.gridIntervals.setAll([
      { timeUnit: 'week' , count: 1 },
      { timeUnit: 'week' , count: 5 }
  ]);
  
  dateAxis2.paddingRight = '0px'; // creates a little space on the right of the data
  dateAxis2.endLocation = 1; // creates a little space on the right of the data
  
  var valueAxis2 = chart.yAxes.push(new am4charts.ValueAxis());
  valueAxis2.height = am4core.percent(50);
  valueAxis2.marginTop = '40px';
  valueAxis2.tooltip.disabled = true;
  
  var series2 = chart.series.push(new am4charts.CandlestickSeries());
  series2.dataFields.dateX = "date";
  series2.dataFields.valueY = "close2";
  series2.dataFields.openValueY = "open2";
  series2.dataFields.lowValueY = "low2";
  series2.dataFields.highValueY = "high2";
  series2.xAxis = dateAxis2;
  series2.yAxis = valueAxis2;
  series2.simplifiedProcessing = true;
  series2.clustered = false;
  
  chart.cursor = new am4charts.XYCursor();
  
  chart.data = [ {
      "date": "2019-12-30",
      "open": "136.65",
      "high": "136.96",
      "low": "134.15",
      "close": "136.49",
      "open2": "136.65",
      "high2": "137.24",
      "low2": "134.15",
      "close2": "135.03"
    }, {
      "date": "2019-12-31", "open": "135.26", "high": "135.95", "low": "131.50", "close": "131.85"
    }, {
      "date": "2020-01-02", "open": "132.90", "high": "135.27", "low": "128.30", "close": "135.25"
    }, {
      "date": "2020-01-03", "open": "134.94", "high": "137.24", "low": "132.63", "close": "135.03"
    }, {
      "date": "2020-01-06",
      "open": "136.76",
      "high": "136.86",
      "low": "132.00",
      "close": "134.01",
      "open2": "136.76",
      "high2": "136.86",
      "low2": "125.09",
      "close2": "124.03"
    }, {
      "date": "2020-01-07", "open": "131.11", "high": "133.00", "low": "125.09", "close": "126.39"
    }, {
      "date": "2020-01-08", "open": "123.12", "high": "127.75", "low": "120.30", "close": "125.00"
    }, {
      "date": "2020-01-09", "open": "128.32", "high": "129.35", "low": "126.50", "close": "127.79"
    }, {
      "date": "2020-01-10", "open": "128.29", "high": "128.30", "low": "123.71", "close": "124.03"
    }, {
      "date": "2020-01-13",
      "open": "122.74",
      "high": "124.86",
      "low": "119.65",
      "close": "119.90",
      "open2": "122.74",
      "high2": "128.96",
      "low2": "111.62",
      "close2": "127.57"
    }, {
      "date": "2020-01-14", "open": "117.01", "high": "118.50", "low": "111.62", "close": "117.05"
    }, {
      "date": "2020-01-15", "open": "122.01", "high": "123.50", "low": "119.82", "close": "122.06"
    }, {
      "date": "2020-01-16", "open": "123.96", "high": "124.50", "low": "120.50", "close": "122.22"
    }, {
      "date": "2020-01-17", "open": "122.21", "high": "128.96", "low": "121.00", "close": "127.57"
    }, {
      "date": "2020-01-20",
      "open": "131.22",
      "high": "132.75",
      "low": "130.33",
      "close": "132.51",
      "open2": "131.22",
      "high2": "135.37",
      "low2": "126.63",
      "close2": "126.82"
    }, {
      "date": "2020-01-21", "open": "133.09", "high": "133.34", "low": "129.76", "close": "131.07"
    }, {
      "date": "2020-01-22", "open": "130.53", "high": "135.37", "low": "129.81", "close": "135.30"
    }, {
      "date": "2020-01-23", "open": "133.39", "high": "134.66", "low": "132.10", "close": "132.25"
    }, {
      "date": "2020-01-24", "open": "130.99", "high": "132.41", "low": "126.63", "close": "126.82"
    }, {
      "date": "2020-01-27",
      "open": "129.88",
      "high": "134.18",
      "low": "129.54",
      "close": "134.08",
      "open2": "129.88",
      "high2": "145.84",
      "low2": "129.54",
      "close2": "136.76"
    }, {
      "date": "2020-01-28", "open": "132.67", "high": "138.25", "low": "132.30", "close": "136.25"
    }, {
      "date": "2020-02-29", "open": "139.49", "high": "139.65", "low": "137.41", "close": "138.48"
    }, {
      "date": "2020-01-30", "open": "139.94", "high": "145.73", "low": "139.84", "close": "144.16"
    }, {
      "date": "2020-01-31", "open": "144.97", "high": "145.84", "low": "136.10", "close": "136.76"
    }, {
      "date": "2020-02-03",
      "open": "135.56",
      "high": "137.57",
      "low": "132.71",
      "close": "135.01",
      "open2": "135.56",
      "high2": "139.40",
      "low2": "130.00",
      "close2": "136.85"
    }, {
      "date": "2020-02-04", "open": "132.01", "high": "132.30", "low": "130.00", "close": "131.77"
    }, {
      "date": "2020-02-05", "open": "136.99", "high": "138.04", "low": "133.95", "close": "136.71"
    }, {
      "date": "2020-02-06", "open": "137.90", "high": "138.30", "low": "133.75", "close": "135.49"
    }, {
      "date": "2020-02-07", "open": "135.99", "high": "139.40", "low": "135.75", "close": "136.85"
    }];
  }); // end am4core.ready()</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://www.amcharts.com/lib/4/core.js"&gt;&lt;/script&gt;
  &lt;script src="http://www.amcharts.com/lib/4/charts.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div id="chartdiv" style="width: 50%; height: 500px; background-color: #FFFFFF;"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>