-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathppo-threejs-cnn-hungry2dshoot-js.html
95 lines (80 loc) · 3.52 KB
/
ppo-threejs-cnn-hungry2dshoot-js.html
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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>RLlib.js examples</title>
<link rel="stylesheet" type="text/css" href="src/css/styles.css" />
<link rel="stylesheet" type="text/css" href="src/css/MovingButtons.css" />
<script src='https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/tensorflow/3.8.0/tf.min.js'></script>
<script src='https://cdn.jsdelivr.net/npm/@tensorflow/[email protected]/dist/tfjs-vis.umd.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js'></script>
<script src='src/js/threejs/stats.min.js'></script>
<script src='src/js/threejs/OrbitControls.js'></script>
<script src='src/js/threejs/ColladaLoader.js'></script>
<script src='src/js/threejs/DeviceOrientationControls.js'></script>
<script src='src/js/controls.js'></script>
<script src='src/js/neuralnetworks.js'></script>
<script src='src/js/types.js'></script>
<script src='src/js/utils.js'></script>
<script src='src/js/ui/SimplePPOUI.js'></script>
<script src='src/js/envs/HungryWorld2D/HungryWorldShoot2D_image.js'></script>
</head>
<body>
<script>
tf.disableDeprecationWarnings();
let curretWorldClass = HungryWorld2D;
var PPOworker = new Worker("./src/js/agents/policy_gradients/ppo_class_worker_image.js");
let imgshape = [32,32,1];
/*Create environment*/
var w = new curretWorldClass({imgshape: imgshape});
/*Create agent object*/
var a = new HungryAgent({Scene: w.Scene, Renderer: w.Renderer, imgshape: imgshape});
/*Adding agent to the environment object*/
w.addAgent(a);
/*Create neural network*/
let cur_nn = build_cnn(imgshape, [64], a.action_space.shape[0], 'tanh', 'tanh');
/*Create neural network*/
let weights_obj = get_serialized_layers_data(cur_nn);
/*Create UI*/
let ui = new SimpleUI({parent: document.body, policy_nn: cur_nn, worker: PPOworker});
/*Message broker between Agent worker and app*/
PPOworker.onmessage = function(e){
if(e.data.msg_type === "step"){
var step_data = w.step(e.data.action);
PPOworker.postMessage({msg_type: "step", step_data: step_data, n_obs: w.n_obs, e_r: w.get_episode_reward(), e_l: w.get_episode_length()});
}
/*When user recieves neural network weights from agent worker*/
if(e.data.msg_type === "get_policy_weights_answer"){
/*create neural network from serialized weights*/
let model_p = create_model_by_serialized_data(e.data.policy_weights);
/*downloading policy weights*/
model_p.save('downloads://policy');
/*Create neural network from serialized weights*/
let model_v = create_model_by_serialized_data(e.data.value_weights);
/*downloading value function weights*/
model_v.save('downloads://value');
}
/*Answer from worker that policy weights have been set*/
if(e.data.msg_type === "loaded_policy_weigths"){
alert('Policy weights have been set');
}
/*Answer from worker that value function weights have been set*/
if(e.data.msg_type === "loaded_value_weigths"){
alert('Value weights have been set');
}
}
/*Starting training process*/
tf.setBackend("cpu").then(()=>{
PPOworker.postMessage({
msg_type: "start",
observation_space: a.observation_space,
action_space: a.action_space,
n_obs: w.n_obs,
policy_nn: weights_obj,
imgshape: imgshape
});
});
</script>
</body>
</html>