32:T1a8b,chart = overlayPolygon((svg) => { const maxFrameNum = d3.max(frames, (d) => d.frameNum); const gEgo = svg .append("g") .attr("fill-opacity", 1) .attr("stroke-linecap", "round"); const ego = gEgo .selectAll("path.ego") .data(frames) .join("path") .attr("class", "ego") .attr("d", (d) => carPath(d.egoTranslation, d.egoRotation)) .attr("fill-opacity", 0.2) .attr("stroke", (d) => d3.interpolateViridis(d.frameNum / maxFrameNum)) .attr("fill", d3.interpolateViridis(0)); // const gCamera = svg // .append("g") // .attr("fill-opacity", 1) // .attr("stroke-linecap", "round"); // const camera = gCamera // .selectAll("path.camera") // .data(frames) // .join("path") // .attr("class", "camera") // .attr("d", (d) => // cameraPath(d.cameraTranslation, d.cameraRotation, d.cameraIntrinsic) // ) // .attr("fill-opacity", 0.1) // .attr("stroke-opacity", 0) // .attr("fill", "yellow"); const gDetectionWithDe = svg .append("g") .attr("fill-opacity", 1) .attr("stroke-linecap", "round"); const detectionWithDe = gDetectionWithDe .selectAll("circle.detection-w-de") .data(detectionsWithDe3D.filter((d) => d.point_from_camera[2] > 0)) .join("circle") .attr("class", "detection-w-de") .attr("cx", (d) => x(d.point[0])) .attr("cy", (d) => y(d.point[1])) .attr("r", 0.2) .style("fill", (d) => objectColorScale(parseInt(d.object_id) % 10)); const gTrackingWithDe = svg .append("g") .attr("fill-opacity", 0) .attr("stroke-linecap", "round"); const trackingWithDe = gTrackingWithDe .selectAll("path.tracking-w-de") .data(trackingsWithDe3D) .join("path") .attr("class", "tracking-w-de") .attr( "d", (d) => "M " + d.tracking .filter((t) => t.point_from_camera[2] > 0) .map((t) => `${x(t.point[0])} ${y(t.point[1])}`) .join(" L ") ) .attr("stroke-width", 0.05) .attr("stroke", (d) => objectColorScale(parseInt(d.oid) % 10)); // const gDetection = svg // .append("g") // .attr("fill-opacity", 1) // .attr("stroke-linecap", "round"); // const detection = gDetection // .selectAll("circle.detection") // .data(detections.filter((d) => d.point_from_camera[2] > 0)) // .join("circle") // .attr("class", "detection") // .attr("cx", (d) => x(d.point[0])) // .attr("cy", (d) => y(d.point[1])) // .attr("r", 0.2) // .style("fill", (d) => objectColorScale(parseInt(d.object_id) % 10)); // const gTracking = svg // .append("g") // .attr("fill-opacity", 0) // .attr("stroke-linecap", "round"); // const tracking = gTracking // .selectAll("path.tracking") // .data(trackings) // .join("path") // .attr("class", "tracking") // .attr( // "d", // (d) => // "M " + // d.tracking.map((t) => `${x(t.point[0])} ${y(t.point[1])}`).join(" L ") // ) // .attr("stroke-width", 0.05) // .attr("stroke", (d) => objectColorScale(parseInt(d.oid) % 10)); // const gGTDetection = svg // .append("g") // .attr("fill-opacity", 1) // .attr("stroke-linecap", "round"); // const gtDetection = gGTDetection // .selectAll("circle.gtdetection") // .data(gtDetections) // .join("circle") // .attr("class", "gtdetection") // .attr("cx", (d) => x(d.translation[0])) // .attr("cy", (d) => y(d.translation[1])) // .attr("r", 0.2) // .style("fill", (d) => // objectColorScale(d.instance_token.charCodeAt(0) % 10) // ); // const gGTTracking = svg // .append("g") // .attr("fill-opacity", 0) // .attr("stroke-linecap", "round"); // const gtTracking = gGTTracking // .selectAll("path.gttracking") // .data(gtTrackings) // .join("path") // .attr("class", "gttracking") // .attr( // "d", // (d) => // "M " + // d.tracking // .map((t) => `${x(t.translation[0])} ${y(t.translation[1])}`) // .join(" L ") // ) // .style("stroke-width", 0.1) // .style("stroke-opacity", 0.5) // .attr("stroke", (d) => objectColorScale(d.oid.charCodeAt(0) % 10)); return Object.assign( [ gEgo, // gCamera, // gDetection, // gTracking, gDetectionWithDe, gTrackingWithDe // gtDetection, // gtTracking ], { update(frameId, timestamp) { ego.attr("opacity", (d, i) => (i === frameId ? 1 : 0)); // camera.attr("opacity", (d, i) => (i === frameId ? 1 : 0)); detectionWithDe.attr("opacity", (d) => (d.frameId === frameId ? 1 : 0)); trackingWithDe.attr("opacity", (d) => { if (d.tracking.some((d) => d.point_from_camera[2] < 0)) { return 0; } const frameIds = d.tracking.map((t) => t.frameId); return Math.min(...frameIds) <= frameId && frameId <= Math.max(...frameIds) ? 1 : 0; }); // detection.attr("opacity", (d) => (d.frameId === frameId ? 1 : 0)); // tracking.attr("opacity", (d) => { // if (d.tracking.some((d) => d.point_from_camera[2] < 0)) { // return 0; // } // const frameIds = d.tracking.map((t) => t.frameId); // return Math.min(...frameIds) <= frameId && // frameId <= Math.max(...frameIds) // ? 1 // : 0; // }); // const showingGTTracking = {}; // gtTracking.attr("opacity", (d) => { // const timestamps = d.tracking.map((t) => t.timestamp); // const show = // Math.min(...timestamps) <= timestamp && // timestamp <= Math.max(...timestamps); // if (show) { // showingGTTracking[d.oid] = d.tracking; // } // return show ? 1 : 0; // }); // const closestGTDetection = {}; // for (const [oid, _tracking] of Object.entries(showingGTTracking)) { // let closest = null; // let closestTracking = null; // for (const t of _tracking) { // const diff = timediff(timestamp, t.timestamp); // if (closestTracking === null || diff < closest) { // closest = diff; // closestTracking = t; // } // } // closestGTDetection[oid] = closestTracking; // } // gtDetection.attr("opacity", (d) => { // if (!(d.instance_token in closestGTDetection)) { // return 0; // } // return closestGTDetection[d.instance_token].sample_token === // d.sample_token // ? 1 // : 0; // }); } } ); })33:T414,function overlayPolygon(createOverlay) { const zoom = d3.zoom().on("zoom", zoomed); const svg = d3.create("svg").attr("viewBox", [0, 0, width, height]); const gGrid = svg.append("g"); const gPath = createPath(svg, polygon); const gOverlay = createOverlay(svg); const gx = svg.append("g"); const gy = svg.append("g"); svg.call(zoom).call(zoom.transform, d3.zoomIdentity); function zoomed({ transform }) { const zx = transform.rescaleX(x).interpolate(d3.interpolateRound); const zy = transform.rescaleY(y).interpolate(d3.interpolateRound); gPath.attr("transform", transform).attr("stroke-width", 3 / transform.k); gOverlay.forEach((o) => o.attr("transform", transform).attr("stroke-width", 3 / transform.k) ); gx.call(xAxis, zx); gy.call(yAxis, zy); gGrid.call(grid, zx, zy); } return Object.assign(svg.node(), { reset() { svg.transition().duration(750).call(zoom.transform, d3.zoomIdentity); }, update(...args) { gOverlay.update(...args); } }); }34:T4d4,function createDirection(svg, data) { const gDirection = svg .append("g") .attr("fill-opacity", 1) .attr("stroke-linecap", "round"); gDirection .selectAll("path.direction") .data(data) .join("path") .attr("class", "direction") .attr("d", drawDirection) .attr("stroke", (d) => z(d.heading)) .on("mouseover", (event, d) => { tooltip.style("visibility", "visible").text((d.heading * 180) / Math.PI); const _x = d.end[0] - d.start[0]; const _y = d.end[1] - d.start[1]; const size = Math.sqrt(_x * _x + _y * _y); d3.select("path.angle") .attr("opacity", 1) .attr("d", `M 100 60 l ${(_x * 30) / size} ${(-_y * 30) / size}`); d3.selectAll("path.path-hidden") .filter((dd) => dd.id === d.polygonId) .attr("opacity", 1) .attr("fill", () => z(d.heading)); }) .on("mousemove", (event) => { tooltip .style("top", event.pageY - 10 + "px") .style("left", event.pageX + 10 + "px"); }) .on("mouseout", () => { tooltip.style("visibility", "hidden"); d3.select("path.angle").attr("opacity", 0); d3.selectAll("path.path-hidden").attr("opacity", 0); }); return gDirection; }35:[{"id":"f20155bd836c31e492fe635700c845d9c007021aaf1f4963a233a011e8e737e88ad7bcad99f8c97023f1214a794224d8bbe1442378e5c875e586d142bdc31a27","href":"https://static.observableusercontent.com/files/f20155bd836c31e492fe635700c845d9c007021aaf1f4963a233a011e8e737e88ad7bcad99f8c97023f1214a794224d8bbe1442378e5c875e586d142bdc31a27","name":"frames@3.json","type":"application/json","lastModified":1674544617354.284,"size":5346576},{"id":"e66711716e627cf382b58bf5eb14e18323a0624181e12979a9a105e7ed788a4f03c1f86bdb9736699c6f0d1533f1395ab221cacf211e630433703b4f2c1777e9","href":"https://static.observableusercontent.com/files/e66711716e627cf382b58bf5eb14e18323a0624181e12979a9a105e7ed788a4f03c1f86bdb9736699c6f0d1533f1395ab221cacf211e630433703b4f2c1777e9","name":"polygon@1.json","type":"application/json","lastModified":1674544617354.284,"size":2135068},{"id":"550269f004b31b68330e941557f74c7671a368daa161240606495d842102ed39922923f19980aaab7baa8db81d5583c3d9258649fdd60ab862d05c4e786bb430","href":"https://static.observableusercontent.com/files/550269f004b31b68330e941557f74c7671a368daa161240606495d842102ed39922923f19980aaab7baa8db81d5583c3d9258649fdd60ab862d05c4e786bb430","name":"segment@1.json","type":"application/json","lastModified":1674544617354.284,"size":2405485},{"id":"239bd47281d76d9c7882c30ec123111fad349d13435d202bf9b19e4ce663b162f25b58553896234bcb4b3db63b86b08e434ab827ad910f08552cd1fed7686775","href":"https://static.observableusercontent.com/files/239bd47281d76d9c7882c30ec123111fad349d13435d202bf9b19e4ce663b162f25b58553896234bcb4b3db63b86b08e434ab827ad910f08552cd1fed7686775","name":"tracking3dnaive.json","type":"application/json","lastModified":1674544617354.284,"size":563646},{"id":"4468cb048182323a1df2d371878708901c60d8bd80e15546039891ab5c2c9b845f722f54f8372e8d4bcbe320e6cc8474bc9359ddc2d5100ce844b24556a347a6","href":"https://static.observableusercontent.com/files/4468cb048182323a1df2d371878708901c60d8bd80e15546039891ab5c2c9b845f722f54f8372e8d4bcbe320e6cc8474bc9359ddc2d5100ce844b24556a347a6","name":"ground_truth_annotation.json","type":"application/json","lastModified":1674544617354.284,"size":2550431},{"id":"2370deba7ebe79bd2ef9822aa663a521254a3152a87c8a3b1ae5095448aaac0366fde069fb67f64b50c969e2b8a1a7f224b34a63a87a3ae202afe55d58ed800c","href":"https://static.observableusercontent.com/files/2370deba7ebe79bd2ef9822aa663a521254a3152a87c8a3b1ae5095448aaac0366fde069fb67f64b50c969e2b8a1a7f224b34a63a87a3ae202afe55d58ed800c","name":"tracking-without-de-3d@1.json","type":"application/json","lastModified":1674609895632.435,"size":11742691},{"id":"b81d7ffdce7415b6537143e879db77f2290436bdd11d8a48327da14143542d2b8c8b27732197b5f2cb6026792ea5f8330a28ebb1a4c1156a967edbd82f5d7e07","href":"https://static.observableusercontent.com/files/b81d7ffdce7415b6537143e879db77f2290436bdd11d8a48327da14143542d2b8c8b27732197b5f2cb6026792ea5f8330a28ebb1a4c1156a967edbd82f5d7e07","name":"tracking-with-de.json","type":"application/json","lastModified":1674544644480.102,"size":5490904},{"id":"0ee4b97d64bb1087a4722ccc8f73785d0d50d58a67626f33fe8209dd11a514ce874b96119ec18c3a716aa584afdc6fe054309391ef9f676bee04f3f7c1256e6a","href":"https://static.observableusercontent.com/files/0ee4b97d64bb1087a4722ccc8f73785d0d50d58a67626f33fe8209dd11a514ce874b96119ec18c3a716aa584afdc6fe054309391ef9f676bee04f3f7c1256e6a","name":"tracking-with-de-3d.json","type":"application/json","lastModified":1674544645514.059,"size":9700923},{"id":"5f5df901c5b720be2add0892a1740e2f127f4ac665d741c07e47039e3cd8b699d560f4d1497918f6a8579cee56cd0bef97d189d8b2c64e462916a3de7489ca6b","href":"https://static.observableusercontent.com/files/5f5df901c5b720be2add0892a1740e2f127f4ac665d741c07e47039e3cd8b699d560f4d1497918f6a8579cee56cd0bef97d189d8b2c64e462916a3de7489ca6b","name":"tracking-without-de.json","type":"application/json","lastModified":1674544645866.328,"size":11510027},{"id":"2a78c3ce5afa5203eafb234db1daa1973fe717b00111f720ab82cce743cf22b3f05f3259b75854b3bcd7d1bdaf61121eab4771cc04405b93268409ea4521e1de","href":"https://static.observableusercontent.com/files/2a78c3ce5afa5203eafb234db1daa1973fe717b00111f720ab82cce743cf22b3f05f3259b75854b3bcd7d1bdaf61121eab4771cc04405b93268409ea4521e1de","name":"tracking-without-de-3d.json","type":"application/json","lastModified":1674544646625.381,"size":20402648},{"id":"4e13826560ba0307f0f48889fd12400ded247bd21de636290cddce7bf7c6c15eca72551226b51ee7418fb42739209f026c88f709010748256164634287392155","href":"https://static.observableusercontent.com/files/4e13826560ba0307f0f48889fd12400ded247bd21de636290cddce7bf7c6c15eca72551226b51ee7418fb42739209f026c88f709010748256164634287392155","name":"frames-compressed.json","type":"application/json","lastModified":1674609500171.389,"size":6106102},{"id":"e8ba48c75697ac9515492db3b20600aa4e101e00f78dfdda0131492a9990b4be1cf891447103c4cb93b1183c75cd036bedefa1eaac04494afbb3ebc30f8b1cc8","href":"https://static.observableusercontent.com/files/e8ba48c75697ac9515492db3b20600aa4e101e00f78dfdda0131492a9990b4be1cf891447103c4cb93b1183c75cd036bedefa1eaac04494afbb3ebc30f8b1cc8","name":"tracking-with-de-3d@1.json","type":"application/json","lastModified":1674609975342.078,"size":5795711}] 30:{"title":"nuScene's boston-seaport road network with detection estimation","cells":[{"id":0,"value":"# nuScene's boston-seaport road network with detection estimation","pinned":false,"hidden":false,"mode":"md"},{"id":1248,"value":"viewof scene = Inputs.select(Object.keys(rawTrackingWithDe3d), {\n value: \"scene-0757-CAM_FRONT\",\n label: \"Scene\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1290,"value":"viewof withorwithout = Inputs.select([\"with\", \"without\"], {\n value: \"with\",\n label: \"With or without DE\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1174,"value":"sceneName = scene.substring(0, \"scene-0000\".length)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1001,"value":"viewof selectedTimestamp = Scrubber(\n frames.map((f) => f.timestamp),\n { delay: 1000 / 20 }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1017,"value":"frameId = frames.findIndex((f) => f.timestamp === selectedTimestamp)","pinned":false,"hidden":false,"mode":"ojs"},{"id":96,"value":"viewof reset = html`