carto - Two cartodb visualization on the same html page

I need to display 2 maps separate by vertical line on the middle of the html, it means on diferents and make some buttoms or aplicate the same zoom on both at the same time.

I managed to put one script code map on the first div but when I do the same to the other on the second div it invalidates the previous map and only shows the second map.

Im newbie on javascript. How can I solve this issue?

I know that with Iframe can do it but I need to make functionalities "outside" dinamically with 2 maps at the same time like zoom or filter's or a timelapse for the two at a time. Any ideas for this?

Answer

Your code is not working because you have two "main" functions. You'd just need to use the two createVis methods inside one of them, and get rid of the other.

I have also renamed the variable "map" that you had inside each method, and associating each of the maps to a global variable (map1 or map2) in case you need to use them for something.

The working code is here.