title: How do I set the max and min of the x-axis of Vega-Lite time series chart?
body: <p>I'm making time series charts with Vega-Lite and I want to set the min and max values of the x-axis independent of the values that are being displayed. The reason is that I'm displaying multiple time series side by side in separate charts, and I want their x-axes to line up even when some series begin earlier than others.</p>
  
  <p>I've found <a href="https://vega.github.io/vega-lite/docs/scale.html#domain" rel="noreferrer"><code>encoding.x.scale.domain</code></a>, which seems like it's the right property to use. <a href="https://vega.github.io/vega-lite/docs/scale.html#domain" rel="noreferrer">The documentation</a> says that for temporal fields this should be a two element array of timestamps. However, it does not seem to matter what I set it to, my chart does not render any line, nor any ticks on the x-axis, and the warning <code>Infinite extent for field "data": [Infinity, -Infinity]"</code> is printed in the console.</p>
  
  <p>Even more confusing is that I've been able to control the y-axis by setting <code>encoding.y.scale.domain</code> in the same way.</p>
  
  <p>The following is a simplified version of the chart spec that I have experimented with in the Vega Editor. I'm trying to set the x-axis to start at an earlier point in time and end at a later point in time than the actual values:</p>
  
  <pre><code>{
    "$schema": "https://vega.github.io/schema/vega-lite/v4.json",
    "data": {
      "values": [
        {"ts": 1500400000000, "v": 1},
        {"ts": 1500500000000, "v": 2},
        {"ts": 1500600000000, "v": 3},
        {"ts": 1500700000000, "v": 2}
      ]
    },
    "width": 800,
    "height": 300,
    "mark": {"type": "line"},
    "encoding": {
      "x": {"field": "ts", "type": "temporal", "scale": {"domain": [1500000000000, 1500900000000]}},
      "y": {"field": "v", "type": "quantitative", "scale": {"domain": [0, 5]}}
    }
  }
  </code></pre>
  
  <p>If I remove the <code>encoding.x.scale.domain</code> property it renders a line, but when including it I can't figure out any values that don't result in the warning.</p>
  
  <p>Is this even the right way to set the min and max of the x-axis? Why does it work for the y-axis but not x-axis? What's the right way to do this?</p>