javascript - How to remove background line of plotly area graph

I don't want line in background of plotly area graph. My graph is ing like this.

I want to remove this lines from graph. But I didn't get any solution for it.

I referred this code.

And following is my code: demo.html

<html>
<head>
<script src=".12.4/jquery.min.js">
</script>
<script src=".min.js"></script>
</head>

<body>

 <div id="myDiv" style="width: 480px; height: 400px;"><!-- Plotly chart will be drawn inside this DIV --></div>
 <script>
   var trace1 = {
   x: ['2013-10-04 22:23:00', '2016-10-06 22:23:00',  '2013-11-04 22:23:00', '2013-11-07 22:23:00','2013-12-04 22:23:00', '2013-12-08 22:23:00'],
   y: [1, 3, 6,9, 4, 5],
   fill: 'tozeroy',
   fillcolor: 'red',
   text: server1,
   hoverinfo: "x+y+text",
   name:"Server 1",
   type: 'scatter',
   mode:"markers",
   marker:
   {
    size:5,
    color:"gray"
   },
   uid:"c2e171"
   };
   var layout = {
    margin: {
     l: 35,
     r: 40,
     b: 50,
     t: 10
    },
    legend: {
     "orientation": "h"
    },
    yaxis : {
     fixedrange: true
    },
   };
   var data = [trace1];
   Plotly.newPlot('myDiv', data,layout);

   var plotDiv = document.getElementById('myDiv');  
 </script>
 </body>
 </html>

And when I'm expanding graph means dragging graph x axis date is hiding,

Please give me solution for it. I'm new with plotly.js

I don't want line in background of plotly area graph. My graph is ing like this.

I want to remove this lines from graph. But I didn't get any solution for it.

I referred this code.

And following is my code: demo.html

<html>
<head>
<script src="https://ajax.googleapis./ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>

<body>

 <div id="myDiv" style="width: 480px; height: 400px;"><!-- Plotly chart will be drawn inside this DIV --></div>
 <script>
   var trace1 = {
   x: ['2013-10-04 22:23:00', '2016-10-06 22:23:00',  '2013-11-04 22:23:00', '2013-11-07 22:23:00','2013-12-04 22:23:00', '2013-12-08 22:23:00'],
   y: [1, 3, 6,9, 4, 5],
   fill: 'tozeroy',
   fillcolor: 'red',
   text: server1,
   hoverinfo: "x+y+text",
   name:"Server 1",
   type: 'scatter',
   mode:"markers",
   marker:
   {
    size:5,
    color:"gray"
   },
   uid:"c2e171"
   };
   var layout = {
    margin: {
     l: 35,
     r: 40,
     b: 50,
     t: 10
    },
    legend: {
     "orientation": "h"
    },
    yaxis : {
     fixedrange: true
    },
   };
   var data = [trace1];
   Plotly.newPlot('myDiv', data,layout);

   var plotDiv = document.getElementById('myDiv');  
 </script>
 </body>
 </html>

And when I'm expanding graph means dragging graph x axis date is hiding,

Please give me solution for it. I'm new with plotly.js

Share Improve this question asked Mar 31, 2017 at 10:14 Anil Jagtap 1,8106 gold badges29 silver badges45 bronze badges

Add a ment |

1 Answer 1

Sorted by: Reset to default 7

You can use showgrid:

xaxis: {
    showgrid: false
},
yaxis: {
    showgrid: false,
    showline: true
}

More plot.ly layout reference: https://plot.ly/javascript/reference/#layout-xaxis

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - How to remove background line of plotly area graph - Stack Overflow

1 Answer 1

与本文相关的文章

评论列表(0)