SHARE
TWEET

Untitled

a guest Jan 9th, 2020 70 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function() {
  2.   $.ajax({
  3.      cache: false,
  4.      url: '/data/grafy.json',
  5.      dataType: "JSON",
  6.      success: function(json){
  7.        if($("#puda-chart").length && typeof json["puda-chart"] != 'undefined') {
  8.          chart_render_puda(json["puda-chart"]);
  9.        }                                                                                      
  10.      }
  11.   });
  12.  
  13. });
  14.  
  15. function chart_render_puda(data) {
  16.   var areaData = {
  17.     labels: data['labels'],
  18.     datasets: [{
  19.         data: data[0]['datasets']['data'],
  20.         backgroundColor: ['rgba(255, 0, 0, .0)'],
  21.         borderColor: '#ff0000',
  22.         borderWidth: 2,
  23.         fill: true,
  24.         label: data[0]['datasets']['label']
  25.       },
  26.       {
  27.         data: data[1]['datasets']['data'],
  28.         backgroundColor: ['rgba(255, 128, 0, .0)'],
  29.         borderColor: '#ff8000',
  30.         borderWidth: 2,
  31.         fill: true,
  32.         label: data[1]['datasets']['label']
  33.       },
  34.       {
  35.         data: data[2]['datasets']['data'],
  36.         backgroundColor: ['rgba(0, 128, 0, .0)'],
  37.         borderColor: '#008000',
  38.         borderWidth: 2,
  39.         fill: true,
  40.         label: data[2]['datasets']['label']
  41.       },
  42.       {
  43.         data: data[3]['datasets']['data'],
  44.         backgroundColor: ['rgba(103, 103, 103, .0)'],
  45.         borderColor: '#676767',
  46.         borderWidth: 2,
  47.         fill: true,
  48.         label: data[3]['datasets']['label']
  49.       }            
  50.     ]
  51.   };
  52.   var areaOptions = {
  53.     responsive: true,
  54.     maintainAspectRatio: true,
  55.     plugins: {
  56.       filler: {
  57.         propagate: false
  58.       }
  59.     },
  60.     scales: {
  61.       xAxes: [{
  62.         display: false,
  63.         ticks: {
  64.           display: true
  65.         },
  66.         gridLines: {
  67.           display: false,
  68.           drawBorder: false,
  69.           color: 'transparent',
  70.           zeroLineColor: '#eeeeee'
  71.         }
  72.       }],
  73.       yAxes: [{
  74.         display: false,
  75.         ticks: {
  76.           display: true,
  77.           autoSkip: false,
  78.           maxRotation: 0,
  79.           stepSize: 100,
  80.           min: Math.min.apply(this, data[0]['datasets']['data']) - 0.5,
  81.           max: Math.max.apply(this, data[0]['datasets']['data']) + 0.5
  82.         },
  83.         gridLines: {
  84.           drawBorder: false
  85.         }
  86.       }]
  87.     },
  88.     legend: {
  89.       display: false
  90.     },
  91.     tooltips: {
  92.       mode: 'index',
  93.       intersect: false,
  94.     },
  95.    hover: {
  96.       mode: 'nearest',
  97.       intersect: true
  98.     },
  99.     elements: {
  100.       line: {
  101.         tension: .35
  102.       },
  103.       point: {
  104.         radius: 3
  105.       }
  106.     }
  107.   }
  108.  
  109.   var totalSalesCanvas = $("#puda-chart").get(0).getContext("2d");
  110.   var totalSales = new Chart(totalSalesCanvas, {
  111.     type: 'line',
  112.     data: areaData,
  113.     options: areaOptions
  114.   });
  115. }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top