How put scatter plot on top of a heatmap?

[rdatasculptor]

I have heat map and a scatterplot. I would like to put them on top of eachother, with the heatmap as some kind of bachkground of the scatterplot. How can I do that, since the x and y axes of scatter and heatmaps are different?

I know I need to do something with two different grids, but haven't made it work yet. Does anyone have an example for me?

This is my example code. As you can see when you run it, the scatter plot kind of dissapears.

v <- LETTERS[1:10]
matrix <- data.frame(
  x = sample(v, 300, replace = TRUE), 
  y = sample(v, 300, replace = TRUE), 
  z = rnorm(300, 10, 1),
  stringsAsFactors = FALSE
) |> 
  dplyr::group_by(x, y) |> 
  dplyr::summarise(z = sum(z)) |> 
  dplyr::ungroup()

df <- data.frame(
  x = seq(50),
  y = rnorm(50, 10, 3),
  z = rnorm(50, 11, 2),
  w = rnorm(50, 9, 2)
)

df |> 
  e_charts(x) |> 
  e_scatter(y, z) |>
  e_data(matrix, x) |> 
  e_heatmap(y, z) |> 
  e_visual_map(z)

[rdatasculptor]

Here's one of my attempts. Obivously I miss something here... if I run this code, nothing is shown at all:

df |> 
  e_charts(x) |> 
  e_scatter(y, z, yAxisIndex = 0, xAxisIndex = 0) |>
  e_y_axis(gridIndex = 0, index = 0) |>
  e_x_axis(gridIndex = 0, index = 0) |> 
  e_grid(z = 2, index = 0) |>
  e_data(matrix, x) |> 
  e_heatmap(y, z, yAxisIndex = 1, xAxisIndex = 1) |> 
  e_y_axis(gridIndex = 1, index = 1) |>
  e_x_axis(gridIndex = 1, index = 1) |> 
  e_grid(z = 1, index = 1) |>
  e_visual_map(z)