2c:null 2d:["$","title",null,{"children":"BVH Multi Projection Library | Bernardo F Costa | Observable"}] 32:[] 30:{"id":"eb49fda98bf3f937","slug":"bvh-multi-projection-library","title":"BVH Multi Projection Library","thumbnail":"09f801888ceba94b89ee00d9e758fa76b3ba5b339330d4e67a5d03c340ad3a6e","access_level":"public","create_time":"$D2018-12-06T17:06:25.831Z","update_time":"$D2019-04-04T18:32:31.281Z","view_time":null,"first_public_time":"$D2018-12-06T17:12:40.094Z","has_unpublished_edits":null,"fork":{"id":"ccf1661cb021c40f","slug":"bvh-multi-projection-visualization","title":"BVH Multi Projection Visualization","owner":{"id":"19794828b26ed3d5","login":"bfcosta","name":"Bernardo F Costa"}},"stars":0,"starred":false,"owner":{"type":"team","id":"19794828b26ed3d5","login":"bfcosta","name":"Bernardo F Costa","avatar_url":"https://avatars-next.observableusercontent.com/78f40e0d4bfd54c9eeb3a9c56051faf43b66de013c4bc5de8df7a1f074db8f66","tier":"starter_2024"},"version":1087,"publish_version":1087,"role":null,"authored":false,"authors":[{"type":"individual","id":"3cbdc86b07b89072","login":"bfcosta","name":"Bernardo F Costa","avatar_url":"https://avatars-next.observableusercontent.com/78f40e0d4bfd54c9eeb3a9c56051faf43b66de013c4bc5de8df7a1f074db8f66","tier":null}],"members":[{"type":"individual","id":"3cbdc86b07b89072","login":"bfcosta","name":"Bernardo F Costa","avatar_url":"https://avatars-next.observableusercontent.com/78f40e0d4bfd54c9eeb3a9c56051faf43b66de013c4bc5de8df7a1f074db8f66","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"BVH Multi Projection Library","cells":[{"id":0,"value":"md`# BVH Multi Projection Library`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":801,"value":"md`## Emscripten module import code`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"develUrl = \"https://www.lcg.ufrj.br/~bfcosta/multiproj.js\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":319,"value":"githubUrl = \"https://bfcosta.github.io/ObsAuxRepo/js/multiproj.js\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":975,"value":"md`\\`url\\` should be one of the above urls. \\`githubUrl\\` is the default since it is more stable. \\`develUrl\\` is used during development`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":971,"value":"url = githubUrl","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"\nModule = require(url).catch(() => {\n const m = window.Module;\n if (m.onRuntimeInitialized) return m; // Already initialized.\n return new Promise(resolve => m.onRuntimeInitialized = () => resolve(m));\n})\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":266,"value":"md`## Module imported functions`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":109,"value":"add2DB = Module.cwrap('add2DB', 'number', ['string'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":258,"value":"md` \\`int add2DB(char * argv)\\`\n\nLoads BVH contents in current database\n\nwhere:\n\n* *argv* is the string with BVH file contents.\n\nReturns the number of frames in BVH\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"clearDB = Module.cwrap('clearDB', 'number', [])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":271,"value":"md`\n\\`int clearDB()\\`\n\nClear database contents.\n\nReturns zero if database exists; one otherwise\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":131,"value":"computeKFs = Module.cwrap('computeKFs', 'number', ['number', 'number', 'number'])\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":268,"value":"md`\n\\`int computeKFs(double * pvout, unsigned int nkfs, unsigned int nsamples = 500)\\`\n\nSelect keyframes in database using ROLS+MDS. After calling this, the projection/unprojection RBFs are automatically computed.\n\nwhere\n\n * *pvout* is the output buffer with the projection of the selected frames: a three-column row-wise matrix where each of the nkfs rows is in the form { *i*, *x*, *y* }, where *i* is frame number.\n * *nkfs* is the number of keyframes asked\n * *nsamples* is the maximum number of frames allowed for the multi reader to sample in individual files. Default value of 500 can be ommited in C++, but the wrapped webassembly function has no support for default arguments, so you should pass 500 (or some other value).\n\nReturns the number of keyframes chosen (*nkfs*, ordinarily)\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":133,"value":"setKFs = Module.cwrap('setKFs', 'number', ['number', 'number'])\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":337,"value":"md`\n\\`int setKFs(double * pvin, unsigned int nkfs)\\`\n\nSets the keyframe database to the provided selected frames and projections. After calling this, the projection/unprojection RBFs are automatically computed.\n\nwhere \n\n* *pvin* is the buffer with projection. This is a three-column row-wise matrix where each of the *nkfs* rows is in the form { *i*, *x*, *y* }, where *i* is frame number.\n* *nkfs* is the number of elements in the projection buffer.\n\nReturns *nkfs* ordinarily, or the total number of keyframes considered. \n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":256,"value":"getRBFP = Module.cwrap('getRBFP', 'number', ['number', 'number', 'number'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":277,"value":"md`\n\\`int getRBFP(double * pvout, int base, int nf)\\`\n\nComputes the RBF Projection with current keyframes for a range of frames\n\nwhere \n * *pvout* is the output buffer with RBFP: a three-column row-wise matrix where each of the *nf* rows is in the form { *x*, *y*, *0|1* }, where *0|1* is a flag that is set if that frame is a key frame.\n * *base* is the index of the first frame to be projected\n * *nf* is the total of frames to be projected\n \nReturns the number of projected frames (*nf*, ordinarily).\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":470,"value":"getRBFPOpt = Module.cwrap('getRBFPOpt', 'number', ['number'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":472,"value":"md`\n\\`int getRBFPOpt(double * pvout)\\`\n\nComputes optimized RBF Projection with current keyframes for last frame range (see \\`getRBFP()\\`)\n\nwhere\n\n* *pvout* is the buffer with RBFP: a three-column row-wise matrix where third column is the control point flag. Size of buffer was given in last call of getRBFP.\n\nReturns the number of projected frames (*nf*, ordinarily)\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":528,"value":"getPoseError = Module.cwrap('getPoseError', 'number', ['number', 'number', 'number'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":530,"value":"md`\n\\`double getPoseError(double * qvin1, double * qvin2, int qsize)\\`\n\nGet error measure between two skeleton poses\n\nwhere\n* *qvin1* is the quaternion buffer for first pose\n* *qvin2* is the quaternion buffer for second pose\n* *qsize* is the quaternion buffer size, which should be 4 times the number of rotation joints in the skeleton\n\nReturns the pose distance (i.e, the \"error\" between them)\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":476,"value":"unprojectPose = Module.cwrap('unprojectPose', 'number', ['number', 'number', 'number', 'number'])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":478,"value":"md`\n\\`int unprojectPose(double * qvout, int qsize, double xpos, double ypos)\\`\n\nComputes skeleton pose for a given 2D projected point (i.e., unprojects the point onto pose space).\n\nwhere\n\n* *qvout* is the output skeleton rotation buffer\n* *qsize* is the size of output skeleton rotation buffer\n* *xpos* is the X coordinate\n* *ypos* is the Y coordinate\n\nReturns the number of rotation joints (qsize/4)\n

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":908,"value":"// Convenience function to allocate a buffer in the Module's memory space\n// so that we can use it to pass and receive an array of numbers\nfunction cArray(size) {\n var offset = Module._malloc(size * 8);\n return {\n offset: offset,\n size: size,\n getArray : function () { return Module.HEAPF64.subarray(offset / 8, offset / 8 + size); },\n dispose : function () { Module._free(offset); }\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":977,"value":"md`# Example test code`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":979,"value":"md`### First step: is reset the database by calling \\`clearDB()\\``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":981,"value":"firstStep = clearDB( )","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":984,"value":"md`### Second step: add a bvh file to the database and obtain the number of frames in the bvh`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":987,"value":"secondStep = {\n firstStep; // force evaluation of firstStep cell\n let f = await fetch(\"https://raw.githubusercontent.com/mrdoob/three.js/dev/examples/models/bvh/pirouette.bvh\");\n let bvhText = await f.text();\n let nframes = add2DB(bvhText);\n return nframes\n}\n ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1006,"value":"md`### Third step: select keyframes from the pose database and compute their projections`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1012,"value":"thirdStep = { \n // Number of keyframes used in the projection \n let nframes = secondStep;\n let nkfs = ~~(nframes*0.05); // 5% of all frames are to be keyframes\n // Allocate a buffer for receiving the projected keyframes\n let projArray = cArray(nkfs*3);\n // Call function to compute keyframes\n let n = computeKFs (projArray.offset, nkfs, 500);\n // Retrieve the projection points and store into a global array\n let proj = [];\n let data = projArray.getArray();\n console.assert (data.length == projArray.size);\n for (let i = 0; i < data.length; i+=3) {\n proj.push ([data[i], data[i+1], data[i+2]])\n }\n projArray.dispose();\n return proj\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1072,"value":"plotPoints(thirdStep.map(p => [p[1],p[2]]))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1034,"value":"md`### Fourth step: project non-key frames`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1055,"value":"fourthStep = {\n let nframes = secondStep;\n thirdStep; // make sure keyframe projections were computed\n let projArray = cArray(nframes*3);\n getRBFP(projArray.offset, 0, nframes);\n let data = projArray.getArray();\n let proj = [];\n let tmp = [];\n for (let i = 0; i < data.length; i+=3) {\n proj.push ([data[i], data[i+1], data[i+2]]);\n if (data[i+2]==1) tmp.push([i/3].concat(proj[i/3]))\n }\n //console.log(tmp);\n projArray.dispose();\n return proj;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1076,"value":"plotProjection(fourthStep)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1051,"value":"md`### Fifth step: move keyframes and recompute projection`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1042,"value":"fifthStep = {\n let nkfs = thirdStep.length;\n let projArray = cArray(nkfs*3);\n let data = projArray.getArray();\n for (let i = 0; i < data.length; i+=3) {\n let row = thirdStep[i/3];\n data[i] = row[0];\n data[i+1] = row[1];\n data[i+2] = row[2];\n }\n // changing X and Y for the first keyframe\n //let tmp = data[0];\n //data[0] = data[1];\n //data[1] = tmp;\n data[1] = 0.25 + data[1];\n data[2] = 0.25 + data[2];\n //\n setKFs (projArray.offset, nkfs);\n projArray.dispose();\n //\n let nframes = secondStep;\n let projArray2 = cArray(nframes*3);\n getRBFP(projArray2.offset, 0, nframes);\n let data2 = projArray2.getArray();\n let proj = [];\n for (let i = 0; i < data2.length; i+=3) {\n proj.push ([data2[i], data2[i+1], data2[i+2]]);\n }\n projArray2.dispose();\n return proj;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1068,"value":"plotPoints = function (pts) {\n let sz = 400;\n let margin = 20;\n let ctx = DOM.context2d(sz,sz);\n ctx.fillStyle = \"red\";\n for (let [x,y] of pts) {\n ctx.beginPath();\n ctx.arc (x*sz + margin,y*sz + margin,5,0, 2 * Math.PI);\n ctx.fill()\n }\n return ctx.canvas\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1074,"value":"plotProjection = function (pts) {\n let sz = 400;\n let margin = 10;\n let ctx = DOM.context2d(sz,sz);\n ctx.strokeStyle = \"black\";\n ctx.fillStyle = \"red\";\n for (let [x,y,key] of pts) {\n if (key == 1) continue;\n ctx.beginPath();\n ctx.arc (x*sz + margin,y*sz + margin,5,0, 2 * Math.PI);\n ctx.stroke();\n }\n for (let [x,y,key] of pts) {\n if (key != 1) continue;\n ctx.beginPath();\n ctx.arc (x*sz + margin,y*sz + margin,5,0, 2 * Math.PI);\n ctx.fill();\n }\n return ctx.canvas\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 31:"$30:body"