Hide Pan/Zoom Button in CanvasJS Charts

Hide Pan/Zoom Button in CanvasJS Charts

by canvasjs

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 360px; width: 100%;margin-top:30px;"></div>

CSS

.canvasjs-chart-toolbar>:first-child{
    display: none !important;
}

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
    zoomEnabled:true,
    title: {
        text: "Hide Pan / Zoom Button in Chart using CSS"
    },
    data: [{
        type: "line",
        dataPoints: randomData(0, 100, 30)
    }]
});

chart.render();


function randomData(startX, startY, length) {
    var dataPoints = [];
    var y = startY;
    
    for (var i = 0; i < length; i += 1) {
        y += (Math.random() * 40 - 20) << 0;
        dataPoints.push({
            x: i + startX,
            //label: "label " + (i - limit / 2),
            y: y
        });
    }
    return dataPoints;
}