<!DOCTYPE html>
<html>
<head>
<title>我的网页</title>
</head>
<body>
<script type="module">
class Vector2 {
constructor(obj) {
this.x = obj.x;
this.y = obj.y;
}
static new(x, y) {
return new Vector2({ x, y });
}
sub(other) {
return Vector2.new(this.x - other.x, this.y - other.y);
}
static abs_sq(other) {
return other.x * other.x + other.y * other.y;
}
static normalize(other) {
let length = Math.sqrt(Vector2.abs_sq(other));
return Vector2.new(other.x / length, other.y / length);
}
}
const PI = 3.141592653589793238;
import init from './pkg/pi_orca.js';
import { RVOSimulator } from './pkg/pi_orca.js';
const temp = 200;
const num = 100;
const maxSpeed = 0.25;
const RAND_MAX = 0x7fff;
let lastpotion = [];
function setup_scenario(sim, goals, divs, obstacles_div, agents) {
sim.set_time_step(1.0);
let time = performance.now();
console.log("time: ", time);
sim.set_rng_seed(time * 1000);
sim.set_agent_defaults(15.0, 10000, 10.0, 10.0, 2.5, maxSpeed, 0.0, 0.0);
let row = 5;
let cout = 5;
let id = 0;
for (let i = 0; i < row; ++i) {
for (let j = 0; j < cout; ++j) {
let x = 55.0 + i * 10.0;
let y = 55.0 + j * 10.0;
agents.push(sim.add_agent(x, y, maxSpeed));
sim.set_agent_goal(agents[agents.length - 1], -x, -y);
divs[id] = document.createElement("div");
divs[id].id = id;
divs[id].style.left = Math.floor(x + temp) + "px";
divs[id].style.top = Math.floor(y + temp) + "px";
divs[id].style.width = "4px";
divs[id].style.height = "4px";
divs[id].style.borderRadius = "50%";
divs[id].style.backgroundColor = "rgb(255, 0, 0)";
divs[id].style.position = "absolute";
document.body.appendChild(divs[id]);
id += 1;
x = -55.0 - i * 10.0;
y = 55.0 + j * 10.0;
agents.push(sim.add_agent(x, y, maxSpeed));
sim.set_agent_goal(agents[agents.length - 1], -x, -y);
divs[id] = document.createElement("div");
divs[id].id = id;
divs[id].style.left = Math.floor(x + temp) + "px";
divs[id].style.top = Math.floor(y + temp) + "px";
divs[id].style.width = "4px";
divs[id].style.height = "4px";
divs[id].style.borderRadius = "50%";
divs[id].style.backgroundColor = "rgb(255, 0, 255)";
divs[id].style.position = "absolute";
document.body.appendChild(divs[id]);
id += 1;
x = 55.0 + i * 10.0;
y = -55.0 - j * 10.0;
agents.push(sim.add_agent(x, y, maxSpeed));
sim.set_agent_goal(agents[agents.length - 1], -x, -y);
divs[id] = document.createElement("div");
divs[id].id = id;
divs[id].style.left = Math.floor(x + temp) + "px";
divs[id].style.top = Math.floor(y + temp) + "px";
divs[id].style.width = "4px";
divs[id].style.height = "4px";
divs[id].style.borderRadius = "50%";
divs[id].style.backgroundColor = "rgb(0, 255, 255)";
divs[id].style.position = "absolute";
document.body.appendChild(divs[id]);
id += 1;
x = -55.0 - i * 10.0;
y = -55.0 - j * 10.0;
agents.push(sim.add_agent(x, y, maxSpeed));
sim.set_agent_goal(agents[agents.length - 1], -x, -y);
divs[id] = document.createElement("div");
divs[id].id = id;
divs[id].style.left = Math.floor(x + temp) + "px";
divs[id].style.top = Math.floor(y + temp) + "px";
divs[id].style.width = "4px";
divs[id].style.height = "4px";
divs[id].style.borderRadius = "50%";
divs[id].style.backgroundColor = "rgb(0, 255, 0)";
divs[id].style.position = "absolute";
document.body.appendChild(divs[id]);
id += 1;
}
}
sim.add_obstacle(new Float32Array([-10.0, 40.0, -40.0, 40.0, -40.0, 10.0, -10.0, 10.0]));
obstacles_div[0] = document.createElement("div");
obstacles_div[0].style.left = Math.floor(-40 + temp + 1) + "px";
obstacles_div[0].style.top = Math.floor(11 + temp) + "px";
obstacles_div[0].style.width = "30px";
obstacles_div[0].style.height = "30px";
obstacles_div[0].style.backgroundColor = "rgba(0, 0, 0, 0.5)";
obstacles_div[0].style.position = "absolute";
document.body.appendChild(obstacles_div[0]);
sim.add_obstacle(new Float32Array([10.0, 40.0, 10.0, 10.0, 40.0, 10.0, 40.0, 40.0]));
obstacles_div[1] = document.createElement("div");
obstacles_div[1].style.left = Math.floor(10 + temp + 1) + "px";
obstacles_div[1].style.top = Math.floor(11 + temp) + "px";
obstacles_div[1].style.width = "30px";
obstacles_div[1].style.height = "30px";
obstacles_div[1].style.backgroundColor = "rgba(0, 0, 0, 0.5)";
obstacles_div[1].style.position = "absolute";
document.body.appendChild(obstacles_div[1]);
sim.add_obstacle(new Float32Array([10.0, -40.0, 40.0, -40.0, 40.0, -10.0, 10.0, -10.0]));
obstacles_div[2] = document.createElement("div");
obstacles_div[2].style.left = Math.floor(11 + temp + 1) + "px";
obstacles_div[2].style.top = Math.floor(-41 + temp) + "px";
obstacles_div[2].style.width = "30px";
obstacles_div[2].style.height = "30px";
obstacles_div[2].style.backgroundColor = "rgba(0, 0, 0, 0.5)";
obstacles_div[2].style.position = "absolute";
document.body.appendChild(obstacles_div[2]);
sim.add_obstacle(new Float32Array([-10.0, -40.0, -10.0, -10.0, -40.0, -10.0, -40.0, -40.0]));
obstacles_div[3] = document.createElement("div");
obstacles_div[3].style.left = Math.floor(-40 + temp + 1) + "px";
obstacles_div[3].style.top = Math.floor(-41 + temp) + "px";
obstacles_div[3].style.width = "30px";
obstacles_div[3].style.height = "30px";
obstacles_div[3].style.backgroundColor = "rgba(0, 0, 0, 0.5)";
obstacles_div[3].style.position = "absolute";
document.body.appendChild(obstacles_div[3]);
}
function update_visualization(sim, divs, agents) {
console.log("{}", sim.get_global_time());
for (let i = 0; i < agents.length; i++) {
console.log("Agent: " + i + "; id: " + agents[i]);
let position = sim.get_agent_position(agents[i]);
console.log("Agent pos: ", position);
let velocity = sim.get_agent_velocity(agents[i]);
console.log("实际速度:", velocity)
let pref_velocity = sim.get_agent_pref_velocity(agents[i]);
console.log("期望速度:", pref_velocity)
let goal = sim.get_agent_goal(agents[i]);
console.log("期望目标: {:?}", goal);
let x = Math.round(position.x) + temp;
let y = Math.round(position.y) + temp;
divs[i].style.left = x + "px";
divs[i].style.top = y + "px";
}
}
function set_preferred_velocities(sim, goals, agents) {
}
function reached_goal(sim, goals, agents) {
for (let i = 0; i < agents.length; ++i) {
if (Vector2.abs_sq(goals[i].sub(sim.get_agent_position(agents[i]))) > 2) {
return false;
}
}
return true;
}
init().then(module => {
console.log(module)
let sim = RVOSimulator.default(2000); let goals = [];
let agents = [];
let divs = [];
let divs2 = [];
setup_scenario(sim, goals, divs, divs2, agents);
let global_time = 0;
let num = 0
let id = setInterval(() => {
let begin = performance.now();
update_visualization(sim, divs, agents);
sim.do_step();
global_time += performance.now() - begin;
}, 16)
});
</script>
</body>
</html>