{"action":"created","issue":{"url":"https://api.github.com/repos/iddan/react-native-canvas/issues/60","repository_url":"https://api.github.com/repos/iddan/react-native-canvas","labels_url":"https://api.github.com/repos/iddan/react-native-canvas/issues/60/labels{/name}","comments_url":"https://api.github.com/repos/iddan/react-native-canvas/issues/60/comments","events_url":"https://api.github.com/repos/iddan/react-native-canvas/issues/60/events","html_url":"https://github.com/iddan/react-native-canvas/issues/60","id":331685291,"node_id":"MDU6SXNzdWUzMzE2ODUyOTE=","number":60,"title":"how to draw local image on canvas using react-native-canvas","user":{"login":"zokicpokic","id":4092021,"node_id":"MDQ6VXNlcjQwOTIwMjE=","avatar_url":"https://avatars0.githubusercontent.com/u/4092021?v=4","gravatar_id":"","url":"https://api.github.com/users/zokicpokic","html_url":"https://github.com/zokicpokic","followers_url":"https://api.github.com/users/zokicpokic/followers","following_url":"https://api.github.com/users/zokicpokic/following{/other_user}","gists_url":"https://api.github.com/users/zokicpokic/gists{/gist_id}","starred_url":"https://api.github.com/users/zokicpokic/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zokicpokic/subscriptions","organizations_url":"https://api.github.com/users/zokicpokic/orgs","repos_url":"https://api.github.com/users/zokicpokic/repos","events_url":"https://api.github.com/users/zokicpokic/events{/privacy}","received_events_url":"https://api.github.com/users/zokicpokic/received_events","type":"User","site_admin":false},"labels":[{"id":197531983,"node_id":"MDU6TGFiZWwxOTc1MzE5ODM=","url":"https://api.github.com/repos/iddan/react-native-canvas/labels/question","name":"question","color":"cc317c","default":true}],"state":"open","locked":false,"assignee":{"login":"iddan","id":12671072,"node_id":"MDQ6VXNlcjEyNjcxMDcy","avatar_url":"https://avatars2.githubusercontent.com/u/12671072?v=4","gravatar_id":"","url":"https://api.github.com/users/iddan","html_url":"https://github.com/iddan","followers_url":"https://api.github.com/users/iddan/followers","following_url":"https://api.github.com/users/iddan/following{/other_user}","gists_url":"https://api.github.com/users/iddan/gists{/gist_id}","starred_url":"https://api.github.com/users/iddan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/iddan/subscriptions","organizations_url":"https://api.github.com/users/iddan/orgs","repos_url":"https://api.github.com/users/iddan/repos","events_url":"https://api.github.com/users/iddan/events{/privacy}","received_events_url":"https://api.github.com/users/iddan/received_events","type":"User","site_admin":false},"assignees":[{"login":"iddan","id":12671072,"node_id":"MDQ6VXNlcjEyNjcxMDcy","avatar_url":"https://avatars2.githubusercontent.com/u/12671072?v=4","gravatar_id":"","url":"https://api.github.com/users/iddan","html_url":"https://github.com/iddan","followers_url":"https://api.github.com/users/iddan/followers","following_url":"https://api.github.com/users/iddan/following{/other_user}","gists_url":"https://api.github.com/users/iddan/gists{/gist_id}","starred_url":"https://api.github.com/users/iddan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/iddan/subscriptions","organizations_url":"https://api.github.com/users/iddan/orgs","repos_url":"https://api.github.com/users/iddan/repos","events_url":"https://api.github.com/users/iddan/events{/privacy}","received_events_url":"https://api.github.com/users/iddan/received_events","type":"User","site_admin":false}],"milestone":null,"comments":3,"created_at":"2018-06-12T17:37:06Z","updated_at":"2018-06-18T11:40:00Z","closed_at":null,"author_association":"NONE","body":"Hi,\r\nThank you for the package.\r\nI have followed instructions in the source and I am not able to draw image on canvas if image's source is within a project.\r\n\r\nhere is the code:\r\n```javascript\r\nimport React from 'react';\r\nimport { StyleSheet} from 'react-native';\r\nimport Canvas, {Image as CanvasImage} from 'react-native-canvas';\r\n\r\n\r\nexport default class App extends React.Component {\r\n  handleCanvas =  (canvas) => {\r\n    const image = new CanvasImage(canvas);\r\n    canvas.width = 100;\r\n    canvas.height = 100;\r\n    \r\n    const context = canvas.getContext('2d');\r\n\r\n    image.src = './dys.jpg';\r\n\r\n    //'https://image.freepik.com/free-vector/unicorn-background-design_1324-79.jpg'; Note: with this uri everything works well\r\n\r\n     image.addEventListener('load', () => {\r\n      debugger\r\n      console.log('image is loaded');\r\n      context.drawImage(image, 0, 0, 100, 100);\r\n    }); \r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Canvas ref={this.handleCanvas}/>\r\n    );\r\n  }\r\n}\r\n\r\nconst styles = StyleSheet.create({\r\n  container: {\r\n    flex: 1,\r\n    backgroundColor: '#fff',\r\n    alignItems: 'center',\r\n    justifyContent: 'center',\r\n  },\r\n});\r\n```\r\n\r\nIs it possible to set image.src to local path?\r\n\r\nThank you once again.\r\nRegards,\r\nZoran"},"comment":{"url":"https://api.github.com/repos/iddan/react-native-canvas/issues/comments/398026347","html_url":"https://github.com/iddan/react-native-canvas/issues/60#issuecomment-398026347","issue_url":"https://api.github.com/repos/iddan/react-native-canvas/issues/60","id":398026347,"node_id":"MDEyOklzc3VlQ29tbWVudDM5ODAyNjM0Nw==","user":{"login":"zokicpokic","id":4092021,"node_id":"MDQ6VXNlcjQwOTIwMjE=","avatar_url":"https://avatars0.githubusercontent.com/u/4092021?v=4","gravatar_id":"","url":"https://api.github.com/users/zokicpokic","html_url":"https://github.com/zokicpokic","followers_url":"https://api.github.com/users/zokicpokic/followers","following_url":"https://api.github.com/users/zokicpokic/following{/other_user}","gists_url":"https://api.github.com/users/zokicpokic/gists{/gist_id}","starred_url":"https://api.github.com/users/zokicpokic/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/zokicpokic/subscriptions","organizations_url":"https://api.github.com/users/zokicpokic/orgs","repos_url":"https://api.github.com/users/zokicpokic/repos","events_url":"https://api.github.com/users/zokicpokic/events{/privacy}","received_events_url":"https://api.github.com/users/zokicpokic/received_events","type":"User","site_admin":false},"created_at":"2018-06-18T11:40:00Z","updated_at":"2018-06-18T11:40:00Z","author_association":"NONE","body":"Hi @iddan , thank you for asking.\r\n\r\nI was able to solve this by \r\n\r\n      const asset = Expo.Asset.fromModule(require('./images/bckg.jpg'));\r\n      image.src = asset.uri ;\r\n\r\nThen:\r\n      image.addEventListener('load', function() {  \r\n        context.drawImage(image, 0, 0, canvas.width, canvas.height);\r\n     }\r\n\r\nI am using create react native app and Expo, linking FS appeared not easy going approach since linking and Expo are not much compatible.\r\n\r\nBut I will keep using react-native-canvas since it is most straightforward and achievable for 2D rendering.\r\nHowever, now I am wondering should I have to include load listener for each image I want to drive on let's say one scene, or there is another way to obtain image ref. and draw it directly on canvas.\r\n\r\nThank you once again.\r\nRegards,\r\nZoran\r\n"}}
{"actor":{"display_login":"zokicpokic"}}