{"action":"created","issue":{"url":"https://api.github.com/repos/jacomyal/sigma.js/issues/566","labels_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/566/labels{/name}","comments_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/566/comments","events_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/566/events","html_url":"https://github.com/jacomyal/sigma.js/issues/566","id":73538344,"number":566,"title":"Control Points for edges","user":{"login":"felicedeluca","id":8150358,"avatar_url":"https://avatars.githubusercontent.com/u/8150358?v=3","gravatar_id":"","url":"https://api.github.com/users/felicedeluca","html_url":"https://github.com/felicedeluca","followers_url":"https://api.github.com/users/felicedeluca/followers","following_url":"https://api.github.com/users/felicedeluca/following{/other_user}","gists_url":"https://api.github.com/users/felicedeluca/gists{/gist_id}","starred_url":"https://api.github.com/users/felicedeluca/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/felicedeluca/subscriptions","organizations_url":"https://api.github.com/users/felicedeluca/orgs","repos_url":"https://api.github.com/users/felicedeluca/repos","events_url":"https://api.github.com/users/felicedeluca/events{/privacy}","received_events_url":"https://api.github.com/users/felicedeluca/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":11,"created_at":"2015-05-06T07:14:37Z","updated_at":"2015-05-14T18:44:53Z","closed_at":null,"body":"Hi,\r\nI need to have control point(s) for the arc to a custom routing with Bezier Paths or other curve paths.\r\n\r\nlet an arc have:\r\n\r\nsource,\r\ntarget,\r\ncontrolPoint {x: y:}\r\n\r\nhow can I have the projected 'x' and 'y' with 'prefix'  for the control point in the sigma.canvas.edge.path hook?\r\nThe controlPoint is not calculated with source and target but passed in the data.\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/jacomyal/sigma.js/issues/comments/102132498","html_url":"https://github.com/jacomyal/sigma.js/issues/566#issuecomment-102132498","issue_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/566","id":102132498,"user":{"login":"21stcaveman","id":10119484,"avatar_url":"https://avatars.githubusercontent.com/u/10119484?v=3","gravatar_id":"","url":"https://api.github.com/users/21stcaveman","html_url":"https://github.com/21stcaveman","followers_url":"https://api.github.com/users/21stcaveman/followers","following_url":"https://api.github.com/users/21stcaveman/following{/other_user}","gists_url":"https://api.github.com/users/21stcaveman/gists{/gist_id}","starred_url":"https://api.github.com/users/21stcaveman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/21stcaveman/subscriptions","organizations_url":"https://api.github.com/users/21stcaveman/orgs","repos_url":"https://api.github.com/users/21stcaveman/repos","events_url":"https://api.github.com/users/21stcaveman/events{/privacy}","received_events_url":"https://api.github.com/users/21stcaveman/received_events","type":"User","site_admin":false},"created_at":"2015-05-14T18:44:53Z","updated_at":"2015-05-14T18:44:53Z","body":"You are absolutely correct, my bad! that code isn't mapping correctly. I changed it to this :\r\n\r\n```javascript\r\n(function() {\r\n  'use strict';\r\n\r\n  if (typeof sigma === 'undefined')\r\n    throw 'sigma is not declared';\r\n\r\n  sigma.utils.pkg('sigma.plugins');\r\n\r\n  sigma.plugins.drawControlPoints = function(s, options) {\r\n    var o = options || {},\r\n    camera = s.cameras[0],\r\n    renderer = s.renderers[0],\r\n    context = s.renderers[0].contexts.nodes;\r\n\r\n    s.graph.edges().forEach(function (edge, index, edgeArray) {\r\n\tif ((edge.type == 'curved') || (edge.type == 'curvedArrow')) {\r\n\t\tvar source = s.graph.nodes(edge.source), target = s.graph.nodes(edge.target),\r\n\t    \tcpOriginal = sigma.utils.getQuadraticControlPoint(source.x, source.y, target.x, target.y),\r\n\t\tcos = Math.cos(camera.angle),\r\n\t\tsin = Math.sin(camera.angle),\r\n\t\tcp = { x: (cpOriginal.x - (maxX + minX) / 2) * scale, y: (cpOriginal.y - (maxY + minY) / 2) * scale }\r\n\r\n\t\tcp = {\r\n\t\tid: edge.id + 'cp',\r\n\t\tsize: 0.5,\r\n\t\tlabel: 'Control point for ' + edge.id,\r\n\t\txOriginal: cpOriginal.x,\r\n\t\tyOriginal: cpOriginal.y,\r\n\t\tx:\r\n\t\t\t(\r\n\t\t\t  (cp.x - camera.x) * cos +\r\n\t\t\t  (cp.y - camera.y) * sin\r\n\t\t\t) / camera.ratio + (renderer.width / 2),\r\n\r\n\t\ty:\r\n\t\t\t(\r\n\t\t\t  (cp.y - camera.y) * cos -\r\n\t\t\t  (cp.x - camera.x) * sin\r\n\t\t\t) / camera.ratio + (renderer.height / 2)\r\n\t\t};\r\n\r\n\t\tconsole.log(cp);\r\n\r\n\t\tcontext.fillStyle = 'red';\r\n\t\tcontext.beginPath();\r\n\t\tcontext.arc(cp.x, cp.y, 4, 0, Math.PI * 2, true);\r\n\t\tcontext.fill();\r\n\t\tcontext.save();\r\n\t}\r\n   });\r\n  }\r\n\r\n  sigma.plugins.kill = function(s) { };\r\n}).call(window);\r\n```\r\n\r\nThats because I forgot about a key part of drawing process which is rescaling the graph, as defined in sigma.middlewares.rescale.js\r\n\r\nDoes this work for you?"}}