{"action":"opened","issue":{"url":"https://api.github.com/repos/uber/react-map-gl/issues/682","repository_url":"https://api.github.com/repos/uber/react-map-gl","labels_url":"https://api.github.com/repos/uber/react-map-gl/issues/682/labels{/name}","comments_url":"https://api.github.com/repos/uber/react-map-gl/issues/682/comments","events_url":"https://api.github.com/repos/uber/react-map-gl/issues/682/events","html_url":"https://github.com/uber/react-map-gl/issues/682","id":394020049,"node_id":"MDU6SXNzdWUzOTQwMjAwNDk=","number":682,"title":"CORS error on mobile","user":{"login":"chenasraf","id":167217,"node_id":"MDQ6VXNlcjE2NzIxNw==","avatar_url":"https://avatars2.githubusercontent.com/u/167217?v=4","gravatar_id":"","url":"https://api.github.com/users/chenasraf","html_url":"https://github.com/chenasraf","followers_url":"https://api.github.com/users/chenasraf/followers","following_url":"https://api.github.com/users/chenasraf/following{/other_user}","gists_url":"https://api.github.com/users/chenasraf/gists{/gist_id}","starred_url":"https://api.github.com/users/chenasraf/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/chenasraf/subscriptions","organizations_url":"https://api.github.com/users/chenasraf/orgs","repos_url":"https://api.github.com/users/chenasraf/repos","events_url":"https://api.github.com/users/chenasraf/events{/privacy}","received_events_url":"https://api.github.com/users/chenasraf/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-12-25T13:19:44Z","updated_at":"2018-12-25T13:19:44Z","closed_at":null,"author_association":"NONE","body":"I have the following component:\r\n```\r\n<ReactMapGL mapboxApiAccessToken={process.env.REACT_APP_TS_MAPBOX_API_KEY!}\r\n\twidth={size[0]}\r\n\theight={size[1]}\r\n\tmapStyle=\"mapbox://styles/mapbox/streets-v10\"\r\n\t{...viewport}\r\n\tonViewportChange={(vp: any) => this.setState({ [viewportKey + 'MapViewport']: vp } as IState)}>\r\n\t<Marker longitude={toMapPoint.long!} latitude={toMapPoint.lat!}>\r\n\t\t<Tooltip title={toMapPoint.name!}>\r\n\t\t\t<SvgIcon className={css.pointIcon} src={LocationIcon} />\r\n\t\t</Tooltip>\r\n\t</Marker>\r\n\t<Marker longitude={fromLocation.long!} latitude={fromLocation.lat!}>\r\n\t\t<Tooltip title={fromLocation.name}>\r\n\t\t\t<div className={classNames(css.originIcon, css[fromLocation.location_type])}>\r\n\t\t\t\t<SvgIcon src={LocationTypeIcons[fromLocation.location_type]} />\r\n\t\t\t</div>\r\n\t\t</Tooltip>\r\n\t</Marker>\r\n</ReactMapGL>\r\n```\r\n\r\nAnd on mobile only, most of the information on the map doesn't load, an error occurs and the map is mostly blank (the most zoomed-out map still has the entire world in it, but upon zooming in, nothing shows)\r\n\r\nThis is the error:\r\n```\r\nUncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.\r\n    at Object.getImageData (http://localhost:3000/static/js/bundle.js:49360:2451)\r\n    at c (http://localhost:3000/static/js/bundle.js:49360:104123)\r\n    at http://localhost:3000/static/js/bundle.js:49360:104541\r\n    at Image.n.onload (http://localhost:3000/static/js/bundle.js:49356:232190)\r\n```\r\n\r\nI'm not sure what to do to solve this - I'm using the default map style on this widget, and not loading any layers, so I have no idea why this happens. Only happens on mobile, btw, though I'm not sure why"}}
{"actor":{"display_login":"chenasraf"}}