Three.jsで，グループの回転軸を新たに設定したい

前提・実現したいこと

Three.jsを使用しています．
arrowHelperで作成した，キャンバス原点から生える矢印を，指定した座標軸(x,y,z)を中心に回転させるようなものを作成しようとしています(以下の画像は作成途中のものです)．

後記のソースコードにあるとおり，arrowHelperをgroup2というグループに追加し，そのグループを回転させています(group2.rotation.●の値をいじって回転させています)．
html+cssで作成しているxボタンを押すと，xgate関数が実行されます．
xgate関数では，z軸を中心に，πだけgroup2を回転させます．
実行した結果，この関数は正常に作動しました．

発生している問題

新たにhgate関数を作成しようとしています．この関数はy＋x軸を中心にπだけgroup2を回転させるというものです．
rotationの回転軸を変更しようと，新たにThree.Vector3でy＋xに相当するようなベクトルを作成し，rotationの軸に設定しようと試みたのですが，うまくいきませんでした(実行したところ，回転が行われませんでした)．
グループの回転軸を新たに設定し直す方法があれば，ご教授ください．

該当のソースコード

該当箇所のみを抽出しています．

JavaScript
1window.addEventListener('load', init);
2
3function init() {
4
5    // シーンを作成
6    const scene = new THREE.Scene();
7
8    //カメラ，レンダラー，球，ワイヤ，光源作成は省略
9
10    const group1 = new THREE.Group(); 
11    const group2 = new THREE.Group(); 
12    scene.add(group1);
13    scene.add(group2);
14    group2.rotation.x = 0;
15    group2.rotation.y = 0;
16    group2.rotation.z = 0;
17
18    //ベクトル描画
19    const from = new THREE.Vector3(0, 0, 0);
20    const to = new THREE.Vector3(0, 1, 0);
21    const direction = to.clone().sub(from);
22    const length = 250;
23    const arrowHelper = new THREE.ArrowHelper(direction.normalize(), from, length, 0xDF013A, 25, 20);
24    group2.add(arrowHelper);
25   
26    function tick() {
27        renderer.render(scene, camera); 
28        requestAnimationFrame(tick);
29    }
30    tick();
31    
32    var flag = 0;
33
34    //xgate関数
35    document.getElementById('x').onclick = function xgate(){
36       if(flag < Math.PI){
37           group2.rotation.z += Math.PI/50;
38           flag += Math.PI/50;
39           requestAnimationFrame(xgate);
40       }else{
41           flag = 0;
42       }
43    }
44
45    //y＋xに相当するベクトルを作成
46　　 const yx = new Three.Vector3(1,1,0);
47
48    //問題のhgate関数
49    document.getElementById('h').onclick = function hgate(){
50        if(flag < Math.PI){
51            group2.rotation.yx += Math.PI/50;
52            flag += Math.PI/50;
53            requestAnimationFrame(hgate);
54        }else{
55            flag = 0;
56        }
57    }
58}