2c:null 2d:["$","title",null,{"children":"Simulation with 3 agents : choice of maximum speed and endurance profile for each | paulinelem | Observable"}] 32:Tede,{ // 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) 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 var svg = d3.select("#graphs").append("svg") .attr("width", width + margin.left + margin.right) .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(", ") line.forEach(function(e) { if (e != "") { data_line.push({'y': parseFloat(e)}) } }) data.push(data_line) } return data } function draw_line(dataset){ svg.append("path") .datum(dataset) // 10. Binds data to the line .attr("class", "line") // Assign a class for styling .attr("d", line); // 11. Calls the line generator // 12. Appends a circle for each datapoint svg.selectAll(".dot") .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", 5) .on("mouseover", function(a, b, c) { console.log(a) this.attr('class', 'focus') }) .on("mouseout", function() { }) } var data = get_data() console.log(data) data.forEach(function(e) { console.log(e) draw_line(e) }) } // 9. Append the path, bind the data, and call the line generator 34:T746, function endurance(historic, cat_endurance) { // définition des listes de paramètres d'incrémentation/décrémentation de l'endurance en fonction des caractéristiques du joueur // [marche, jogging, intensité modérée, haute intensité, sprint, division facteur temps, % recharge, temps récup nécéssaire à la recharge] var non_endurant = [1, 0.8, 0.7, 0.5, 0.3, 40, 0.1, 30]; var moy_endurant = [1, 0.9, 0.8, 0.7, 0.6, 50, 0.2, 25]; var tres_endurant = [1, 1, 0.95, 0.9, 0.8, 80, 0.3, 20]; var endurance_tot = [non_endurant, moy_endurant, tres_endurant]; let endurance = 1 console.log('categorie', cat_endurance) console.log('cat endurance', endurance_tot[cat_endurance]) let t_prec = 0 historic.forEach(function(elem) { var speed = elem['speed'] let facteur = 1 let fact_temps = 1 if ((elem['t1'] - t_prec) > 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)); 35:T73a,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(); }36:T15ab,function* drawSituation( agents, options = { darker, showCones, voronoiClip, width, height, shape }, context, n = 10 ) { console.log('tous les agents',agents) if (n <= 1) { 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(); if (hidden) { const hiddenCanvasColor = rgbColorGenerator(); agents.forEach(a => (a.hidden = hiddenCanvasColor.next().value)); } function* draw() { console.log(n) 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, height); if (performance.now() - time > 50) { // same on the hidden canvas if (hidden) { i = 0; for (var p of agents) { hidden.save(); if (voronoiClip) { hidden.beginPath(); voronoi.renderCell(i, hidden); hidden.clip(); } hidden.globalCompositeOperation = "destination-over"; drawShape( points[2 * i], points[2 * i + 1], p.acceleration * radius(t), shape, hidden ); hidden.fillStyle = `rgb(${p.hidden.join(",")})`; // https://stackoverflow.com/questions/195262/can-i-turn-off-antialiasing-on-an-html-canvas-element hidden.fill(); hidden.restore(); i++; } } // /hidden 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[0],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); } 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(); } } console.log("Je suis la ") yield* drawSituation( new_agents, options = { darker, showCones, voronoiClip, width, height, shape }, context, n-1 )} }37: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(); } }38:T507,function drawPanel(context, agents, hidden, lookup) { if (hidden) { // context.drawImage(hidden.canvas, 0, 0); const data = hidden.getImageData( 0, 0, hidden.canvas.width, hidden.canvas.height ).data; let unknown = 0; for (var agent of agents) agent.pixels = 0; for (let i = 0; i < data.length; i += 4) { if (data[i + 3] >= 200) { const c = [data[i], data[i + 1], data[i + 2]], code = c.join(","); if (!lookup.has(code)) { const a = d3.scan( agents.map( d => Math.abs(d.hidden[0] - c[0]) + Math.abs(d.hidden[1] - c[1]) + Math.abs(d.hidden[2] - c[2]) ) ); lookup.set(code, a); } agents[lookup.get(code)].pixels++; } } context.fillStyle = "white"; context.fillRect( 0, 0, Math.sqrt(d3.max(agents, d => d.pixels)) + 2, 2 * (agents.length + 2) ); for (var agent of agents) { context.translate(0, 2); context.fillStyle = agent.color; context.fillRect(0, 0, Math.sqrt(agent.pixels), 2); } context.fillStyle = "black"; context.translate(0, 2); context.fillRect(0, 0, Math.sqrt(unknown), 2); } }39: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) }; }3b:T46e,{ const context = DOM.context2d(width, height, 1); const points = []; for (let r = 0; r < 100; r++) { const data = context.getImageData(0, 0, width, height); const A = {}; for (const c of agents) { plotCircleAA( Math.round(c.position[0]), Math.round(c.position[1]), r, (x, y, v = 255) => { const i = x + width * y; if (data.data[4 * i + 3] < 128) { const id = `${x}/${y}`; A[id] = (A[id] || 0) + v / 255; } } ); } for (const b in A) { if (A[b] > 1) { const p = b.split("/").map(Number); points.push(p); } } context.fillStyle = "white"; for (const c of agents) { context.beginPath(); context.arc(...c.position, r, 0, tau); context.fill(); } context.fillStyle = "red"; for (const c of agents) { context.beginPath(); context.arc(...c.position, 1, 0, tau); context.fill(); } context.fillStyle = "black"; for (const p of points) { context.fillRect(...p, 1, 1); } yield context.canvas; } }3c:T5e8,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), canvas = context.canvas, _drag = drag(agents) .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); const u = instance; for (const x of drawSituation(agents, options, context)) { if (u !== instance) break; if (options.visibility) await options.visibility(); await Promises.delay(16); } } }3d:T422,// adapted from https://observablehq.com/@d3/hello-d3-drag drag = agents => { // 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() { d3.event.subject.active = false; } return d3 .drag() .subject(dragsubject(agents)) .on("start", dragstarted) .on("drag", dragged) .on("end", dragended); }3e:[{"id":"691e70cd7e213fc69d93026d2708b6fc38a1381a617c656548519c5886a93e28d3dea400116baabce63a44dbab27c3c297408d2fad24b98409e3bd9ad9c7dc0c","href":"https://static.observableusercontent.com/files/691e70cd7e213fc69d93026d2708b6fc38a1381a617c656548519c5886a93e28d3dea400116baabce63a44dbab27c3c297408d2fad24b98409e3bd9ad9c7dc0c","name":"d3-hexbin.js","type":"application/javascript","lastModified":1582798676406.776,"size":7438}] 30:{"id":"6896dd92d98d5a16","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":"b990206bbd9bf3300f7c105545f81029f1ca058261ec705e9c2707fe68c0caa7","access_level":"public","create_time":"$D2020-02-27T10:17:56.406Z","update_time":"$D2020-02-27T10:40:16.898Z","view_time":null,"first_public_time":"$D2020-02-27T10:41:22.928Z","fork":{"id":"397fbfb05e0c10c7","slug":"endurance-simulation/3","title":"Simulation with 3 agents : choice of maximum speed and endurance profile for each","owner":{"id":"789d9ad1a281d576","login":"litchi","name":"Na Mi"}},"stars":0,"starred":false,"owner":{"type":"team","id":"2fe05e7dad5299f4","login":"paulinelem","name":"","avatar_url":"https://avatars-next.observableusercontent.com/9b47c2864b3507854ea53e6c9961ef8622a66e9752959e2f02894aeb49a36eb1","tier":"starter_2024"},"version":2714,"publish_version":2714,"role":null,"authored":false,"authors":[{"type":"individual","id":"12748f029868b0f7","login":"paulinelem","name":"","avatar_url":"https://avatars-next.observableusercontent.com/9b47c2864b3507854ea53e6c9961ef8622a66e9752959e2f02894aeb49a36eb1","tier":null}],"members":[{"type":"individual","id":"12748f029868b0f7","login":"paulinelem","name":"","avatar_url":"https://avatars-next.observableusercontent.com/9b47c2864b3507854ea53e6c9961ef8622a66e9752959e2f02894aeb49a36eb1","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":1,"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":false,"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":false,"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":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2694,"value":"html `\n\n

\n\n

<\\div>\n

<\\div>`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2699,"value":"$33","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":2711,"value":"drawGraph()","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 = null","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 inPad = false;\n // 360 degrees\n d3.range(360).forEach(function(e, i) {\n // convert to radians\n if(i<=colormax){value =0.5}\n else{value =1}\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)); \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":2073,"value":"$34","pinned":true,"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":"$35","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":"$36","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1869,"value":"$37","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":1653,"value":"$38","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1579,"value":"$39","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":1356,"value":"$3a","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":1125,"value":"$3b","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) {\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 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 }\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 }\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":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"}],"files":"$W3e","stdlib":"1","titling":"auto"}} 31:"$30:body"