• Demos
    • JavaScript Charts
    • JavaScript StockCharts
  • Download/NPM
    • Download CanvasJS
    • Install via NPM
  • Integrations
    Front End Technology Samples
    • React Charts
    • Angular Charts
    • Vue.js Charts New!
    • jQuery Charts
    • Dashboards
    Server Side Technology Samples
    • PHP Charts
    • Python Charts New!
    • ASP.NET MVC Charts
    • Spring MVC Charts
    • JSP Charts
  • License
  • Blog
  • Docs
    • Chart Documentation
    • StockChart Documentation
  • Support Forum
    • Chart Support
    • StockChart Support
  • My Account
My Account
  • KEY FEATURES
    • Basic Chart
    • Chart with Animation
    • Chart with Zooming/Panning
    • Multi Series Chart
    • Chart with Multiple Axes
    • Chart with Logarithmic Axis
    • Chart with JSON Data
    • Dynamic Chart
    • Drilldown Chart
    • Responsive Chart
    • Synchronized Charts
  • LINE CHARTS
    • Line Chart
    • Dashed Line Chart
    • Multi Series Line Chart
    • Spline Chart
    • Multi Series Spline Chart
    • Step Line Chart
    • Multi Series Step Line Chart
  • BAR CHARTS
    • Bar Chart with Category Axis
    • Multi Series Bar Chart
    • Stacked Bar Chart
    • Stacked Bar 100% Chart
  • COLUMN CHARTS
    • Column Chart with Category Axis
    • Column Chart in Dark Theme
    • Multi Series Column Chart
    • Stacked Column Chart
    • Stacked Column 100% Chart
  • PIE & DOUGHNUT CHARTS
    • Pie Chart
    • Doughnut Chart
    • Doughnut Chart in Dark Theme
  • AREA CHARTS
    • Area Chart with Markers
    • Multi Series Area Chart
    • Spline Area Chart
    • Multi Series Spline Area Chart
    • Step Area Chart
    • Stacked Area Chart
    • Stacked Area 100% Chart
  • RANGE CHARTS
    • Range Column Chart
    • Multi Series Range Column Chart
    • Range Bar Chart
    • Multi Series Range Bar Chart
    • Range Area Chart
    • Multi Series Range Area Chart
    • Range Spline Area Chart
    • Multi Series Range Spline Area Chart
  • BUBBLE & SCATTER CHARTS
    • Bubble Chart with 3-Dimensional Data
    • Bubble Chart in Dark Theme
    • Scatter Chart
    • Multi Series Scatter Chart
  • FUNNEL & PYRAMID CHARTS
    • Funnel Chart with Index Labels
    • Funnel Chart without Neck
    • Pyramid Chart
  • FINANCIAL CHARTS
    • Candlestick Chart
    • Candlestick Chart from JSON Data
    • OHLC Chart
    • OHLC Chart from JSON Data
    • Box & Whisker Chart
    • Waterfall Chart
  • COMBINATION CHARTS
    • Pareto Chart
    • Error Bar Chart
    • Combination of Range Area & Line Chart
    • Combination of Candlestick & Line chart
  • DYNAMIC CHARTS
    • Dynamic Line Chart
    • Dynamic Column Chart
  • DATA BINDING
    • Chart with Data from CSV
    • Chart with Data from Database
    • Chart with Date-Time Axis from Database
  • JAVASCRIPT, JQUERY, REACT, ANGULAR, VUE.JS
    • JavaScript Charts
    • jQuery Charts
    • React Charts
    • Angular Charts
    • Vue.js Charts
  • SERVER SIDE TECHNOLOGIES
    • ASP.NET MVC Charts
    • PHP Charts
    • Spring MVC Charts
    • JSP Charts

Python Synchronized Charts using Django

Download Python Django Chart Samples
  • Python Django Chart Samples
  • JavaScript Chart Samples
  • React Chart Samples
  • Angular Chart Samples
  • Vue.js Chart Samples
  • jQuery Chart Samples
  • PHP Chart Samples
  • ASP.NET Chart Samples
  • JSP Chart Samples
  • Spring MVC Chart Samples
  • Dashboard Samples
  • JavaScript StockChart Samples

Example shows multiple Python charts with tooltip, crosshair & range synchronized across charts. i.e. When you interact with one chart using mouse to show crosshair, tooltip, zoom / pan, etc. other charts also respond the same way.

  • Template
  • View
  • JSON Data
<!-- index.html -->
{% load static %}
<html>
<head>
<title>CanvasJS Python Charts</title>
<script>
    window.onload = function () {
        var data = {{ server_metrics|safe }};

        var charts = [];
        var toolTip = {
            shared: true
        },
        legend = {
            cursor: "pointer",
            itemclick: function (e) {
            if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                e.dataSeries.visible = false;
            } else {
                e.dataSeries.visible = true;
            }
            e.chart.render();
            }
        };  

        var systemDps = [], userDps=[], waitDps = [], buffersDps = [], cacheDps = [], usedDps=[], inboundDps = [], outboundDps = [], writeDps = [], readDps = [];

        var cpuChartOptions = {
            animationEnabled: true,
            theme: "light2", // "light1", "light2", "dark1", "dark2"
            title:{
            text: "CPU Utilization"
            },
            toolTip: toolTip,
            axisY: {
            valueFormatString: "#0.#%",
            },
            legend: legend,
            data: [{
            type: "splineArea", 
            showInLegend: "true",
            name: "User",
            yValueFormatString: "#0.#%",
            color: "#64b5f6",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            legendMarkerType: "square",
            dataPoints: userDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "System",
            yValueFormatString: "#0.#%",
            color: "#2196f3",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            legendMarkerType: "square",
            dataPoints: systemDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "Wait",
            yValueFormatString: "#0.#%",
            color: "#1976d2",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            legendMarkerType: "square",
            dataPoints: waitDps
            }]
        };
        var memoryChartOptions = {
            animationEnabled: true,
            theme: "light2",
            title:{
            text: "Memory Usage"
            },
            axisY: {
            suffix: " GB"
            },
            toolTip: toolTip,
            legend: legend,
            data: [{
            type: "splineArea", 
            showInLegend: "true",
            name: "Cache",
            color: "#e57373",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## GB",
            legendMarkerType: "square",
            dataPoints: cacheDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "Buffers",
            color: "#f44336",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## GB",
            legendMarkerType: "square",
            dataPoints: buffersDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "Used",
            color: "#d32f2f",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## GB",
            legendMarkerType: "square",
            dataPoints: usedDps
            }]
        }
        var networkChartOptions = {
            animationEnabled: true,
            theme: "light2",
            title:{
            text: "Network Traffic"
            },
            axisY: {
            suffix: " Kb/s"
            },
            toolTip: toolTip,
            legend: legend,
            data: [{
            type: "splineArea", 
            showInLegend: "true",
            name: "Outbound",
            color: "#81c784",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## Kb/s",
            legendMarkerType: "square",
            dataPoints: outboundDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "Inbound",
            color: "#388e3c",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## Kb/s",
            legendMarkerType: "square",
            dataPoints: inboundDps
            }]
        }
        var diskChartOptions = {
            animationEnabled: true,
            theme: "light2",
            title:{
            text: "Disk I/O (IOPS)"
            },
            axisY: {},
            toolTip: toolTip,
            legend: legend,
            data: [{
            type: "splineArea", 
            showInLegend: "true",
            name: "Write",
            color: "#ffb74d",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## ops/second",
            legendMarkerType: "square",
            dataPoints: writeDps
            },{
            type: "splineArea", 
            showInLegend: "true",
            name: "Read",
            color: "#f57c00",
            xValueType: "dateTime",
            xValueFormatString: "DD MMM YY HH:mm",
            yValueFormatString: "#.## ops/second",
            legendMarkerType: "square",
            dataPoints: readDps
            }]
        }

        charts.push(new CanvasJS.Chart("chartContainer1", cpuChartOptions));
        charts.push(new CanvasJS.Chart("chartContainer2", memoryChartOptions));
        charts.push(new CanvasJS.Chart("chartContainer3", networkChartOptions));
        charts.push(new CanvasJS.Chart("chartContainer4", diskChartOptions));


        for (var i = 1; i < data.length; i++) {
            systemDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].system)});
            userDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].user)});
            waitDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].wait)});
            buffersDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].buffers)});
            cacheDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].cache)});
            usedDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].used)});
            inboundDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].inbound)});
            outboundDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].outbound)});
            writeDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].write)});
            readDps.push({x: parseInt(data[i].time), y: parseFloat(data[i].read)});
        }
        for( var i = 0; i < charts.length; i++){
            charts[i].options.axisX = {
                labelAngle: 0,
                crosshair: {
                    enabled: true,
                    snapToDataPoint: true,
                    valueFormatString: "HH:mm"
                }
            }
        }

        syncCharts(charts, true, true, true); // syncCharts(charts, syncToolTip, syncCrosshair, syncAxisXRange)

        for( var i = 0; i < charts.length; i++){
            charts[i].render();
        }

        

        function syncCharts(charts, syncToolTip, syncCrosshair, syncAxisXRange) {

            if(!this.onToolTipUpdated){
                this.onToolTipUpdated = function(e) {
                    for (var j = 0; j < charts.length; j++) {
                        if (charts[j] != e.chart)
                            charts[j].toolTip.showAtX(e.entries[0].xValue);
                    }
                }
            }

            if(!this.onToolTipHidden){
                this.onToolTipHidden = function(e) {
                    for( var j = 0; j < charts.length; j++) {
                        if(charts[j] != e.chart)
                            charts[j].toolTip.hide();
                    }
                }
            }

            if(!this.onCrosshairUpdated){
                this.onCrosshairUpdated = function(e) {
                    for(var j = 0; j < charts.length; j++) {
                        if(charts[j] != e.chart)
                            charts[j].axisX[0].crosshair.showAt(e.value);
                    }
                }
            }

            if(!this.onCrosshairHidden){
                this.onCrosshairHidden =  function(e) {
                    for( var j = 0; j < charts.length; j++) {
                        if(charts[j] != e.chart)
                            charts[j].axisX[0].crosshair.hide();
                    }
                }
            }

            if(!this.onRangeChanged){
                this.onRangeChanged = function(e) {
                    for (var j = 0; j < charts.length; j++) {
                        if (e.trigger === "reset") {
                            charts[j].options.axisX.viewportMinimum = charts[j].options.axisX.viewportMaximum = null;
                            charts[j].options.axisY.viewportMinimum = charts[j].options.axisY.viewportMaximum = null;
                            charts[j].render();
                        } else if (charts[j] !== e.chart) {
                            charts[j].options.axisX.viewportMinimum = e.axisX[0].viewportMinimum;
                            charts[j].options.axisX.viewportMaximum = e.axisX[0].viewportMaximum;
                            charts[j].render();
                        }
                    }
                }
            }

            for(var i = 0; i < charts.length; i++) { 
                //Sync ToolTip
                if(syncToolTip) {
                    if(!charts[i].options.toolTip)
                    charts[i].options.toolTip = {};

                    charts[i].options.toolTip.updated = this.onToolTipUpdated;
                    charts[i].options.toolTip.hidden = this.onToolTipHidden;
                }

                //Sync Crosshair
                if(syncCrosshair) {
                    if(!charts[i].options.axisX)
                    charts[i].options.axisX = { crosshair: { enabled: true }};
                    
                    charts[i].options.axisX.crosshair.updated = this.onCrosshairUpdated; 
                    charts[i].options.axisX.crosshair.hidden = this.onCrosshairHidden; 
                }

                //Sync Zoom / Pan
                if(syncAxisXRange) {
                    charts[i].options.zoomEnabled = true;
                    charts[i].options.rangeChanged = this.onRangeChanged;
                }
            }
        }  
    }
</script>
<style>
  .row:after {
    content: "";
    display: table;
    clear: both;
  }
  .col {
    float: left;
    width: 50%;
    height: 270px;
  }
</style>
</head>
<body>
<div class="row">
  <div class="col"id="chartContainer1"></div>
  <div class="col" id="chartContainer2"></div>
</div>
<div class="row">
  <div class="col" id="chartContainer3"></div>
  <div class="col" id="chartContainer4"></div>
</div>
<script src="{% static 'canvasjs.min.js' %}"></script>
</body>
</html>                              
from django.shortcuts import render
import json
import os 

def index(request):
    dir_path = os.path.dirname(os.path.realpath(__file__))
    data = open(dir_path + "/static/server-metrics.json").read()
    server_metrics = json.loads(data)
    return render(request, "index.html", { "server_metrics": server_metrics})                        
[
   {  "read":0.9,"time":1548959400000,"used":1.32,"user":0.042,"wait":0.007,"cache":5.19,"write":6.81,"system":0.015,"buffers":2.12,"inbound":221,"outbound":350 },
   {  "read":1.21,"time":1548963000000,"used":1.323,"user":0.073,"wait":0.005,"cache":6.22,"write":6.31,"system":0.034,"buffers":2.15,"inbound":245,"outbound":450 },
   {  "read":2.5,"time":1548966600000,"used":1.331,"user":0.055,"wait":0.006,"cache":7.12,"write":6.51,"system":0.023,"buffers":2.25,"inbound":225,"outbound":380 },
   {  "read":2.4,"time":1548970200000,"used":1.334,"user":0.061,"wait":0.003,"cache":7.97,"write":6.91,"system":0.026,"buffers":2.29,"inbound":247,"outbound":420 },
   {  "read":2.1,"time":1548973800000,"used":1.335,"user":0.072,"wait":0.002,"cache":8.71,"write":6.82,"system":0.029,"buffers":2.36,"inbound":235,"outbound":442 },
   {  "read":2.3,"time":1548977400000,"used":1.339,"user":0.078,"wait":0.005,"cache":5.67,"write":7.12,"system":0.035,"buffers":2.2,"inbound":249,"outbound":489 },
   {  "read":1.9,"time":1548981000000,"used":1.339,"user":0.084,"wait":0.006,"cache":6.44,"write":7.21,"system":0.038,"buffers":2.24,"inbound":290,"outbound":495 },
   {  "read":1.76,"time":1548984600000,"used":1.342,"user":0.081,"wait":0.004,"cache":7.21,"write":7.31,"system":0.031,"buffers":2.26,"inbound":280,"outbound":474 },
   {  "read":1.68,"time":1548988200000,"used":1.345,"user":0.087,"wait":0.006,"cache":7.87,"write":7.25,"system":0.035,"buffers":2.29,"inbound":285,"outbound":503 },
   {  "read":1.62,"time":1548991800000,"used":1.365,"user":0.089,"wait":0.008,"cache":8.45,"write":7.5,"system":0.034,"buffers":2.33,"inbound":254,"outbound":510 },
   {  "read":1.69,"time":1548995400000,"used":1.375,"user":0.091,"wait":0.004,"cache":5.45,"write":7.61,"system":0.036,"buffers":2.35,"inbound":235,"outbound":550 },
   {  "read":1.6,"time":1548999000000,"used":1.375,"user":0.095,"wait":0.005,"cache":6.7,"write":7.65,"system":0.038,"buffers":2.18,"inbound":275,"outbound":594 },
   {  "read":1.58,"time":1549002600000,"used":1.345,"user":0.083,"wait":0.006,"cache":7.44,"write":7.73,"system":0.04,"buffers":2.25,"inbound":290,"outbound":545 },
   {  "read":1.54,"time":1549006200000,"used":1.321,"user":0.092,"wait":0.009,"cache":7.98,"write":7.76,"system":0.043,"buffers":2.32,"inbound":273,"outbound":535 },
   {  "read":1.02,"time":1549009800000,"used":1.296,"user":0.055,"wait":0.006,"cache":4.48,"write":7.24,"system":0.039,"buffers":2.31,"inbound":252,"outbound":445 },
   {  "read":1.06,"time":1549013400000,"used":1.32,"user":0.036,"wait":0.002,"cache":3.94,"write":7.21,"system":0.034,"buffers":2.24,"inbound":266,"outbound":500 },
   {  "read":1.08,"time":1549017000000,"used":1.35,"user":0.086,"wait":0.009,"cache":5.2,"write":7.13,"system":0.038,"buffers":2.17,"inbound":249,"outbound":453 },
   {  "read":1.17,"time":1549020600000,"used":1.34,"user":0.077,"wait":0.003,"cache":3.95,"write":7.09,"system":0.035,"buffers":2.34,"inbound":276,"outbound":424 },
   {  "read":1.1,"time":1549024200000,"used":1.32,"user":0.089,"wait":0.006,"cache":3.37,"write":6.98,"system":0.033,"buffers":2.32,"inbound":223,"outbound":392 },
   {  "read":1.16,"time":1549027800000,"used":1.317,"user":0.084,"wait":0.004,"cache":1.71,"write":6.73,"system":0.031,"buffers":2.28,"inbound":233,"outbound":439 },
   {  "read":1.24,"time":1549031400000,"used":1.314,"user":0.082,"wait":0.006,"cache":0.94,"write":6.78,"system":0.029,"buffers":2.25,"inbound":236,"outbound":370 },
   {  "read":1.38,"time":1549035000000,"used":1.31,"user":0.08,"wait":0.005,"cache":4.17,"write":6.68,"system":0.03,"buffers":2.23,"inbound":266,"outbound":330 },
   {  "read":1.48,"time":1549038600000,"used":1.309,"user":0.075,"wait":0.004,"cache":2.21,"write":6.6,"system":0.026,"buffers":2.19,"inbound":258,"outbound":300 },
   {  "read":1.58,"time":1549042200000,"used":1.306,"user":0.065,"wait":0.003,"cache":3.46,"write":6.3,"system":0.033,"buffers":2.35,"inbound":275,"outbound":400 },
   {  "read":1.38,"time":1549045800000,"used":1.298,"user":0.078,"wait":0.007,"cache":3.62,"write":6.39,"system":0.03,"buffers":2.28,"inbound":260,"outbound":485 },
   {  "read":1.58,"time":1549049400000,"used":1.295,"user":0.072,"wait":0.005,"cache":4.72,"write":5.99,"system":0.024,"buffers":2.24,"inbound":220,"outbound":495 },
   {  "read":0.69,"time":1549053000000,"used":1.341,"user":0.049,"wait":0.003,"cache":3.69,"write":5.78,"system":0.02,"buffers":2.14,"inbound":239,"outbound":544 },
   {  "read":0.38,"time":1549056600000,"used":1.343,"user":0.066,"wait":0.005,"cache":8.01,"write":6.28,"system":0.025,"buffers":2.11,"inbound":270,"outbound":500 },
   {  "read":1.63,"time":1549060200000,"used":1.351,"user":0.077,"wait":0.004,"cache":7.93,"write":7.53,"system":0.029,"buffers":2.14,"inbound":265,"outbound":460 },
   {  "read":1.94,"time":1549063800000,"used":1.355,"user":0.059,"wait":0.002,"cache":7.78,"write":7.03,"system":0.033,"buffers":2.17,"inbound":275,"outbound":453 },
   {  "read":2.83,"time":1549067400000,"used":1.355,"user":0.082,"wait":0.005,"cache":6.52,"write":7.24,"system":0.029,"buffers":2.27,"inbound":234,"outbound":424 },
   {  "read":2.63,"time":1549071000000,"used":1.359,"user":0.088,"wait":0.004,"cache":8.49,"write":7.64,"system":0.024,"buffers":2.31,"inbound":220,"outbound":445 },
   {  "read":2.83,"time":1549074600000,"used":1.363,"user":0.076,"wait":0.006,"cache":5.26,"write":7.55,"system":0.028,"buffers":2.38,"inbound":232,"outbound":439 },
   {  "read":2.73,"time":1549078200000,"used":1.365,"user":0.085,"wait":0.005,"cache":6.02,"write":7.85,"system":0.034,"buffers":2.22,"inbound":210,"outbound":392 },
   {  "read":2.63,"time":1549081800000,"used":1.386,"user":0.091,"wait":0.007,"cache":7.68,"write":7.93,"system":0.037,"buffers":2.26,"inbound":230,"outbound":370 },
   {  "read":2.49,"time":1549085400000,"used":1.396,"user":0.093,"wait":0.008,"cache":8.27,"write":8.04,"system":0.03,"buffers":2.28,"inbound":206,"outbound":330 },
   {  "read":2.41,"time":1549089000000,"used":1.365,"user":0.095,"wait":0.005,"cache":8.26,"write":7.98,"system":0.034,"buffers":2.31,"inbound":239,"outbound":400 },
   {  "read":2.35,"time":1549092600000,"used":1.341,"user":0.099,"wait":0.004,"cache":8.8,"write":8.23,"system":0.033,"buffers":2.35,"inbound":263,"outbound":300 },
   {  "read":2.42,"time":1549096200000,"used":1.304,"user":0.087,"wait":0.007,"cache":4.83,"write":8.34,"system":0.035,"buffers":2.37,"inbound":243,"outbound":377 },
   {  "read":2.33,"time":1549099800000,"used":1.328,"user":0.096,"wait":0.008,"cache":4.29,"write":8.38,"system":0.037,"buffers":2.2,"inbound":265,"outbound":477 },
   {  "read":2.31,"time":1549103400000,"used":1.358,"user":0.046,"wait":0.006,"cache":5.55,"write":8.46,"system":0.039,"buffers":2.27,"inbound":253,"outbound":407 },
   {  "read":2.27,"time":1549107000000,"used":1.348,"user":0.065,"wait":0.008,"cache":4.3,"write":8.49,"system":0.041,"buffers":2.34,"inbound":267,"outbound":447 },
   {  "read":1.39,"time":1549110600000,"used":1.328,"user":0.06,"wait":0.006,"cache":3.72,"write":7.6,"system":0.038,"buffers":2.31,"inbound":298,"outbound":469 },
   {  "read":1.43,"time":1549114200000,"used":1.325,"user":0.041,"wait":0.007,"cache":2.06,"write":7.58,"system":0.032,"buffers":2.24,"inbound":272,"outbound":516 },
   {  "read":1.45,"time":1549117800000,"used":1.322,"user":0.091,"wait":0.008,"cache":1.29,"write":7.5,"system":0.035,"buffers":2.17,"inbound":253,"outbound":522 },
   {  "read":1.54,"time":1549121400000,"used":1.318,"user":0.082,"wait":0.005,"cache":4.52,"write":7.46,"system":0.033,"buffers":2.34,"inbound":293,"outbound":501 },
   {  "read":1.47,"time":1549125000000,"used":1.317,"user":0.094,"wait":0.007,"cache":2.56,"write":7.35,"system":0.031,"buffers":2.32,"inbound":291,"outbound":530 },
   {  "read":1.53,"time":1549128600000,"used":1.314,"user":0.09,"wait":0.005,"cache":3.82,"write":7.1,"system":0.029,"buffers":2.28,"inbound":299,"outbound":537 },
   {  "read":1.61,"time":1549132200000,"used":1.306,"user":0.088,"wait":0.006,"cache":3.97,"write":7.15,"system":0.027,"buffers":2.25,"inbound":269,"outbound":577 },
   {  "read":1.75,"time":1549135800000,"used":1.303,"user":0.086,"wait":0.008,"cache":5.07,"write":7.06,"system":0.028,"buffers":2.23,"inbound":266,"outbound":572 },
   {  "read":1.85,"time":1549139400000,"used":1.33,"user":0.08,"wait":0.009,"cache":4.04,"write":6.97,"system":0.024,"buffers":2.19,"inbound":256,"outbound":562 },
   {  "read":1.95,"time":1549143000000,"used":1.333,"user":0.071,"wait":0.005,"cache":7.34,"write":6.67,"system":0.031,"buffers":2.35,"inbound":282,"outbound":477 },
   {  "read":1.75,"time":1549146600000,"used":1.341,"user":0.083,"wait":0.006,"cache":8.37,"write":6.76,"system":0.028,"buffers":2.28,"inbound":299,"outbound":377 },
   {  "read":1.95,"time":1549150200000,"used":1.344,"user":0.077,"wait":0.002,"cache":7.27,"write":6.35,"system":0.022,"buffers":2.24,"inbound":285,"outbound":407 },
   {  "read":1.06,"time":1549153800000,"used":1.345,"user":0.054,"wait":0.005,"cache":7.11,"write":6.15,"system":0.018,"buffers":2.14,"inbound":240,"outbound":447 },
   {  "read":0.75,"time":1549157400000,"used":1.349,"user":0.072,"wait":0.003,"cache":5.85,"write":6.65,"system":0.023,"buffers":2.11,"inbound":254,"outbound":516 },
   {  "read":1.19,"time":1549161000000,"used":1.352,"user":0.077,"wait":0.006,"cache":7.82,"write":7.1,"system":0.027,"buffers":2.14,"inbound":237,"outbound":469 },
   {  "read":1.5,"time":1549164600000,"used":1.355,"user":0.059,"wait":0.004,"cache":4.59,"write":6.6,"system":0.03,"buffers":2.17,"inbound":264,"outbound":501 },
   {  "read":2.39,"time":1549168200000,"used":1.375,"user":0.082,"wait":0.006,"cache":5.35,"write":6.8,"system":0.026,"buffers":2.27,"inbound":211,"outbound":530 },
   {  "read":2.19,"time":1549171800000,"used":1.385,"user":0.088,"wait":0.005,"cache":7.02,"write":7.2,"system":0.02,"buffers":2.31,"inbound":221,"outbound":577 },
   {  "read":2.39,"time":1549175400000,"used":1.355,"user":0.076,"wait":0.004,"cache":7.6,"write":7.11,"system":0.024,"buffers":2.38,"inbound":224,"outbound":522 },
   {  "read":2.29,"time":1549179000000,"used":1.331,"user":0.085,"wait":0.003,"cache":8.85,"write":7.41,"system":0.031,"buffers":2.22,"inbound":254,"outbound":461 },
   {  "read":2.19,"time":1549182600000,"used":1.301,"user":0.091,"wait":0.007,"cache":7.59,"write":7.5,"system":0.034,"buffers":2.26,"inbound":246,"outbound":516 },
   {  "read":2.05,"time":1549186200000,"used":1.325,"user":0.093,"wait":0.009,"cache":8.13,"write":7.6,"system":0.027,"buffers":2.28,"inbound":263,"outbound":469 },
   {  "read":1.97,"time":1549189800000,"used":1.355,"user":0.095,"wait":0.003,"cache":4.88,"write":7.54,"system":0.031,"buffers":2.31,"inbound":248,"outbound":440 },
   {  "read":1.91,"time":1549193400000,"used":1.345,"user":0.099,"wait":0.005,"cache":4.34,"write":7.79,"system":0.03,"buffers":2.35,"inbound":208,"outbound":408 },
   {  "read":1.98,"time":1549197000000,"used":1.325,"user":0.087,"wait":0.004,"cache":5.6,"write":7.9,"system":0.032,"buffers":2.37,"inbound":227,"outbound":455 },
   {  "read":1.89,"time":1549200600000,"used":1.322,"user":0.096,"wait":0.002,"cache":4.35,"write":7.94,"system":0.034,"buffers":2.2,"inbound":258,"outbound":386 },
   {  "read":1.87,"time":1549204200000,"used":1.319,"user":0.046,"wait":0.005,"cache":3.77,"write":8.02,"system":0.036,"buffers":2.27,"inbound":253,"outbound":346 },
   {  "read":1.83,"time":1549207800000,"used":1.315,"user":0.065,"wait":0.004,"cache":2.11,"write":8.04,"system":0.038,"buffers":2.34,"inbound":263,"outbound":316 },
   {  "read":1.35,"time":1549211400000,"used":1.314,"user":0.057,"wait":0.006,"cache":1.33,"write":7.56,"system":0.035,"buffers":2.29,"inbound":222,"outbound":416 },
   {  "read":1.39,"time":1549215000000,"used":1.311,"user":0.039,"wait":0.005,"cache":4.57,"write":7.54,"system":0.037,"buffers":2.22,"inbound":208,"outbound":501 },
   {  "read":1.41,"time":1549218600000,"used":1.303,"user":0.089,"wait":0.007,"cache":2.61,"write":7.46,"system":0.04,"buffers":2.15,"inbound":220,"outbound":511 },
   {  "read":1.5,"time":1549222200000,"used":1.3,"user":0.08,"wait":0.008,"cache":3.86,"write":7.42,"system":0.038,"buffers":2.32,"inbound":198,"outbound":560 },
   {  "read":1.43,"time":1549225800000,"used":1.338,"user":0.092,"wait":0.005,"cache":4.02,"write":7.31,"system":0.036,"buffers":2.3,"inbound":218,"outbound":516 },
   {  "read":1.49,"time":1549229400000,"used":1.341,"user":0.088,"wait":0.004,"cache":5.11,"write":7.06,"system":0.034,"buffers":2.26,"inbound":194,"outbound":476 },
   {  "read":1.57,"time":1549233000000,"used":1.349,"user":0.086,"wait":0.007,"cache":4.09,"write":7.11,"system":0.032,"buffers":2.23,"inbound":240,"outbound":469 },
   {  "read":1.71,"time":1549236600000,"used":1.352,"user":0.083,"wait":0.008,"cache":7.54,"write":7.02,"system":0.033,"buffers":2.21,"inbound":264,"outbound":440 },
   {  "read":1.81,"time":1549240200000,"used":1.353,"user":0.078,"wait":0.006,"cache":8.57,"write":6.93,"system":0.029,"buffers":2.17,"inbound":244,"outbound":461 },
   {  "read":1.91,"time":1549243800000,"used":1.357,"user":0.068,"wait":0.008,"cache":7.47,"write":6.63,"system":0.036,"buffers":2.33,"inbound":266,"outbound":455 },
   {  "read":1.71,"time":1549247400000,"used":1.36,"user":0.081,"wait":0.006,"cache":7.32,"write":6.72,"system":0.033,"buffers":2.26,"inbound":254,"outbound":408 },
   {  "read":1.91,"time":1549251000000,"used":1.363,"user":0.075,"wait":0.007,"cache":6.06,"write":6.31,"system":0.026,"buffers":2.22,"inbound":268,"outbound":386 },
   {  "read":1.02,"time":1549254600000,"used":1.383,"user":0.052,"wait":0.008,"cache":8.02,"write":6.11,"system":0.022,"buffers":2.12,"inbound":299,"outbound":346 },
   {  "read":0.71,"time":1549258200000,"used":1.393,"user":0.069,"wait":0.005,"cache":4.79,"write":6.61,"system":0.027,"buffers":2.09,"inbound":273,"outbound":416 },
   {  "read":1.33,"time":1549261800000,"used":1.363,"user":0.078,"wait":0.007,"cache":5.56,"write":7.23,"system":0.032,"buffers":2.16,"inbound":254,"outbound":316 },
   {  "read":1.64,"time":1549265400000,"used":1.339,"user":0.06,"wait":0.005,"cache":7.22,"write":6.73,"system":0.027,"buffers":2.19,"inbound":294,"outbound":368 },
   {  "read":2.53,"time":1549269000000,"used":1.309,"user":0.083,"wait":0.006,"cache":7.8,"write":6.93,"system":0.022,"buffers":2.29,"inbound":292,"outbound":468 },
   {  "read":2.33,"time":1549272600000,"used":1.333,"user":0.089,"wait":0.008,"cache":7.79,"write":7.34,"system":0.016,"buffers":2.33,"inbound":270,"outbound":398 },
   {  "read":2.53,"time":1549276200000,"used":1.363,"user":0.077,"wait":0.009,"cache":8.33,"write":7.25,"system":0.02,"buffers":2.4,"inbound":267,"outbound":438 },
   {  "read":2.43,"time":1549279800000,"used":1.353,"user":0.086,"wait":0.005,"cache":3.69,"write":7.55,"system":0.028,"buffers":2.24,"inbound":257,"outbound":460 },
   {  "read":2.33,"time":1549283400000,"used":1.333,"user":0.092,"wait":0.004,"cache":3.15,"write":7.64,"system":0.03,"buffers":2.28,"inbound":283,"outbound":507 },
   {  "read":2.19,"time":1549287000000,"used":1.33,"user":0.094,"wait":0.003,"cache":4.41,"write":7.73,"system":0.024,"buffers":2.3,"inbound":286,"outbound":513 },
   {  "read":2.11,"time":1549290600000,"used":1.327,"user":0.096,"wait":0.004,"cache":3.16,"write":7.68,"system":0.028,"buffers":2.33,"inbound":258,"outbound":492 },
   {  "read":2.05,"time":1549294200000,"used":1.323,"user":0.081,"wait":0.002,"cache":2.58,"write":7.93,"system":0.027,"buffers":2.37,"inbound":272,"outbound":521 },
   {  "read":2.12,"time":1549297800000,"used":1.322,"user":0.088,"wait":0.004,"cache":0.91,"write":8.04,"system":0.029,"buffers":2.39,"inbound":255,"outbound":528 },
   {  "read":2.03,"time":1549301400000,"used":1.319,"user":0.097,"wait":0.003,"cache":0.14,"write":8.08,"system":0.03,"buffers":2.22,"inbound":282,"outbound":568 },
   {  "read":2.01,"time":1549305000000,"used":1.311,"user":0.047,"wait":0.002,"cache":3.38,"write":8.16,"system":0.033,"buffers":2.29,"inbound":229,"outbound":563 },
   {  "read":1.97,"time":1549308600000,"used":1.308,"user":0.066,"wait":0.005,"cache":1.42,"write":8.19,"system":0.035,"buffers":2.36,"inbound":239,"outbound":553 },
   {  "read":1.36,"time":1549312200000,"used":1.296,"user":0.057,"wait":0.003,"cache":2.67,"write":7.58,"system":0.032,"buffers":2.29,"inbound":242,"outbound":468 },
   {  "read":1.4,"time":1549315800000,"used":1.32,"user":0.039,"wait":0.003,"cache":2.83,"write":7.55,"system":0.038,"buffers":2.22,"inbound":272,"outbound":368 },
   {  "read":1.42,"time":1549319400000,"used":1.35,"user":0.089,"wait":0.002,"cache":3.92,"write":7.47,"system":0.041,"buffers":2.15,"inbound":264,"outbound":398 },
   {  "read":1.51,"time":1549323000000,"used":1.34,"user":0.08,"wait":0.003,"cache":2.9,"write":7.43,"system":0.039,"buffers":2.32,"inbound":281,"outbound":438 },
   {  "read":1.44,"time":1549326600000,"used":1.32,"user":0.092,"wait":0.002,"cache":7.34,"write":7.32,"system":0.037,"buffers":2.3,"inbound":266,"outbound":507 },
   {  "read":1.5,"time":1549330200000,"used":1.317,"user":0.088,"wait":0.004,"cache":8.37,"write":7.07,"system":0.035,"buffers":2.26,"inbound":226,"outbound":460 },
   {  "read":1.58,"time":1549333800000,"used":1.314,"user":0.086,"wait":0.008,"cache":7.27,"write":7.13,"system":0.033,"buffers":2.23,"inbound":245,"outbound":492 },
   {  "read":1.72,"time":1549337400000,"used":1.31,"user":0.083,"wait":0.006,"cache":7.11,"write":7.03,"system":0.034,"buffers":2.21,"inbound":276,"outbound":521 },
   {  "read":1.82,"time":1549341000000,"used":1.309,"user":0.078,"wait":0.007,"cache":5.85,"write":6.94,"system":0.03,"buffers":2.17,"inbound":271,"outbound":568 },
   {  "read":1.92,"time":1549344600000,"used":1.306,"user":0.068,"wait":0.004,"cache":7.82,"write":6.64,"system":0.037,"buffers":2.33,"inbound":281,"outbound":513 },
   {  "read":1.72,"time":1549348200000,"used":1.298,"user":0.081,"wait":0.003,"cache":4.59,"write":6.73,"system":0.034,"buffers":2.26,"inbound":240,"outbound":468 },
   {  "read":1.92,"time":1549351800000,"used":1.295,"user":0.075,"wait":0.006,"cache":5.35,"write":6.33,"system":0.027,"buffers":2.22,"inbound":226,"outbound":523 },
   {  "read":1.03,"time":1549355400000,"used":1.341,"user":0.052,"wait":0.007,"cache":7.02,"write":6.13,"system":0.023,"buffers":2.12,"inbound":238,"outbound":476 },
   {  "read":0.72,"time":1549359000000,"used":1.343,"user":0.069,"wait":0.005,"cache":7.6,"write":6.63,"system":0.028,"buffers":2.09,"inbound":216,"outbound":447 },
   {  "read":1.63,"time":1549362600000,"used":1.351,"user":0.078,"wait":0.007,"cache":8.85,"write":7.53,"system":0.033,"buffers":2.13,"inbound":236,"outbound":415 },
   {  "read":1.94,"time":1549366200000,"used":1.355,"user":0.06,"wait":0.005,"cache":7.59,"write":7.03,"system":0.029,"buffers":2.15,"inbound":212,"outbound":462 },
   {  "read":2.83,"time":1549369800000,"used":1.355,"user":0.083,"wait":0.005,"cache":8.13,"write":7.24,"system":0.024,"buffers":2.26,"inbound":238,"outbound":393 },
   {  "read":2.63,"time":1549373400000,"used":1.359,"user":0.089,"wait":0.006,"cache":4.48,"write":7.64,"system":0.019,"buffers":2.3,"inbound":262,"outbound":353 },
   {  "read":2.83,"time":1549377000000,"used":1.363,"user":0.077,"wait":0.007,"cache":3.94,"write":7.55,"system":0.023,"buffers":2.36,"inbound":242,"outbound":323 },
   {  "read":2.73,"time":1549380600000,"used":1.365,"user":0.086,"wait":0.008,"cache":5.2,"write":7.85,"system":0.03,"buffers":2.21,"inbound":264,"outbound":423 },
   {  "read":2.63,"time":1549384200000,"used":1.386,"user":0.092,"wait":0.006,"cache":3.95,"write":7.93,"system":0.032,"buffers":2.25,"inbound":252,"outbound":508 },
   {  "read":2.49,"time":1549387800000,"used":1.396,"user":0.094,"wait":0.008,"cache":3.37,"write":8.04,"system":0.026,"buffers":2.26,"inbound":266,"outbound":518 },
   {  "read":2.41,"time":1549391400000,"used":1.365,"user":0.096,"wait":0.005,"cache":1.71,"write":7.98,"system":0.03,"buffers":2.3,"inbound":297,"outbound":567 },
   {  "read":2.35,"time":1549395000000,"used":1.341,"user":0.081,"wait":0.007,"cache":0.94,"write":8.23,"system":0.029,"buffers":2.34,"inbound":271,"outbound":523 },
   {  "read":2.42,"time":1549398600000,"used":1.304,"user":0.088,"wait":0.004,"cache":4.17,"write":8.34,"system":0.031,"buffers":2.36,"inbound":252,"outbound":483 },
   {  "read":2.33,"time":1549402200000,"used":1.328,"user":0.097,"wait":0.008,"cache":2.21,"write":8.38,"system":0.032,"buffers":2.19,"inbound":292,"outbound":476 },
   {  "read":2.31,"time":1549405800000,"used":1.358,"user":0.047,"wait":0.009,"cache":3.46,"write":8.46,"system":0.034,"buffers":2.26,"inbound":290,"outbound":447 },
   {  "read":2.27,"time":1549409400000,"used":1.348,"user":0.066,"wait":0.004,"cache":3.62,"write":8.49,"system":0.037,"buffers":2.32,"inbound":298,"outbound":468 },
   {  "read":1.27,"time":1549413000000,"used":1.328,"user":0.077,"wait":0.002,"cache":4.72,"write":7.49,"system":0.033,"buffers":2.31,"inbound":268,"outbound":462 },
   {  "read":1.31,"time":1549416600000,"used":1.325,"user":0.081,"wait":0.005,"cache":3.69,"write":7.46,"system":0.04,"buffers":2.24,"inbound":265,"outbound":415 },
   {  "read":1.33,"time":1549420200000,"used":1.322,"user":0.088,"wait":0.003,"cache":8.01,"write":7.38,"system":0.044,"buffers":2.17,"inbound":255,"outbound":393 },
   {  "read":1.42,"time":1549423800000,"used":1.318,"user":0.086,"wait":0.005,"cache":7.93,"write":7.34,"system":0.041,"buffers":2.34,"inbound":281,"outbound":353 },
   {  "read":1.35,"time":1549427400000,"used":1.317,"user":0.074,"wait":0.004,"cache":7.78,"write":7.23,"system":0.039,"buffers":2.32,"inbound":298,"outbound":423 },
   {  "read":1.41,"time":1549431000000,"used":1.314,"user":0.062,"wait":0.003,"cache":6.52,"write":6.98,"system":0.038,"buffers":2.28,"inbound":284,"outbound":323 },
   {  "read":1.49,"time":1549434600000,"used":1.306,"user":0.071,"wait":0.002,"cache":8.49,"write":7.03,"system":0.036,"buffers":2.25,"inbound":251,"outbound":363 },
   {  "read":1.63,"time":1549438200000,"used":1.303,"user":0.077,"wait":0.006,"cache":5.26,"write":6.93,"system":0.037,"buffers":2.23,"inbound":265,"outbound":463 },
   {  "read":1.73,"time":1549441800000,"used":1.33,"user":0.074,"wait":0.004,"cache":6.02,"write":6.85,"system":0.033,"buffers":2.19,"inbound":248,"outbound":393 },
   {  "read":1.83,"time":1549445400000,"used":1.333,"user":0.066,"wait":0.002,"cache":7.68,"write":6.55,"system":0.039,"buffers":2.35,"inbound":275,"outbound":433 },
   {  "read":1.63,"time":1549449000000,"used":1.341,"user":0.061,"wait":0.004,"cache":8.27,"write":6.64,"system":0.037,"buffers":2.28,"inbound":222,"outbound":455 },
   {  "read":1.83,"time":1549452600000,"used":1.344,"user":0.053,"wait":0.003,"cache":8.26,"write":6.24,"system":0.03,"buffers":2.24,"inbound":232,"outbound":502 },
   {  "read":0.94,"time":1549456200000,"used":1.345,"user":0.071,"wait":0.004,"cache":8.8,"write":6.03,"system":0.026,"buffers":2.14,"inbound":235,"outbound":508 },
   {  "read":0.63,"time":1549459800000,"used":1.349,"user":0.047,"wait":0.003,"cache":4.83,"write":6.53,"system":0.031,"buffers":2.11,"inbound":265,"outbound":487 },
   {  "read":1.01,"time":1549463400000,"used":1.352,"user":0.053,"wait":0.005,"cache":4.29,"write":6.92,"system":0.036,"buffers":2.14,"inbound":257,"outbound":516 },
   {  "read":1.32,"time":1549467000000,"used":1.355,"user":0.077,"wait":0.004,"cache":5.55,"write":6.42,"system":0.027,"buffers":2.17,"inbound":274,"outbound":523 },
   {  "read":2.21,"time":1549470600000,"used":1.375,"user":0.059,"wait":0.008,"cache":4.3,"write":6.62,"system":0.022,"buffers":2.27,"inbound":259,"outbound":563 },
   {  "read":2.01,"time":1549474200000,"used":1.385,"user":0.066,"wait":0.005,"cache":3.72,"write":7.02,"system":0.016,"buffers":2.31,"inbound":219,"outbound":558 },
   {  "read":2.21,"time":1549477800000,"used":1.355,"user":0.073,"wait":0.006,"cache":2.06,"write":6.93,"system":0.02,"buffers":2.38,"inbound":238,"outbound":548 },
   {  "read":2.11,"time":1549481400000,"used":1.331,"user":0.079,"wait":0.005,"cache":1.29,"write":7.23,"system":0.028,"buffers":2.22,"inbound":269,"outbound":463 },
   {  "read":2.01,"time":1549485000000,"used":1.301,"user":0.083,"wait":0.008,"cache":4.52,"write":7.32,"system":0.03,"buffers":2.26,"inbound":264,"outbound":363 },
   {  "read":1.87,"time":1549488600000,"used":1.325,"user":0.077,"wait":0.009,"cache":2.56,"write":7.42,"system":0.024,"buffers":2.28,"inbound":274,"outbound":393 },
   {  "read":1.79,"time":1549492200000,"used":1.355,"user":0.068,"wait":0.007,"cache":3.82,"write":7.36,"system":0.028,"buffers":2.31,"inbound":233,"outbound":433 },
   {  "read":1.73,"time":1549495800000,"used":1.345,"user":0.081,"wait":0.005,"cache":3.97,"write":7.61,"system":0.027,"buffers":2.35,"inbound":219,"outbound":502 },
   {  "read":1.8,"time":1549499400000,"used":1.325,"user":0.092,"wait":0.006,"cache":5.07,"write":7.72,"system":0.029,"buffers":2.37,"inbound":231,"outbound":455 },
   {  "read":1.71,"time":1549503000000,"used":1.322,"user":0.094,"wait":0.007,"cache":4.04,"write":7.76,"system":0.03,"buffers":2.2,"inbound":209,"outbound":487 },
   {  "read":1.69,"time":1549506600000,"used":1.319,"user":0.088,"wait":0.008,"cache":7.34,"write":7.84,"system":0.033,"buffers":2.27,"inbound":229,"outbound":516 },
   {  "read":1.02,"time":1549510200000,"used":1.315,"user":0.083,"wait":0.005,"cache":8.37,"write":7.87,"system":0.035,"buffers":2.34,"inbound":205,"outbound":563 },
   {  "read":1.06,"time":1549513800000,"used":1.314,"user":0.079,"wait":0.007,"cache":7.27,"write":7.24,"system":0.032,"buffers":2.31,"inbound":229,"outbound":508 },
   {  "read":1.08,"time":1549517400000,"used":1.311,"user":0.083,"wait":0.008,"cache":7.11,"write":7.21,"system":0.043,"buffers":2.24,"inbound":253,"outbound":477 },
   {  "read":1.17,"time":1549521000000,"used":1.303,"user":0.091,"wait":0.007,"cache":5.85,"write":7.13,"system":0.046,"buffers":2.17,"inbound":233,"outbound":532 },
   {  "read":1.1,"time":1549524600000,"used":1.3,"user":0.088,"wait":0.007,"cache":7.82,"write":7.09,"system":0.044,"buffers":2.34,"inbound":255,"outbound":485 },
   {  "read":1.16,"time":1549528200000,"used":1.338,"user":0.076,"wait":0.005,"cache":4.59,"write":6.98,"system":0.041,"buffers":2.32,"inbound":243,"outbound":456 },
   {  "read":1.24,"time":1549531800000,"used":1.341,"user":0.064,"wait":0.006,"cache":5.35,"write":6.73,"system":0.04,"buffers":2.28,"inbound":257,"outbound":424 },
   {  "read":1.38,"time":1549535400000,"used":1.349,"user":0.073,"wait":0.003,"cache":7.02,"write":6.78,"system":0.038,"buffers":2.25,"inbound":298,"outbound":471 },
   {  "read":1.48,"time":1549539000000,"used":1.352,"user":0.079,"wait":0.005,"cache":7.6,"write":6.68,"system":0.039,"buffers":2.23,"inbound":288,"outbound":402 },
   {  "read":1.58,"time":1549542600000,"used":1.353,"user":0.076,"wait":0.004,"cache":8.85,"write":6.6,"system":0.035,"buffers":2.19,"inbound":293,"outbound":362 },
   {  "read":1.38,"time":1549546200000,"used":1.357,"user":0.068,"wait":0.007,"cache":7.59,"write":6.3,"system":0.041,"buffers":2.35,"inbound":262,"outbound":332 },
   {  "read":1.58,"time":1549549800000,"used":1.36,"user":0.062,"wait":0.009,"cache":8.13,"write":6.39,"system":0.039,"buffers":2.28,"inbound":243,"outbound":432 },
   {  "read":0.69,"time":1549553400000,"used":1.363,"user":0.055,"wait":0.005,"cache":4.88,"write":5.99,"system":0.032,"buffers":2.24,"inbound":283,"outbound":517 },
   {  "read":0.38,"time":1549557000000,"used":1.383,"user":0.073,"wait":0.004,"cache":4.34,"write":5.78,"system":0.027,"buffers":2.14,"inbound":298,"outbound":527 },
   {  "read":1.63,"time":1549560600000,"used":1.393,"user":0.048,"wait":0.006,"cache":5.6,"write":6.28,"system":0.033,"buffers":2.11,"inbound":281,"outbound":576 }
]                        

Chart Customizations

In the above example, we are using following events and methods which you can further customize if required.
Chart - rangeChanging, rangeChanged
ToolTip - updated, hidden, showAtX, hide
Crosshair - updated, hidden, showAt, hide

Quick Links

  • Chart Docs
  • StockChart Docs
  • About Us
  • FAQs

Server Side Technologies

  • ASP.NET MVC Charts
  • PHP Charts
  • JSP Charts
  • Spring MVC Charts

Front Side Technologies

  • JavaScript Charts
  • jQuery Charts
  • React Charts
  • Angular Charts
  • JavaScript StockCharts

Contact

  • Fenopix, Inc.
  • 2093 Philadelphia Pike,
  • #5678, Claymont,
  • Delaware 19703
  • United States Of America

©2025 Fenopix Privacy Policy Cookies Policy Careers