David-Desmaisons / vue-plotly

📈 vue wrapper for plotly.js
https://david-desmaisons.github.io/vue-plotly/
MIT License
255 stars 74 forks source link

UMD build does not work #19

Open simevo opened 4 years ago

simevo commented 4 years ago

I tried this:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Test vue-plotly</title>
    <script src="https://unpkg.com/vue@latest/dist/vue.min.js"></script>
  </head>
  <body>
    <div id="settings">
      <v-plotly :data="plots" :layout="layout" :display-mode-bar="false" :displaylogo="false" ></v-plotly>
    </div>
  </body>
  <script src="https://unpkg.com/vue-plotly@latest/dist/vue-plotly.umd.js"></script>
  <script>
    Vue.component('v-plotly', Plotly);
    var app = new Vue({
      el: '#settings',
      data: {
        parameters: [],
        sensors: {},
        plots: [
          {
            x: [1, 2, 3, 4],
            y: [10, 15, 13, 17],
            type: "scatter"
          }
        ],
        layout: {
          title: "My graph"
        }
      }
    });
  </script>
</html>

results:

index.html:14 Uncaught ReferenceError: Plotly is not defined
    at index.html:14
simevo commented 4 years ago

This works:

<vue-plotly :data="plots" :layout="layout" :display-mode-bar="false" :displaylogo="false" ></vue-plotly>

and:

Vue.component('vue-plotly', window['vue-plotly'].Plotly);

you may want to mention this in the docs / provide an example