search

statnett / vue-plotly

A vue wrapper for plotly.js chart library
MIT License
119 stars 28 forks source link

3d plot not working ("Webgl is not supported by your browser") #7

Open soichih opened 6 years ago

soichih commented 6 years ago

When I try to display 3d plots (like a scatter3d), I get an error message saying "Webgl is not supported by your browser".

screenshot from 2018-06-14 14-06-45

If I use plotly directly, I get a working plot.

screenshot from 2018-06-14 14-09-33

Does vue-plotly not support 3d plots?

soichih commented 6 years ago

I did a bit more troubleshooting, and I found that if I load plotly like following.

import Plotly from 'plotly.js/dist/plotly.min.js'

.. the 3d graphs works. But not this

import Plotly from 'plotly.js'

I think there is something wrong with the way plotly is webpacked on my project... but I am not sure what exactly the cause of this problem.

danielpcampagna commented 5 years ago

@soichih , some update or news about this issue?

soichih commented 5 years ago

I think I had to add ify-loader (whatever that is..) to my webpack config.

build/webpack.base.conf.js

under module.exports.module.rules

      //plotly needs ify-loader (rest should be babel-loader - for es6 syntax)
      {
        test: /\.js$/,
        loader: 'ify-loader', //to make it work with plotly
        exclude: [resolve('src')],
      },
exislow commented 4 years ago

I have the same issue, using the scatter3d plot. the ify-loader solution could not help. Has anybody a solution?

benguela commented 4 years ago

same here, adding ify-loader did not help neither did using plotly.min.js for me

aguillenb commented 4 years ago

I did a bit more troubleshooting, and I found that if I load plotly like following.

import Plotly from 'plotly.js/dist/plotly.min.js'

.. the 3d graphs works. But not this

import Plotly from 'plotly.js'

I think there is something wrong with the way plotly is webpacked on my project... but I am not sure what exactly the cause of this problem.

That worked for me! Thanks!!!

MiltonCobo commented 4 years ago

Hi, I'm trying to use vue-plotly in a project using nuxtjs and vue.js. For 3D graphics shows up the same problem: "WebGL is not supported by...." I am importing Plotly from 'plotly.js/dist/plotly.js' as indicated here, but still is not working. And I have no idea how to set up ify-loader in the configuration fo nuxtJS ( nuxt.config.js). There is a reference to this in https://github.com/statnett/vue-plotly, but still i could not make it work. Anybody can help me?

soichih commented 4 years ago

@MiltonCobo you should use https://github.com/David-Desmaisons/vue-plotly instead. It just works.