Wrong data showing in Plotly.js graph

Question

I'm trying to use data from my code behind to display a plot.ly graph on my webpage. Here is the code for the html:

 <div id="mydiv" style="width: 480px; height: 400px;">
    <script> 
        var fi = '<%= fi %>';

        //define different lines on the graph
        var freeze = {
            x: [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15],
            y: fi,
            mode: 'lines+markers',
            name: 'Sum FI'
        };

        var data = [freeze];

        var layout = {
            title: 'Freeze and Thaw Indexes',
            xaxis: {
                title: 'Date'
            },
            yaxis: {
                title: 'Sum'
            }
        };

        Plotly.newPlot('mydiv', data, layout);
    </script>
</div>

If I add an alert(fi) to the page, I see that

fi= [2,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]

which is exactly what it should be. However, the graph that is showing up is as if

fi=[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15]

or, in other words, the exact same as what I set for my x. Since I know I'm getting the correct variable from the code behind because when I check it with an alert, it's exactly what it's supposed to be, I really don't know why the graph is completely different. If anyone has any thoughts as to how to fix this, I'd really appreciate it!

I tried replicating the issue on code pen with the hard coded y values, but I cannot reproduce the error. It looks like the error might be with your fi array. Try hard coding the array and see if you still have the issue. — Bryan Euton
– Bryan Euton, Commented Jun 27, 2016 at 14:18

Kamil Mierzyński · Accepted Answer · 2016-06-27 14:26:46Z

1

Have you tried without apostrophes?

var fi = <%= fi %>;

answered Jun 27, 2016 at 14:26

Kamil Mierzyński

1958 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

issharp Over a year ago

Exactly the problem, thanks so much. Do you know why that would cause a problem? I'm only curious because this post had the apostrophes, so I included them: stackoverflow.com/questions/2714546/…

Kamil Mierzyński Over a year ago

This is another type of data. You have to pass number array to javascript, but you pass a string that looks like an array.

Collectives™ on Stack Overflow

Wrong data showing in Plotly.js graph

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related