2c:null 2d:["$","title",null,{"children":"Simulation with 3 agents : choice of maximum speed and endurance profile for each | Guillaume Le Gall | Observable"}] 32:Teb5,function initagents(){ // Tirage d'un nombre aléatoire entre deux bornes min et max function randomNumber(min, max){ return Math.random()*(max-min) + min} // Tirage d'une variable suivant une loi normale function randomGauss(moyenne, ecartType){ let u = Math.random(), v = Math.random(); let num = Math.sqrt( -2.0 * Math.log( u ) ) * Math.cos( 2.0 * Math.PI * v ); //u et v les deux valeurs aléatoires initiales // Décallage de la gaussienne autour des valeurs qui nous intéressent num *= ecartType; num += moyenne-ecartType; return num } // Calcule aléatoirement un historique de course function generate_histo() { let histo = [] // nombre de courses de l'historique var k = Math.trunc(Math.random()*10) console.log(k) let speed = 0 let t1 = 0 let t2 = 0 let duration = 0 let catCourse = 0 // Joueur endurant, cat_endurance = 2 for (let i=0; i value pair, the key being "y" and the value is a random number // var dataset = d3.range(n).map(function(d) { return {"y": d3.randomUniform(1)() } }) // 1. Add the SVG to the page and employ #2 d3.select("#graphs").selectAll("svg").remove(); var svg = d3.select("#graphs").append("svg") .attr("width", width+margin.right+margin.left ) .attr("height", height+margin.top+margin.bottom ) .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); // 3. Call the x axis in a group tag svg.append("g") .attr("class", "x axis") .attr("transform", "translate(0," + height + ")") .call(d3.axisBottom(xScale)); // Create an axis component with d3.axisBottom // 4. Call the y axis in a group tag svg.append("g") .attr("class", "y axis") .call(d3.axisLeft(yScale)); // Create an axis component with d3.axisLeft function get_data() { var data = [] for (let k=1; k<4; k++) { let data_line = [] line = document.getElementById("endu_"+k.toString()).innerHTML.split(", ") let color = document.getElementById("color_"+k.toString()).innerHTML line.forEach(function(e) { if (e != "") { data_line.push({'y': parseFloat(e), 'color':"red"}) } }) data.push(data_line) } return data } function draw_line(dataset){ // 12. Appends a circle for each datapoint svg.selectAll("dotPoint") .data(dataset) .enter().append("circle") // Uses the enter().append() method .attr("class", "dot") // Assign a class for styling .attr("cx", function(d, i) { return xScale(i) }) .attr("cy", function(d) { return yScale(d.y) }) .attr("r", 3) .attr("fill", function(d) { return d.color }) .on("mouseover", function(a, b, c) { console.log(a) this.attr('class', 'focus') }) .on("mouseout", function() { }) svg.append("path") .datum(dataset) // 10. Binds data to the line .attr("class", "line") // Assign a class for styling .style("stroke", function(d,i) { return d[i].color }) .attr("d", d3.line() .x(function(d, i) { return xScale(i); }) // set the x values for the line generator .y(function(d) { return yScale(d.y); })) // set the y values for the line generator //.style("fill", function(d) { return d.color }) ; // 11. Calls the line generator } var data = get_data() data.forEach(function(e) { draw_line(e) }) } // 9. Append the path, bind the data, and call the line generator 35:T7ad,function trajectory1 (pos,vit,point, vmax=12){ var x=[pos[0]] var u=[vit[0]] var c=point[0] var y=[pos[1]] var v=[vit[1]] var d=point[1] var dt=0.01 var F=dt*30 var epsilon=0.1 if (u[0]!=0){ var angle=Math.atan((v[0])/(u[0])) } else{ var angle=Math.pi/2 } var vmaxx=Math.abs(Math.cos(angle)*vmax) var vmaxy=Math.abs(Math.sin(angle)*vmax) for (var i=0;i<=1000;i++){ if((c-x[i])!=0){ angle=Math.atan((d-y[i])/(c-x[i])) } else{ angle=Math.pi/2 } if (vmaxx>Math.abs(Math.cos(angle)*vmax)){ if (vmaxx-F>=0){ vmaxx=vmaxx-F } else{ vmaxx=0 }} else{ vmaxx=Math.min(vmaxx+F,Math.abs(Math.cos(angle)*vmax)) } if (vmaxy>Math.abs(Math.sin(angle)*vmax)){ if (vmaxy-F>=0){ vmaxy=vmaxy-F } else{ vmaxy=0 }} else{ vmaxy=Math.min(vmaxy+F,Math.abs(Math.sin(angle)*vmax)) } var Fx=F var Fy=F var signex=1 if (c-x[i]<0){ signex=-1 } var newu= u[i]+ Fx*signex newu = Math.abs(newu)<=vmaxx ? newu : (newu>=0 ? vmaxx :-vmaxx) u.push(newu) var signey=1 if (d-y[i]<0) { signey=-1 } var newv= v[i]+ Fy*signey newv = Math.abs(newv)<=vmaxy ? newv : (newv>=0 ? vmaxy :-vmaxy) v.push(newv) var newx = x[i]+newu*dt x.push(newx) var newy = y[i]+newv*dt y.push(newy) if (Math.abs(c-newx) endurance_tot[cat_endurance][7]) { if (endurance + endurance_tot[cat_endurance][6]*endurance >1 ){ endurance = 1 } else { endurance = endurance + endurance_tot[cat_endurance][6] *endurance} } if ( speed < 5.0) { facteur = endurance_tot[cat_endurance][0] } else if ( 5< speed < 13){ facteur = endurance_tot[cat_endurance][1] } else if ( 13< speed < 16){ facteur = endurance_tot[cat_endurance][2] } else if ( 16 < speed < 19){ facteur = endurance_tot[cat_endurance][3] } else if ( 19 < speed ){ facteur = endurance_tot[cat_endurance][4] } fact_temps = (1-(elem['t2']-elem['t1'])/endurance_tot[cat_endurance][5]) endurance = fact_temps * facteur * endurance // console.log(endurance) t_prec = elem['t2'] }) return (endurance) }; // console.log(endurance(historic, vmax)); 37:T80f,// function displayField(agents) { // const hexbin = d3 // .hexbin() // .radius(hexradius) // .angle(angle) // .size([width, height]), // centers = hexbin.centers(), // owned = []; // let t = 0, // a = 10000; // do { // t += hexradius / Math.sqrt(t + 1); // for (var p of agents) { // const pos = [ // p.position[0] + t * p.speed[0], // p.position[1] + t * p.speed[1] // ]; // for (let i = 0; i < centers.length; i++) { // const c = centers[i], // r = p.acceleration * radius(t); // if (Math.hypot(c[0] - pos[0], c[1] - pos[1]) < r) { // c.color = p.color; // c.vector = [c[0] - pos[0], c[1] - pos[1]].map( // d => d * (hexradius / r) ** 1.3 // ); // owned.push(c); // centers.splice(i--, 1); // } // } // } // } while (radius(t) < width && centers.length && a-- > 0); // const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); // svg // .selectAll(".hex") // .data(owned) // .join("path") // .attr("d", d => `M${d[0]},${d[1]}${hexbin.hexagon()}`) // .style("fill", d => d.color) // .style("stroke", d => d.color); // svg // .selectAll(".vector") // .data(owned) // .join("path") // .attr( // "d", // d => // `M${d[0] - d.vector[0] / 2},${d[1] - d.vector[1] / 2} // l${d.vector[0]},${d.vector[1]}` // ) // .style("stroke", "white"); // svg // .selectAll(".speed") // .data(agents) // .join("path") // .attr( // "d", // d => // `M${d.position[0]},${d.position[1]} // l${d.speed[0] * hexradius * 10},${d.speed[1] * hexradius * 10}` // ) // .style("stroke", "white"); // svg // .selectAll(".agent") // .data(agents) // .join("circle") // .attr("cx", d => d.position[0]) // .attr("cy", d => d.position[1]) // .attr("r", 4) // .style("fill", "white"); // return svg.node(); // }38:T1345,function* drawSituation( agents, options = { darker, showCones, voronoiClip, width, height, shape }, context, n = 10 ) { if (n <= 1) { drawGraph () document.getElementById('agent0').innerHTML=[agents[0]['position'],agents[0]['speed'],agents[0]['vmax']]; document.getElementById('agent1').innerHTML=[agents[1]['position'],agents[1]['speed'],agents[1]['vmax']]; document.getElementById('agent2').innerHTML=[agents[2]['position'],agents[2]['speed'],agents[2]['vmax']]; console.log("J'ai fini") } else { var new_agents=[] const path = d3.geoPath().context(context); let { darker, showCones, showBoundaries, voronoiClip, width, height, shape, panel } = options; darker = darker || 0; const delaunay = d3.Delaunay.from(agents), points = delaunay.points, voronoi = delaunay.voronoi([0, 0, width, height]); let t = 0, d, time = performance.now(), t_cone = 0, instance = Math.random(); // hidden canvas to note who is winning const hidden = options.panel ? DOM.context2d(width, height, 0.25) : null; const lookup = new Map(); function* draw() { const me = instance; var t_fin = 0 var pos_fin = [] do { const show_cone = showCones && t > t_cone + 3 && (t = t_cone + 3); t += 1 / Math.sqrt(t + 1); t_fin = t let i = 0; for (var p of agents) { points[i++] = p.position[0] + t * p.speed[0]; points[i++] = p.position[1] + t * p.speed[1]; } if (voronoiClip) voronoi.update(); i = 0; if (d) context.putImageData(d, 0, 0); for (var p of agents) { context.save(); context.globalAlpha = globalAlpha; context.globalCompositeOperation = "destination-over"; // drawShape( // points[2 * i], // points[2 * i + 1], // p.acceleration * radius(t), // shape, // context // ); const u = d3.hsl(p.color); context.fillStyle = u.copy({ l: u.l / (1 + t * darker) }); // .copy({ l: …} ) ?? context.fill(); context.restore(); i++; } d = context.getImageData(0, 0, width/2, height/2); if (performance.now() - time > 50) { // same on the hidden canvas time = performance.now(); drawLayer(hidden, lookup); yield context.canvas; } } while ( me == instance && t < 20 && d.data.some((d, i) => i % 4 === 3 && !d) ) ; new_agents = [] var j = 1; for (var p of agents) { var speed = Math.sqrt(Math.pow(p.speed[0],2)+Math.pow(p.speed[1],2)); var taille = p.histo.length var t1 = p.histo[taille-1].t2+10 ; var t2 = t1+t_fin; var cat_endurance = p.cat_endurance; let new_histo = p.histo; new_histo.push({'speed':speed, 't1':t1, 't2':t2}); var new_ag = { 'position':[p.position[0] + t_fin * p.speed[0], p.position[1] + t_fin * p.speed[1]], 'vmax': p.vmax, 'color': p.color, 'acceleration':p.acceleration, 'histo': new_histo, 'speed': speed_agent(p.vmax, endurance(new_histo, cat_endurance)), 'cat_endurance': cat_endurance, 'colorjauge':color_jauge(endurance(new_histo, cat_endurance)*360), 'hidden':p.hidden, 'pixels':p.pixels } document.getElementById("endu_"+j.toString()).innerHTML = document.getElementById("endu_"+j.toString()).innerHTML + ", " + endurance(new_histo, cat_endurance).toString(); new_agents.push(new_ag); j+=1; } } yield* draw() yield context.canvas; function drawLayer(hidden, lookup) { // all we paint here is forgotten for (var p of agents) { drawPoint(context, p, 5); } if(n==10){ for (var p of agents){ function enduranceProfile(p) { if (p.cat_endurance == 0){return 'Low'} else if (p.cat_endurance == 1){return 'Middle'} else {return 'Important'} } context.font = 'normal 12pt Calibri'; context.fillStyle = 'black'; context.fillText('Max speed :' + p.vmax, p.position[0]+10 , p.position[1] + 10); context.font = 'normal 12pt Calibri'; context.fillStyle = 'black'; context.fillText('Endurance Profile :' + enduranceProfile(p), p.position[0]+10 , p.position[1] + 30); } } if (options.panel) { context.save(); context.translate(0, 0); //drawPanel(context, agents, hidden, lookup); context.restore(); } } yield* drawSituation( new_agents, options = { darker, showCones, voronoiClip, width, height, shape }, context, n-1 )} }39:T5ad,function drawPoint(context, p, size) { const end = [ p.position[0] + 20 * p.speed[0], p.position[1] + 20 * p.speed[1] ]; context.strokeStyle = "black"; context.beginPath(); context.moveTo(...p.position); context.lineTo(...end); context.lineWidth = size > 5 ? 2 : 0.5; context.stroke(); context.closePath(); context.restore(); context.beginPath(); context.arc(...p.position, size, 0, tau); context.fillStyle = p.color; context.fill(); context.lineWidth = size > 5 ? 3 : 2; context.stroke(); context.closePath(); context.restore(); context.beginPath(); context.arc(...end, size / 2, 0, tau); context.fillStyle = p.color; context.fill(); context.lineWidth = size > 5 ? 2 : 1; context.stroke(); context.closePath(); context.restore(); // Dessin de chaque 'arc de cercle' (on dessine en fait des triangles) suivant le vecteur couleur de l'endurance de l'agent . let r = 15; for (var i = 0; i < 360; i++) { context.beginPath(); context.moveTo(p.position[0] +20, p.position[1]-20); context.lineTo(p.position[0] +20 + Math.cos(i*Math.PI/180)*r, p.position[1]-20 -Math.sin(i*Math.PI/180)*r); context.lineTo(p.position[0]+20 +Math.cos((i+1)*Math.PI/180)*r, p.position[1]-20 -Math.sin((i+1)*Math.PI/180)*r); context.fillStyle = p.colorjauge[i]; context.fill(); context.lineWidth = size > 5 ? 2 : 1; context.closePath(); context.restore(); } }3a:T4cb,// function drawShape(x, y, r, distance, distanceMax, pos, shape, context) { function drawShape(x, y, r, shape, context) { //this function now takes into account the distance and the distanceMax of an agent // if (distance d.position[0], d => d.position[1] ), points = delaunay.points, voronoi = delaunay.voronoi([0, 0, width, height]); let step = 0.01; for (let t = 1; t < tmax; t += step) { const r = radius(t); for (let i = 0; i < agents.length; i++) { points[2 * i] = agents[i].position[0] + agents[i].speed[0] * t; points[2 * i + 1] = agents[i].position[1] + agents[i].speed[1] * t; } delaunay.update(); let max = Infinity; for (let i = 0; i < agents.length; i++) { for (const j of delaunay.neighbors(i)) { if (j < i) { const vector = [ points[2 * j] - points[2 * i], points[2 * j + 1] - points[2 * i + 1] ], dist = Math.hypot(...vector) / 2, mid = [ (points[2 * i] + points[2 * j]) / 2, (points[2 * i + 1] + points[2 * j + 1]) / 2 ]; const diff = r * r - dist * dist; max = Math.min(max, Math.abs(diff)); if (diff >= 0) { const id = `${i}-${j}`; if (!A.get(id)) { const str = []; A.set(id, str); } const str = A.get(id); const side = Math.sqrt(diff), normal = [vector[1] / dist / 2, -vector[0] / dist / 2]; for (const even of [-1, 1]) { const pt = [ mid[0] + even * normal[0] * side, mid[1] + even * normal[1] * side ]; const f = delaunay.find(...pt, i); if (f == i || f == j) { if (even < 0) str.push(pt); else str.unshift(pt); } } } } } } // adaptive step for t step = Math.max(1, Math.sqrt(max)) / 100; if (performance.now() - time > 10000) break; } const boundaries = []; for (const [id, m] of A) { let start = true, p0 = m[0], curr; for (let i = 0; i < m.length; i++) { const p = m[i]; if (Math.hypot(p[0] - p0[0], p[1] - p0[1]) > 25) { if (!start) { boundaries.push({ type: "Feature", properties: id, geometry: { type: "LineString" , coordinates: curr } }); start = true; } } if (start) { curr = []; start = false; } curr.push(p); p0 = p; } boundaries.push({ type: "Feature", properties: id, geometry: { type: "LineString", coordinates: curr } }); } return { type: "FeatureCollection", features: boundaries.filter(d => d && d.geometry.coordinates) }; }3c:T6c0,async function displayInteractive(agents, options = {}) { let instance = Math.random(), im; if (options.visibility) await options.visibility(); if (!options.shape) options.shape = shape; const w = (options.width = options.width || width), h = (options.height = options.height || height); const context = DOM.context2d(w, h); //const context=canvas2 const canvas = context.canvas, _drag = drag(agents, context) .on("start.render", () => { instance = Math.random(); im = context.getImageData( 0, 0, context.canvas.width, context.canvas.height ); }) .on("drag.render", () => { context.putImageData(im, 0, 0); for (const p of agents.filter(p => p.active)) { drawPoint(context, p, 9); } }) .on("end.render", go); const _dragsubject = dragsubject(agents); d3.select(canvas) .call(_drag) .style("cursor", "pointer") .on("mousemove", () => { const m = d3.mouse(canvas), subject = _dragsubject({ x: m[0], y: m[1] }); d3.select(canvas).style( "cursor", !subject ? "default" : subject.thing == "dot" ? "pointer" : "crosshair" ); }); go(); return canvas; async function go() { context.clearRect(0, 0, w, h); document.getElementById('isball').innerHTML="0" const u = instance; for(let j=1;j<4;j++){ document.getElementById('endu_'+j.toString()).innerHTML="" } for (const x of drawSituation(agents, options, context)) { if (u !== instance) break; if (options.visibility) await options.visibility(); await Promises.delay(16); } } }3d:T487,// adapted from https://observablehq.com/@d3/hello-d3-drag function drag (agents, context){ // When starting a drag gesture, move the subject to the top and mark it as active. function dragstarted() { agents.splice(agents.indexOf(d3.event.subject), 1); agents.push(d3.event.subject); d3.event.subject.active = true; } // When dragging, update the subject’s position. function dragged() { const agent = d3.event.subject; if (agent.thing === "dot") { agent.position[0] = Math.max(0, Math.min(width, d3.event.x)); agent.position[1] = Math.max(0, Math.min(height, d3.event.y)); } if (agent.thing === "speed") { agent.speed[0] = (d3.event.x - agent.position[0]) / 20; agent.speed[1] = (d3.event.y - agent.position[1]) / 20; } } // When ending a drag gesture, mark the subject as inactive again. function dragended() { const agent = d3.event.subject; console.log("Idragged") d3.event.subject.active = false; } return d3 .drag() .subject(dragsubject(agents, context)) .on("start", dragstarted) .on("drag", dragged) .on("end", dragended); }3e:Tf23,function place_ball(x, y, context, agents) { // const svg = d3.create("svg").attr("viewBox", [0, 0, 500, 500]); // console.log(x,y); if (context) { console.log('tt') // d3.select(context).append("circle") // .attr("cx", 30) // .attr("cy", 30) // .attr("r", 20); var isball=document.getElementById('isball').innerHTML if(isball=="0"){ var agent0=document.getElementById('agent0').innerHTML agent0=agent0.split(",") var agent1=document.getElementById('agent1').innerHTML agent1=agent1.split(",") var agent2=document.getElementById('agent2').innerHTML agent2=agent2.split(",") var agents2=[agent0,agent1, agent2] context.beginPath(); context.arc(x, y, 10, 0, 2 * Math.PI, false); context.fillStyle = 'green'; context.fill(); context.lineWidth = 2; context.strokeStyle = '#003300'; context.stroke(); context.closePath(); var maxx=0 var maxy=0 for(var i = 0; i < agents2.length; i++) { var p=agents2[i] var pos=[20*parseFloat(p[0])/context.canvas.width,10*parseFloat(p[1])/context.canvas.height] var speed=[parseFloat(p[2])/3.6,parseFloat(p[3])/3.6] var ball =[x*20/context.canvas.width,y*10/context.canvas.height] var result = trajectory1(pos, speed, ball,parseFloat(p[4])/4) var position=[] var distance=[] var maxylocal=0 result[0].forEach(function(e,i){ position.push([context.canvas.width*(e)/20,context.canvas.height*(result[1][i])/10]) //position.push([e,result[1][i]]) var dist=Math.sqrt((e-ball[0])**2+(result[1][i]-ball[1])**2) maxylocal=Math.max(dist, maxylocal) }) var maxxxlocal=position.length maxx=Math.max(maxx,maxxxlocal) maxy=Math.max(maxy,maxylocal) context.save(); context.beginPath(); context.moveTo(position[0][0],position[0][1]); position.forEach(function(e,i){ context.lineTo(position[i][0],position[i][1]); }) context.lineWidth = 2; context.strokeStyle = "black"; context.stroke(); context.closePath() context.restore(); context.save(); context.beginPath(); context.moveTo(p[0],p[1]); context.lineTo(p[0]+p[2]*20,p[1]+p[3]*20); context.lineWidth = 2; context.strokeStyle = "red"; context.stroke(); context.closePath() context.restore(); } var elements=initsvg(context, maxx, maxy); var line = d3.line() .curve(d3.curveMonotoneX) .x(function(d,i){return elements[1](i)}) .y(function(d,i){return elements[2](d);}) for(var i = 0; i < agents2.length; i++) { var p=agents2[i] var pos=[20*parseFloat(p[0])/context.canvas.width,10*parseFloat(p[1])/context.canvas.height] var speed=[parseFloat(p[2])/3.6,parseFloat(p[3])/3.6] var ball =[x*20/context.canvas.width,y*10/context.canvas.height] var result = trajectory1(pos, speed, ball,parseFloat(p[4])/4) var distance=[] result[0].forEach(function(e,i){ //position.push([e,result[1][i]]) var dist=Math.sqrt((e-ball[0])**2+(result[1][i]-ball[1])**2) distance.push(dist) }) var lines = elements[0].append("g").selectAll("path").data([distance]).enter() .append("path") .attr("d", line) .attr("fill", "none") .attr("stroke", "black") } document.getElementById('isball').innerHTML="1" } } }3f:[{"id":"691e70cd7e213fc69d93026d2708b6fc38a1381a617c656548519c5886a93e28d3dea400116baabce63a44dbab27c3c297408d2fad24b98409e3bd9ad9c7dc0c","href":"https://static.observableusercontent.com/files/691e70cd7e213fc69d93026d2708b6fc38a1381a617c656548519c5886a93e28d3dea400116baabce63a44dbab27c3c297408d2fad24b98409e3bd9ad9c7dc0c","name":"d3-hexbin.js","type":"application/javascript","lastModified":1584005362913.727,"size":7438}] 30:{"id":"ca005fc70719495c","slug":"simulation-with-3-agents-choice-of-maximum-speed-and-endura","title":"Simulation with 3 agents : choice of maximum speed and endurance profile for each","thumbnail":"47aa03b9d65ad6e9c112fbc509d7cb8aed2d890f1f62df0672f2f418616b9fb4","access_level":"public","create_time":"$D2020-03-12T09:29:22.913Z","update_time":"$D2020-03-21T08:21:40.280Z","view_time":null,"first_public_time":"$D2020-03-12T09:35:15.313Z","fork":{"id":"54f036bc53393ed7","slug":"simulation-with-3-agents-choice-of-maximum-speed-and-endura/2","title":"Simulation with 3 agents : choice of maximum speed and endurance profile for each","owner":{"id":"2fe05e7dad5299f4","login":"paulinelem","name":""}},"stars":0,"starred":false,"owner":{"type":"team","id":"ded7a4035e65b118","login":"guillaumelegall","name":"Guillaume Le Gall","avatar_url":"https://avatars-next.observableusercontent.com/692055ffcd9b279c4ad0edf89bca091e1c583182887d349e68f72bb943a31c40","tier":"starter_2024"},"version":2989,"publish_version":2989,"role":null,"authored":false,"authors":[{"type":"individual","id":"025b728c49863189","login":"guillaumelegall","name":"Guillaume Le Gall","avatar_url":"https://avatars-next.observableusercontent.com/692055ffcd9b279c4ad0edf89bca091e1c583182887d349e68f72bb943a31c40","tier":null}],"members":[{"type":"individual","id":"025b728c49863189","login":"guillaumelegall","name":"Guillaume Le Gall","avatar_url":"https://avatars-next.observableusercontent.com/692055ffcd9b279c4ad0edf89bca091e1c583182887d349e68f72bb943a31c40","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Simulation with 3 agents : choice of maximum speed and endurance profile for each","cells":[{"id":2376,"value":"md`# Simulation with 3 agents : choice of maximum speed and endurance profile for each\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2556,"value":"md`## Choose parameters for the 1st agent`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2527,"value":"viewof enduranceType1 = select({\n title: \"1st Agent : Endurance Profile\",\n description: \"Choose the endurance profile of the 1st agent\",\n options: [\n {label : \"Important\", value:2},\n {label:\"Middle\", value:1},\n {label: \"Low\", value:0}],\n value: \"Moyennement endurant\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2499,"value":"viewof vmax1 = slider({\n title: \"1st agent : Maximum speed\",\n min: 0,\n value: 25,\n max: 40,\n step: 0.00001,\n description: \"Choose the maximum speed of the 1st agent\"\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2558,"value":"md`## Choose parameters for the 2nd agent`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2560,"value":"viewof enduranceType2 = select({\n title: \"2nd Agent : Endurance Profile\",\n description: \"Choose the endurance profile of the 2nd agent\",\n options: [\n {label : \"Important\", value:2},\n {label:\"Middle\", value:1},\n {label: \"Low\", value:0}],\n value: \"Moyennement endurant\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2563,"value":"viewof vmax2 = slider({\n title: \"2nd agent : Maximum speed\",\n min: 0,\n value: 25,\n max: 40,\n step: 0.00001,\n description: \"Choose the maximum speed of the 2nd agent\"\n})\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2566,"value":"md`## Choose parameters for the 3rd agent`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2568,"value":"viewof enduranceType3 = select({\n title: \"3rd Agent : Endurance Profile\",\n description: \"Choose the endurance profile of the 3rd agent\",\n options: [\n {label : \"Important\", value:2},\n {label:\"Middle\", value:1},\n {label: \"Low\", value:0}],\n value: \"Moyennement endurant\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2570,"value":"viewof vmax3 = slider({\n title: \"3rd agent : Maximum speed\",\n min: 0,\n value: 25,\n max: 40,\n step: 0.00001,\n description: \"Choose the maximum speed of the 3rd agent\"\n})\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2678,"value":"md`## Visualisation`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2475,"value":"{\n\n \n var agents2=initagents();\n console.log(agents2)\nyield displayInteractive(agents2, {\n showBoundaries: true,\n visibility\n });\n}\n// the accessible zone is the intersection of the dark and clear zone\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2810,"value":"html`

play

\n\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2788,"value":"html `\n\n\n

`\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2971,"value":"viewof toto = slider({\n min: 200, \n max: 1000, \n step: 1, \n value: 600, \n title: \"Plot height\",\n id:'test'\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2898,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2812,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2699,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2494,"value":"viewof globalAlpha = select({\n options: [1, 0.3, 0.1, 0.01],\n description: \"Global alpha\"\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":82,"value":"viewof s = slider({\n min: 0,\n value: 5,\n max: 10,\n step: 0.00001,\n description: \"acceleration/speed ratio\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":140,"value":"viewof darker = slider({\n min: 0,\n value: 0.02,\n max: 0.1,\n description: \"darker with time?\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1575,"value":"viewof shape = select({\n options: [\"circle\", \"square\", \"manhattan\"],\n description: \"Isolines shape\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":197,"value":"viewof options = checkbox([\"Show cones\", \"Clip Voronoi\"])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":394,"value":"showCones = options && options.indexOf(\"Show cones\") > -1","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":396,"value":"voronoiClip = options && options.indexOf(\"Clip Voronoi\") > -1","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":369,"value":"radius = d3\n .scalePow()\n .exponent(2)\n .domain([0, 10])\n .range([0, s])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1543,"value":"mutable debug = true","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2298,"value":"// Renvoie le vecteur vitesse de l'agent qui sera utilisé pour la fonction principale displayInteractive. \nfunction speed_agent(vmax, endu){ \n var speed = Math.random()*endu*vmax ;// = x2+y2\n var speed_x = Math.random()*speed*speed;\n var speed_y = speed * speed - speed_x;\n var signe_x = Math.random()\n var signe_y = Math.random()\n if (signe_x>0.5){\n signe_x = -1}\n else {\n signe_x=1}\n if (signe_y>0.5){\n signe_y = -1}\n else {\n signe_y = 1}\n return [signe_x*Math.sqrt(speed_x)/2, signe_y*Math.sqrt(speed_y)/2]\n};","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2301,"value":"// renvoie le vecteur de couleurs de la jauge de l'agent\n function color_jauge(colormax) {\n var colors = [],\n slice = 0,\n value =0,\n value2=1,\n inPad = false;\n // 360 degrees\n d3.range(360).forEach(function(e, i) {\n // convert to radians\n if(i<=colormax){value =0.5; value2=1}\n else{value =1; value2=0}\n var start = i * (Math.PI / 180),\n end = (i + 1) * (Math.PI / 180);\n colors.push(d3.hsl(Math.floor(i/3), 1, value,value2)); \t\n \n });\n return(colors)\n };","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2077,"value":"md` Fonction qui calcule l'endurance à partir d'un historique donné `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2818,"value":"$35","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2073,"value":"$36","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2290,"value":"function histo_agents(agents) {\n agents.forEach(function(agent) {\n // console.log('Agent', endurance(agent.historic))\n } )\n };","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":301,"value":"md`Un agent avance à fond vers un statique.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":325,"value":"md`Un agent avance vers un mur.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":443,"value":"md`### Relative acceleration\n\nIf an agent can accelerate more than another, it can “encircle” it after a while. (Note: in this model, we can’t use the Voronoi clipping any more).`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":438,"value":"viewof acceleration = slider({\n min: 0.9,\n max: 3,\n value: 1,\n description: \"Relative acceleration\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":450,"value":"viewof acceleration2 = slider({\n min: 0.9,\n max: 3,\n value: 1.25,\n description: \"Relative acceleration\"\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":967,"value":"md`## Vector field`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1097,"value":"agentsDir = Array.from({ length: 15 }, (d, i) => ({\n position: [width * Math.random(), height * Math.random()],\n speed: [Math.random() - Math.random(), Math.random() - Math.random()],\n color: d3.hsl(Math.random() * 360, 0.6 + 0.2 * Math.random(), 0.6),\n acceleration: 1 // in this model all have the same acceleration capacity ** power diagram\n}))\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1090,"value":"hexradius = 10","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1094,"value":"viewof angle = slider({ min: -90, max: 90, description: \"Angle\" })","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":994,"value":"$37","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":834,"value":"md`## Draw`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":205,"value":"$38","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1869,"value":"$39","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1716,"value":"// import {rgbColorGenerator} from \"@camargo/canvas-picking-with-a-hidden-canvas\"\nfunction* rgbColorGenerator() {\n let nextColor = 1;\n const nextColorStep = 50;\n\n while (nextColor < 16777216) {\n nextColor += nextColorStep;\n yield [\n nextColor & 0xff,\n (nextColor & 0xff00) >> 8,\n (nextColor & 0xff0000) >> 16\n ];\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1579,"value":"$3a","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1356,"value":"$3b","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1121,"value":"import {plotCircle, plotCircleAA} from \"81fd2058ee21afc3\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":541,"value":"md`## Drag`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":296,"value":"$3c","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1804,"value":"// Choose the circle that is closest to the pointer for dragging.\nfunction dragsubject(agents, context) {\n \n const radius = 30;\n\n return function(event) {\n if (!event) event = d3.event;\n let subject = null;\n let distance = radius * 1.5;\n \n let ballon = true;\n for (const c of agents) {\n // grab the dot?\n let d = Math.hypot(event.x - c.position[0], event.y - c.position[1]);\n if (d < distance) {\n distance = d;\n subject = c;\n subject.thing = \"dot\";\n ballon = false\n }\n // grab the speed?\n d = Math.hypot(\n event.x - (c.position[0] + 20 * c.speed[0]),\n event.y - (c.position[1] + 20 * c.speed[1])\n );\n if (d < 5) {\n distance = d;\n subject = c;\n subject.thing = \"speed\";\n ballon = false\n }\n\n }\n if (ballon) {\n place_ball(d3.event.x, d3.event.y, context, agents)\n }\n return subject;\n };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":461,"value":"$3d","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2821,"value":"$3e","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":535,"value":"md`## Annex`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2,"value":"// agents = Array.from({ length: 500 }, (d, i) => ({\n// position: [width * Math.random(), height * Math.random()],\n// speed: [Math.random() - Math.random(), Math.random() - Math.random()],\n// color: color(i),\n// acceleration: 1, // in this model all have the same acceleration capacity, \n// distance:0, \n// distanceMax:20\n// }))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":930,"value":"color = i => {\n const u = i / 2.618033988749895,\n v = u - Math.floor(u);\n return d3.hsl(v * 360, 0.6 + 0.2 * Math.random(), 0.6); // d3.interpolateSpectral(v)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":6,"value":"height = 600","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":10,"value":"d3 = require(\"d3@5\", \"d3-delaunay@5\", \"d3-color@1.3\", await FileAttachment(\n \"d3-hexbin.js\"\n).url())","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":27,"value":"tau = 2 * Math.PI","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":147,"value":"import {checkbox, slider, select} from \"@jashkenas/inputs\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2823,"value":"html `

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W3f","stdlib":"1","titling":"auto"}} 31:"$30:body"