# "WebGL is not supported by your browser" for scatter3d on Safari 13.3.1 and Chrome 83.0.4103.106

**URL:** <https://community.plotly.com/t/webgl-is-not-supported-by-your-browser-for-scatter3d-on-safari-13-3-1-and-chrome-83-0-4103-106/41469>\
**Category:** plotly.js\
**Created:** [June 23, 2020, 3:19pm UTC](https://community.plotly.com/t/webgl-is-not-supported-by-your-browser-for-scatter3d-on-safari-13-3-1-and-chrome-83-0-4103-106/41469 "2020-06-23T15:19:31Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![yufanz](https://avatars.discourse-cdn.com/v4/letter/y/d07c76/32.png) [@yufanz](https://community.plotly.com/u/yufanz)\
**Post date:** [June 23, 2020, 3:19pm UTC](https://community.plotly.com/t/webgl-is-not-supported-by-your-browser-for-scatter3d-on-safari-13-3-1-and-chrome-83-0-4103-106/41469/1 "2020-06-23T15:19:31Z")

</div>

I want to add a scatter3d plot to my React Plotly app. But I’m getting “WebGL is not supported by your browser - visit [https://get.webgl.org](https://get.webgl.org) for more info” using the latest Safari and Chrome.

Of course my browsers do support WebGL when I visit [https://get.webgl.org](https://get.webgl.org), and [https://plot.ly/javascript/3d-scatter-plots/](https://plot.ly/javascript/3d-scatter-plots/) and [https://plot.ly/javascript/webgl-vs-svg/](https://plot.ly/javascript/webgl-vs-svg/) as suggested in [https://community.plotly.com/t/ie-11-webgl-is-not-supported-by-your-browser-visit-https-get-webgl-org-for-more-info/32252](https://community.plotly.com/t/ie-11-webgl-is-not-supported-by-your-browser-visit-https-get-webgl-org-for-more-info/32252).

I suspect it has to do with the fact that I’m using `import createPlotlyComponent from "react-plotly.js/factory";`, which I have to in order to avoid “JavaScript heap out of memory”, as suggested in [https://github.com/plotly/react-plotly.js/issues/135#issuecomment-500399098](https://github.com/plotly/react-plotly.js/issues/135#issuecomment-500399098).

Here’s my sandbox link: [https://codesandbox.io/s/frosty-robinson-zn9rn](https://codesandbox.io/s/frosty-robinson-zn9rn)

Thank you very much.

 ![Screen Shot 2020-06-23 at 11.17.40](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/8/8a4a964d6f757b2162b0976b268e8dd316d9d0e5.png)

---

<div class="post-metadata">

**Author:** ![yufanz](https://avatars.discourse-cdn.com/v4/letter/y/d07c76/32.png) [@yufanz](https://community.plotly.com/u/yufanz)\
**Post date:** [June 23, 2020, 5:19pm UTC](https://community.plotly.com/t/webgl-is-not-supported-by-your-browser-for-scatter3d-on-safari-13-3-1-and-chrome-83-0-4103-106/41469/2 "2020-06-23T17:19:00Z")

</div>

Found a workaround following [https://github.com/plotly/react-plotly.js/issues/135#issuecomment-500399098](https://github.com/plotly/react-plotly.js/issues/135#issuecomment-500399098).

Add `<script crossorigin src="https://cdn.plot.ly/plotly-latest.min.js"></script>` to `index.html`, and replace `import Plotly from 'plotly.js';` with `const Plotly = window.Plotly;`

It’s like magic to me. If anyone’s willing to explain what happens in the background, or point me to what I should read, I’d deeply appreciate it.
