{"action":"opened","issue":{"url":"https://api.github.com/repos/jacomyal/sigma.js/issues/491","labels_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/491/labels{/name}","comments_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/491/comments","events_url":"https://api.github.com/repos/jacomyal/sigma.js/issues/491/events","html_url":"https://github.com/jacomyal/sigma.js/issues/491","id":53419970,"number":491,"title":"Scene background-color option","user":{"login":"Flo-Schield-Bobby","id":1577155,"avatar_url":"https://avatars.githubusercontent.com/u/1577155?v=3","gravatar_id":"","url":"https://api.github.com/users/Flo-Schield-Bobby","html_url":"https://github.com/Flo-Schield-Bobby","followers_url":"https://api.github.com/users/Flo-Schield-Bobby/followers","following_url":"https://api.github.com/users/Flo-Schield-Bobby/following{/other_user}","gists_url":"https://api.github.com/users/Flo-Schield-Bobby/gists{/gist_id}","starred_url":"https://api.github.com/users/Flo-Schield-Bobby/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Flo-Schield-Bobby/subscriptions","organizations_url":"https://api.github.com/users/Flo-Schield-Bobby/orgs","repos_url":"https://api.github.com/users/Flo-Schield-Bobby/repos","events_url":"https://api.github.com/users/Flo-Schield-Bobby/events{/privacy}","received_events_url":"https://api.github.com/users/Flo-Schield-Bobby/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2015-01-05T17:21:35Z","updated_at":"2015-01-05T17:21:35Z","closed_at":null,"body":"A background-color is actually not in option because, according to the settings documentation, as the layers are transparent, adding a background-color to the container is enough -- at least in most cases --.\r\n\r\nHowever, what if I would like to screenshot the graph as a PNG image with HTML5 download-link ?\r\n\r\nI would basically do something like this :\r\n\r\nHTML5 :\r\n\r\n    <div id='graph-container'>\r\n        <a id='download-link' href='#' download='graph.png'>Download</a>\r\n    </div>\r\n\r\nJavaScript :\r\n\r\n    sigma.renderers.def = sigma.renderers.canvas;\r\n    var sigmaInstance = new sigma('graph-container', {\r\n        sideMargin: 1\r\n    });\r\n    \r\n    // Do whatever you want with the graph...\r\n    // var data = {};\r\n    // sigmaInstance.graph.read(data);\r\n    \r\n    sigmaInstance.refresh();\r\n    \r\n    var downloadLink = document.getElementById('download-link');\r\n    \r\n    downloadLink.addEventListener('click', function (event) {\r\n        downloadLink.setAttribute('href', sigmaInstance.renderers[0].domElements.scene.toDataURL());\r\n    });\r\n\r\nSo in this case, I would get a nice screenshot of the graph but without the same background...\r\n\r\nJSFiddle : http://jsfiddle.net/FloSchieldBobby/45bpbyra/\r\n\r\nOf course an option\r\n\r\nI'm ready to write a small plugin to support a background ;\r\nJust wondering what would be the best :\r\n- Adding a new canvas layer as background would we the most performant way (so it would only be drawn initially, then at the resize), however for my needs, I do not know if I could mix two canvas.toDataURL() content in a same image just in javascript ;\r\n- Adding an option for a background-color (disabled by default, only drawn if not transparent) for the \".sigma-scene\" canvas, a bit less performant, because redrawn more often...\r\n\r\nAny advice about it ?"}}