File size: 5,847 Bytes
ad7bc89
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
async () => {

    globalThis.init_camera_dict = {
        "scene.camera": {
            "up": {"x": -0.13227683305740356,
                    "y": -0.9911391735076904,
                    "z": -0.013464212417602539},
            "center": {"x": -0.005292057991027832,
                        "y": 0.020704858005046844,
                        "z": 0.0873757004737854},
            "eye": {"x": 0.8585731983184814, 
                    "y": -0.08790968358516693, 
                    "z": -0.40458938479423523},
        },
        "scene.aspectratio": {"x": 1.974, "y": 1.974, "z": 1.974},
        "scene.aspectmode": "manual"
    };

    // globalThis.restrictCamera = (data) => {
    //     var plotlyDiv = document.getElementById("map").getElementsByClassName('js-plotly-plot')[0];
    //     // var curr_eye = plotlyDiv.layout.scene.camera.eye;
    //     // var curr_center = plotlyDiv.layout.scene.camera.center;
    //     // var curr_up = plotlyDiv.layout.scene.camera.up;

    //     var curr_eye = data["scene.camera"]["eye"];
    //     var curr_center = data["scene.camera"]["center"];
    //     var curr_up = data["scene.camera"]["up"];
        
    //     var D = Math.sqrt((curr_eye.x - curr_center.x)**2 + (curr_eye.y - curr_center.y)**2 + (curr_eye.z - curr_center.z)**2);
    //     console.log("D", D);

    //     const max_D = 1.47;
    //     const min_D = 0.8;

    //     // calculate elevation
    //     var elevation = Math.atan2(curr_eye.y - curr_center.y, Math.sqrt((curr_eye.x - curr_center.x)**2 + (curr_eye.z - curr_center.z)**2)) * 180 / Math.PI;
    //     console.log("elevation", elevation);
    //     const max_elev = 3.2;
    //     const min_elev = -30;

    //     const eps = 0.01;

    //     if (D > max_D) {
    //         // find new_eye such that D = max_D
    //         var new_dict = {
    //             "scene.camera": {
    //                 "eye": {
    //                     "x": curr_center.x + (curr_eye.x - curr_center.x) * max_D / D - eps,
    //                     "y": curr_center.y + (curr_eye.y - curr_center.y) * max_D / D - eps,
    //                     "z": curr_center.z + (curr_eye.z - curr_center.z) * max_D / D - eps,
    //                 },
    //                 "up": curr_up,
    //                 "center": curr_center,
    //             }
    //         };
            
    //         Plotly.relayout(plotlyDiv, new_dict);

    //     } else if (D < min_D) {
    //         // find new_eye such that D = min_D
    //         var new_dict = {
    //             "scene.camera": {
    //                 "eye": {
    //                     "x": curr_center.x + (curr_eye.x - curr_center.x) * min_D / D - eps,
    //                     "y": curr_center.y + (curr_eye.y - curr_center.y) * min_D / D - eps,
    //                     "z": curr_center.z + (curr_eye.z - curr_center.z) * min_D / D - eps,
    //                 },
    //                 "up": curr_up,
    //                 "center": curr_center,
    //             }
    //         };
        
    //         Plotly.relayout(plotlyDiv, new_dict);
    //     }

    //     const eta = 0.001;
        // if (elevation > max_elev) {
        //     // find new eye such that y elevation = max_elev
        //     var new_dict = {
        //         "scene.camera": {
        //             "eye": {
        //                 "x": curr_eye.x,
        //                 "y": curr_center.y + (curr_eye.y - curr_center.y) * Math.tan((max_elev - eta)  * Math.PI / 180),
        //                 "z": curr_eye.z,
        //             },
        //             "up": curr_up,
        //             "center": curr_center,
        //         }
        //     };
          

        //     Plotly.relayout(plotlyDiv, new_dict);

        // } else if (elevation < min_elev) {
        //     // find new eye such that y elevation = min_elev
        //     var new_dict = {
        //         "scene.camera": {
        //             "eye": {
        //                 "x": curr_eye.x,
        //                 "y": curr_center.y + (curr_eye.y - curr_center.y) * Math.tan((min_elev + eta)  * Math.PI / 180),
        //                 "z": curr_eye.z,
        //             },
        //             "up": curr_up,
        //             "center": curr_center,
        //         }
        //     };
            
        //     Plotly.relayout(plotlyDiv, new_dict);
        // }

    // }

     globalThis.latestCam = () => {
        var plotlyDiv = document.getElementById("map").getElementsByClassName('js-plotly-plot')[0];

        globalThis.prev_camera_dict = {};
        console.log("prev camera dict", globalThis.prev_camera_dict);

        // Listen for the event and log to the console
        plotlyDiv.on('plotly_relayout', function(data) {
            console.log('plotly_relayout event triggered:', data);
            
            if ("scene.camera.up" in data) {
                Object.assign(globalThis.prev_camera_dict, globalThis.camera_dict);
                Object.assign(globalThis.camera_dict, globalThis.init_camera_dict);
            }

            if ('scene.camera' in data) {
                Object.assign(globalThis.prev_camera_dict, globalThis.camera_dict);
                globalThis.camera_dict = data;
            }

            var camera_json = JSON.stringify(globalThis.camera_dict);
            var input_pose = document.getElementById("input_pose").getElementsByTagName("textarea")[0];
            let myEvent = new Event("input")
            input_pose.value = camera_json;
            input_pose.dispatchEvent(myEvent);

            var update_pose_btn = document.getElementById("update_pose_button");
            update_pose_btn.dispatchEvent(new Event("click"));
            // globalThis.restrictCamera(data);
        });
    }
    
    return latestCam(this);

}