Multiple a-scene using canvas - aframe

Question

I wanted to build a house tour using a-frame. The house has 6 rooms that you can explore. I have read that we can use canvas inside a-scene. I wonder if its possible to have multiple canvas like canvas="canvas: scene1", scene2, and so on.
Here is my example code for the first scene
<a-scene canvas="canvas: scene1">
<a-assets>
<img id="abtus" src="images/about.jpg">
<img id="led" src="images/2.jpg">
<img id="crt" src="images/3.jpg">
<img id="scm" src="images/4.jpg">
<img id="dev" src="images/5.jpg">
<a-mixin id="cube" geometry="primitive: box"></a-mixin>
<a-mixin id="black" material="color: black"></a-mixin>
<a-mixin id="yellow" material="color: #EB9C27"></a-mixin>
<a-mixin id="link" geometry="primitive: plane; width: 0.8; height: 0.8">
<a-mixin id="link-selected" geometry="primitive: plane; width: 1.4; height: 1.4">
</a-mixin>
</a-assets>
<!-- camera -->
<a-entity camera no-click look-controls>
<a-entity id="cursor" position="0 0 -3"
geometry="primitive: ring; radiusOuter: 0.1;
radiusInner: 0.05;"
material="color: green; shader: flat"
cursor="maxDistance: 900; fuse: true; timeout=1500">
<a-animation begin="click" easing="ease-in" attribute="scale"
fill="backwards" from="0.1 0.1 0.1" to="1 1 1" dur="150"></a-animation>
<a-animation begin="fusing" easing="ease-in" attribute="scale"
fill="forwards" from="1 1 1" to="0.1 0.1 0.1" dur="1500"></a-animation>
</a-entity>
</a-entity>
<a-entity
geometry="primitive:sphere;radius:5000;segmentsWidth:64;segmentsHeight:64"
material="shader:flat;color:#ffffff;fog:false;src:abtus"
scale="-1 1 1"
id="photosphere">
</a-entity>
</a-scene>

Answer 1

Rather than trying to set up multiple scenes, it would be easier to just have your different rooms defined as a-entitys and display them one at a time with javascript. Then you can just have one scene for everything and have an easy way to transition with animations (say by animating opacity of the different room entities when switching)