# How can I show all the data in graph but only few x-axis ticks?

**URL:** <https://community.plotly.com/t/how-can-i-show-all-the-data-in-graph-but-only-few-x-axis-ticks/27895>\
**Category:** plotly.js\
**Created:** [August 28, 2019, 7:58am UTC](https://community.plotly.com/t/how-can-i-show-all-the-data-in-graph-but-only-few-x-axis-ticks/27895 "2019-08-28T07:58:04Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![PraNisher](https://avatars.discourse-cdn.com/v4/letter/p/c67d28/32.png) [@PraNisher](https://community.plotly.com/u/PraNisher)\
**Post date:** [August 28, 2019, 7:58am UTC](https://community.plotly.com/t/how-can-i-show-all-the-data-in-graph-but-only-few-x-axis-ticks/27895/1 "2019-08-28T07:58:05Z")

</div>

I am using plotly. I’m having a lot of values in my x-axis array(around 1000 values which are of type string).I want to show all the data in the graph but only few ticks on x-axis. Maybe like tick for every 120th value in the x-axis array on the x-axis of graph.

My xData array includes time as string.

Here’s what my sample data looks like

```auto
var xData = ['08:01','08:02','08:03',....,'08:59','09:00','09:01','09:02','09:03',....,'09:59','10:00','10:01',....,'20:00'];
var yData = [4367,4958,5968,3764,3754,.....3847];

```

I have tried this but doesn’t work.

```auto
<div id="graph">
    <script>
        var layout = {
            hovermode:'closest',
            paper_bgcolor:'rgba(0,0,0,0)',
            plot_bgcolor:'rgba(0,0,0,0)',
            font: { color: '#ffffff'},
            height: 700,
            xaxis: {
                titlefont: {color: '#ffffff'},
                tickfont: {color: '#ffffff'},
                tickmode: 'linear',
                tickangle: -90,
                dtick: 120,
                showgrid: false,
                showline: false,
                zeroline: false
            },
            yaxis: {
                side: 'right',
                titlefont: {color: '#ffffff'},
                tickfont: {color: '#ffffff'},
                ticklen: 30,
                showgrid: false,
                showline: false,
                zeroline: false
            },
            legend: {
                x: 0,
                y: 1,
                traceorder: 'normal',
                font: {
                  family: 'sans-serif',
                  size: 12,
                  color: '#ffffff'
                }
            }
        };
        Plotly.plot('graph',[{
            x:xData,
            y:yData,
            mode:'lines'
        },{
            x:xData,
            y:yData,
            mode:'lines'
        },{
            x:xData,
            y:yData,
            mode:'lines'
        }], layout);
    </script>
</div>

```

I want to show full data but few x-axis ticks.

---

<div class="post-metadata">

**Author:** ![etienne](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/etienne/32/17_2.png) [@etienne](https://community.plotly.com/u/etienne)\
**Post date:** [August 28, 2019, 1:53pm UTC](https://community.plotly.com/t/how-can-i-show-all-the-data-in-graph-but-only-few-x-axis-ticks/27895/2 "2019-08-28T13:53:17Z")

</div>

See example: [https://plot.ly/javascript/axes/#enumerated-ticks-with-tickvals-and-ticktext](https://plot.ly/javascript/axes/#enumerated-ticks-with-tickvals-and-ticktext)