title: How to make `Heatmaps` in `Bokeh` with a continuous color map, using Python 3?
body: <p>I was trying to replicate this style of <code>HeatMap</code> that maps continuous values to a <code>LinearColorMapper</code> instance: <a href="http://docs.bokeh.org/en/latest/docs/gallery/unemployment.html" rel="nofollow noreferrer">http://docs.bokeh.org/en/latest/docs/gallery/unemployment.html</a>
  I wanted to make a <code>HeatMap</code> (w/ either <code>charts</code> or <code>rect</code>) and then add a <a href="http://docs.bokeh.org/en/latest/docs/user_guide/interaction/widgets.html#select" rel="nofollow noreferrer">single selection widget</a> to select the <code>obsv_id</code> and then a <a href="http://docs.bokeh.org/en/latest/docs/user_guide/interaction/widgets.html#slider" rel="nofollow noreferrer">slider widget</a> to go through the <code>dates</code>.</p>
  
  <p>However, I was having trouble in the beginning with the <code>HeatMap</code> itself with a single <code>obsv_id</code>/<code>date</code> pair.  What am I doing wrong in creating this <code>HeatMap</code>?  This would essentially be a 3x3 rectangle plot of the <code>size</code> variable and the <code>loc</code> variable.</p>
  
  <p><strong>Bonus</strong>: Can you help me/give some advice on how to wire the output of these widgets to control the plot?</p>
  
  <p>I saw these posts but all of the examples use actual hex colors as a list instead of mapping using a continuous measure: 
  <a href="https://stackoverflow.com/questions/39191653/python-bokeh-how-to-make-a-correlation-plot">python bokeh, how to make a correlation plot?</a> <a href="http://docs.bokeh.org/en/latest/docs/gallery/categorical.html" rel="nofollow noreferrer">http://docs.bokeh.org/en/latest/docs/gallery/categorical.html</a></p>
  
  <pre class="lang-py prettyprint-override"><code># Init
  import numpy as np
  import pandas as pd
  from bokeh.plotting import figure, output_notebook, output_file, reset_output, show, ColumnDataSource
  from bokeh.models import LinearColorMapper
  reset_output()
  output_notebook()
  
  np.random.seed(0)
  
  # Coords
  dates = ["07-3","07-11","08-6","08-28"]
  #locs = ["air","water","earth"]
  locs = [0,1,2]
  size = [3.0, 0.2, 0.025]
  observations = ["obsv_%d"%_ for _ in range(10)]
  
  
  # Data
  Ar_tmp = np.zeros(( len(dates)*len(locs)*len(size)*len(observations), 5 ), dtype=object)
  
  i = 0
  for date in dates:
      for loc in locs:
          for s in size:
              for obsv_id in observations:
                  Ar_tmp[i,:] = np.array([obsv_id, date, loc, s, np.random.random()])
                  i += 1
  DF_tmp = pd.DataFrame(Ar_tmp, columns=["obsv_id", "date", "loc", "size", "value"])
  DF_tmp["value"] = DF_tmp["value"].astype(float)
  DF_tmp["size"] = DF_tmp["size"].astype(float)
  DF_tmp["loc"] = DF_tmp["loc"].astype(float)
  #     obsv_id   date    loc   size     value
  # 0    obsv_0   07-3    air    3.0  0.548814
  # 1    obsv_1   07-3    air    3.0  0.715189
  # 2    obsv_2   07-3    air    3.0  0.602763
  # 3    obsv_3   07-3    air    3.0  0.544883
  # 4    obsv_4   07-3    air    3.0  0.423655
  
  mapper = LinearColorMapper(low = DF_tmp["value"].min(), high = DF_tmp["value"].max())
  
  # # Create Heatmap of a single observation and date pair
  query_idx = set(DF_tmp.index[DF_tmp["obsv_id"] == "obsv_0"]) &amp; set(DF_tmp.index[DF_tmp["date"] == "08-28"])
  
  # p = HeatMap(data=DF_tmp.loc[query_idx,:], x="loc", y="size", values="value")
  p = figure()
  p.rect(x="loc", y="size", 
         source=ColumnDataSource(DF_tmp.loc[query_idx,:]),
         fill_color={'field': 'value', 'transform': mapper},
         line_color=None)
  show(p)
  </code></pre>
  
  <p>My Error:</p>
  
  <pre><code># Javascript error adding output!
  # TypeError: Cannot read property 'length' of null
  # See your browser Javascript console for more details.
  </code></pre>