File
Login or Register via GitHub
<html> <head> <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script> <link href="https://nightly.datatables.net/css/dataTables.dataTables.css" rel="stylesheet" type="text/css" /> <script src="https://nightly.datatables.net/js/dataTables.js"></script><script src="https://cdn.datatables.net/rowgroup/1.5.0/js/dataTables.rowGroup.min.js"></script><link href="https://cdn.datatables.net/rowgroup/1.5.0/css/rowGroup.dataTables.min.css" rel="stylesheet" type="text/css" /> <link href="https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css" rel="stylesheet"> <script src="https://cdn.jsdelivr.net/npm/luxon@3.5.0/build/global/luxon.min.js"></script> <meta charset=utf-8 /> <title>DataTables - JS Bin</title> </head> <body> <div class="container"> <table id="example" class="table is-hoverable is-narrow font80rem"> <!-- <thead> <tr> <th>year</th> <th>month</th> <th>reel</th> <th>average</th> <th>% prog.</th> <th>arrow prog.</th> </tr> </thead> --> <tfoot> <tr> <th></th> <th class="has-text-weight-medium totalIndicateur">Total</th> <th class="has-text-weight-medium totalIndicateur"></th> <th></th> <th></th> <th></th> </tr> <tr> <th></th> <th class="has-text-weight-medium moyenneIndicateur">Moyenne</th> <th class="has-text-weight-medium moyenneIndicateur"></th> <th></th> <th></th> <th></th> </tr> </tfoot> </table> </div> </body></html>body { font: 90%/1.45em "Helvetica Neue", HelveticaNeue, Verdana, Arial, Helvetica, sans-serif; margin: 0; padding: 0; color: #333; background-color: #fff;}span.dt-column-order { display: none;}// variables pour le tableau (luxon)var DateTime = luxon.DateTime;// période du tableau var firstYear = 2002; var lastYear = 2016; var nombreAnnees = lastYear-firstYear;var table = new DataTable("example", { data: dataset,// language: myLanguage, pageLength: -1, caption: '<span class="is-pulled-left has-text-weight-medium black font85rem">' + firstYear + ' à ' + lastYear +'</span>', layout: { topStart: null, topEnd: null, bottomStart: null, bottomEnd: null }, columns: [ { data: 'annee'}, { data: 'mois', render: function ( data, type, row ) { if (type === "sort") { return data; } if (type === "display") { return DateTime.local(row['annee'], data, 1).monthLong; } } }, { data: 'reel'}, { data: null, defaultContent: ''}, { data: null, defaultContent: ''}, { data: null, defaultContent: ''} ], columnDefs: [ { visible: false, target: 0 }, // colonne année masquée { orderable: false, targets: '_all' }, { className: 'has-background-white white-space-nowrap', targets: '_all' }, { className: 'is-capitalized', target: 1 }, { render: DataTable.render.number(' ', null, 0, '' , ''), targets : [2, 3] }, // { className: 'has-background-white has-text-right white-space-nowrap', target : 1 }, ], order: [[0, 'desc'], [1, 'asc']], rowGroup: { dataSrc: ['annee'], startClassName: 'annee hasChild has-background-white has-text-weight-semibold', startRender: function ( rows, group, level ) { // var groupNumber = groupNumber+1; // console.log (groupNumber); var totalAnnuel = rows .data() .pluck('reel') .reduce(function (a, b) { return a + b * 1; }, 0) ; // MONTH AVERAGE (moyenne mensuelle calculée sur le nombre de mois enregistrés pour l'année) var moyenneMensuelle = totalAnnuel / rows.count() ; // YEAR PROGRESSION = ( (monthAverage - monthAverage of the year before) / monthAverage of the year before ) * 100 // EXAMPLE FOR 2010 : ( (2010 monthAverage - 2009 monthAverage ) / 2009 monthAverage ) * 100 // « NOTHING » FOR THE LAST YEAR var progression = 20; // variables pour gérer les différences de présentation de la progression var progressionCss = ''; var progressionArrow = ''; if (progression > 10) { progressionCss = 'olivedrab'; progressionArrow = '↑'; // UPWARDS ARROW } if (progression < 10 && progression > 1) { progressionCss = 'olivedrab'; progressionArrow = '↗'; // NORTH EAST ARROW } if (progression <= 1 && progression >= -1) { progressionCss = 'steelblue'; progressionArrow = '⇌'; // RIGHTWARDS HARPOON OVER LEFTWARDS HARPOON } if (progression <= -1 && progression > -10) { progressionCss = 'firebrick'; progressionArrow = '↘'; // SOUTH EAST ARROW } if (progression < -10) { progressionCss = 'firebrick'; progressionArrow = '↓'; // DOWNWARDS ARROW } // formatage des montants totalAnnuel = DataTable.render.number(' ', null, 0, null, '').display(totalAnnuel); moyenneMensuelle = DataTable.render.number(' ', null, 0, null, '').display(moyenneMensuelle); progression = DataTable.render.number(' ', null, 2, null , ' %').display(progression); return $('<tr/>') .append('<td class="is-vcentered">' + group + '</td>') .append('<td class="is-vcentered white-space-nowrap has-text-right">' + totalAnnuel + '</td>') .append('<td class="is-vcentered white-space-nowrap has-text-right moyenneIndicateur">' + moyenneMensuelle + '</td>') .append('<td class="is-vcentered white-space-nowrap has-text-right ' + progressionCss + '">' + progression + '</td>') .append('<td class="is-vcentered white-space-nowrap has-text-right flecheProgression ' + progressionCss + '">' + progressionArrow + '</td>'); } }, footerCallback: function (row, data, start, end, display) { var api = this.api(); var pageInfo = api.page.info(); var globalRealise = api .column(2, { page: 'current' }) .data() .reduce(function (a, b) { return a + b * 1; }, 0); var globalMoyenne = globalRealise / nombreAnnees ; // formatage : DataTable.render.number(thousands, decimal, precision, prefix, postfix) globalRealise = DataTable.render.number(' ', null, '', null, '').display(globalRealise); globalMoyenne = DataTable.render.number(' ', null, '', null, '').display(globalMoyenne); // update footer $(api.column(1).footer()).html('Total'); $(api.column(2).footer()).html(globalRealise); $(api.column(1).footer(1)).html('Moyenne'); $(api.column(2).footer(1)).html(globalMoyenne); } });var dataset = [ { "annee": 2002, "mois": 1, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2002, "mois": 2, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2002, "mois": 3, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2002, "mois": 4, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2002, "mois": 5, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2002, "mois": 6, "reel": 0, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2002, "mois": 7, "reel": 44749, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2002, "mois": 8, "reel": 32570, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2002, "mois": 9, "reel": 74074, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2002, "mois": 10, "reel": 82420, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2002, "mois": 11, "reel": 68220, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2002, "mois": 12, "reel": 104282, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2003, "mois": 1, "reel": 182498, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2003, "mois": 2, "reel": 208482, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2003, "mois": 3, "reel": 174615, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2003, "mois": 4, "reel": 185301, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2003, "mois": 5, "reel": 179970, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2003, "mois": 6, "reel": 217135, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2003, "mois": 7, "reel": 289939, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2003, "mois": 8, "reel": 96683, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2003, "mois": 9, "reel": 190883, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2003, "mois": 10, "reel": 192450, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2003, "mois": 11, "reel": 187405, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2003, "mois": 12, "reel": 205796, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2004, "mois": 1, "reel": 151140, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2004, "mois": 2, "reel": 219005, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2004, "mois": 3, "reel": 207995, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2004, "mois": 4, "reel": 214158, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2004, "mois": 5, "reel": 184952, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2004, "mois": 6, "reel": 123230, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2004, "mois": 7, "reel": 263095, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2004, "mois": 8, "reel": 121263, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2004, "mois": 9, "reel": 222946, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2004, "mois": 10, "reel": 214473, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2004, "mois": 11, "reel": 168345, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2004, "mois": 12, "reel": 224861, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2005, "mois": 1, "reel": 193028, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2005, "mois": 2, "reel": 224890, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2005, "mois": 3, "reel": 239092, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2005, "mois": 4, "reel": 256583, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2005, "mois": 5, "reel": 242784, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2005, "mois": 6, "reel": 221898, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2005, "mois": 7, "reel": 234245, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2005, "mois": 8, "reel": 114555, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2005, "mois": 9, "reel": 163756, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2005, "mois": 10, "reel": 228663, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2005, "mois": 11, "reel": 249590, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2005, "mois": 12, "reel": 192617, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2006, "mois": 1, "reel": 218145, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2006, "mois": 2, "reel": 202209, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2006, "mois": 3, "reel": 311683, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2006, "mois": 4, "reel": 202311, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2006, "mois": 5, "reel": 166923, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2006, "mois": 6, "reel": 266391, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2006, "mois": 7, "reel": 281654, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2006, "mois": 8, "reel": 139974, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2006, "mois": 9, "reel": 177519, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2006, "mois": 10, "reel": 325809, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2006, "mois": 11, "reel": 196495, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2006, "mois": 12, "reel": 243625, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2007, "mois": 1, "reel": 271617, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2007, "mois": 2, "reel": 288661, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2007, "mois": 3, "reel": 246062, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2007, "mois": 4, "reel": 217502, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2007, "mois": 5, "reel": 170941, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2007, "mois": 6, "reel": 339308, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2007, "mois": 7, "reel": 333573, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2007, "mois": 8, "reel": 147391, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2007, "mois": 9, "reel": 222513, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2007, "mois": 10, "reel": 209556, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2007, "mois": 11, "reel": 288672, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2007, "mois": 12, "reel": 183234, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2008, "mois": 1, "reel": 192785, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2008, "mois": 2, "reel": 390987, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2008, "mois": 3, "reel": 203476, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2008, "mois": 4, "reel": 281407, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2008, "mois": 5, "reel": 188243, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2008, "mois": 6, "reel": 224722, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2008, "mois": 7, "reel": 233418, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2008, "mois": 8, "reel": 144381, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2008, "mois": 9, "reel": 191884, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2008, "mois": 10, "reel": 248179, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2008, "mois": 11, "reel": 229753, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2008, "mois": 12, "reel": 150551, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2009, "mois": 1, "reel": 202349, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2009, "mois": 2, "reel": 171409, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2009, "mois": 3, "reel": 140406, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2009, "mois": 4, "reel": 105475, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2009, "mois": 5, "reel": 122080, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2009, "mois": 6, "reel": 175121, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2009, "mois": 7, "reel": 153826, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2009, "mois": 8, "reel": 166248, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2009, "mois": 9, "reel": 199865, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2009, "mois": 10, "reel": 249559, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2009, "mois": 11, "reel": 196688, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2009, "mois": 12, "reel": 200771, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2010, "mois": 1, "reel": 166056, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2010, "mois": 2, "reel": 229429, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2010, "mois": 3, "reel": 287085, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2010, "mois": 4, "reel": 193002, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2010, "mois": 5, "reel": 141695, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2010, "mois": 6, "reel": 347197, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2010, "mois": 7, "reel": 290687, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2010, "mois": 8, "reel": 185148, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2010, "mois": 9, "reel": 254631, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2010, "mois": 10, "reel": 262494, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2010, "mois": 11, "reel": 251491, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2010, "mois": 12, "reel": 226987, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2011, "mois": 1, "reel": 304078, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2011, "mois": 2, "reel": 266716, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2011, "mois": 3, "reel": 290153, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2011, "mois": 4, "reel": 261751, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2011, "mois": 5, "reel": 250953, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2011, "mois": 6, "reel": 313366, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2011, "mois": 7, "reel": 216393, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2011, "mois": 8, "reel": 209083, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2011, "mois": 9, "reel": 274028, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2011, "mois": 10, "reel": 293985, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2011, "mois": 11, "reel": 284297, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2011, "mois": 12, "reel": 294682, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2012, "mois": 1, "reel": 362914, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2012, "mois": 2, "reel": 285665, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2012, "mois": 3, "reel": 261606, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2012, "mois": 4, "reel": 291647, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2012, "mois": 5, "reel": 210489, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2012, "mois": 6, "reel": 252194, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2012, "mois": 7, "reel": 327076, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2012, "mois": 8, "reel": 195868, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2012, "mois": 9, "reel": 308419, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2012, "mois": 10, "reel": 289379, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2012, "mois": 11, "reel": 350205, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2012, "mois": 12, "reel": 229024, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2013, "mois": 1, "reel": 308194, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2013, "mois": 2, "reel": 260624, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2013, "mois": 3, "reel": 263250, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2013, "mois": 4, "reel": 339323, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2013, "mois": 5, "reel": 286078, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2013, "mois": 6, "reel": 319748, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2013, "mois": 7, "reel": 364028, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2013, "mois": 8, "reel": 197657, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2013, "mois": 9, "reel": 240427, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2013, "mois": 10, "reel": 349386, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2013, "mois": 11, "reel": 209905, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2013, "mois": 12, "reel": 195494, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2014, "mois": 1, "reel": 290635, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2014, "mois": 2, "reel": 307416, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2014, "mois": 3, "reel": 302587, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2014, "mois": 4, "reel": 298895, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2014, "mois": 5, "reel": 228456, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2014, "mois": 6, "reel": 278354, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2014, "mois": 7, "reel": 300198, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2014, "mois": 8, "reel": 195854, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2014, "mois": 9, "reel": 268296, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2014, "mois": 10, "reel": 254894, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2014, "mois": 11, "reel": 248659, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2014, "mois": 12, "reel": 175821, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2015, "mois": 1, "reel": 259413, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2015, "mois": 2, "reel": 207990, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2015, "mois": 3, "reel": 269622, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2015, "mois": 4, "reel": 246948, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2015, "mois": 5, "reel": 212569, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2015, "mois": 6, "reel": 295251, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2015, "mois": 7, "reel": 271384, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2015, "mois": 8, "reel": 160568, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2015, "mois": 9, "reel": 277314, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2015, "mois": 10, "reel": 266347, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2015, "mois": 11, "reel": 200431, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2015, "mois": 12, "reel": 291564, "indicateur": { "__KEY": "vps" }, "trimestre": 4 }, { "annee": 2016, "mois": 1, "reel": 235330, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2016, "mois": 2, "reel": 281426, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2016, "mois": 3, "reel": 269178, "indicateur": { "__KEY": "vps" }, "trimestre": 1 }, { "annee": 2016, "mois": 4, "reel": 282518, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2016, "mois": 5, "reel": 150553, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2016, "mois": 6, "reel": 376332, "indicateur": { "__KEY": "vps" }, "trimestre": 2 }, { "annee": 2016, "mois": 7, "reel": 45311, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }, { "annee": 2016, "mois": 9, "reel": 14909, "indicateur": { "__KEY": "vps" }, "trimestre": 3 }];
You can jump to the latest bin by adding /latest to your URL
| Shortcut | Action |
|---|---|
| ctrl + [num] | Toggle nth panel |
| ctrl + 0 | Close focused panel |
| ctrl + enter | Re-render output. If console visible: run JS in console |
| Ctrl + l | Clear the console |
| ctrl + / | Toggle comment on selected lines |
| ctrl + [ | Indents selected lines |
| ctrl + ] | Unindents selected lines |
| tab | Code complete & Emmet expand |
| ctrl + s | Save & lock current Bin from further changes |
| ctrl + shift + s | Clone Bin |
| ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts | |
| URL | Action |
|---|---|
| / | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
| /edit | Edit the current bin |
| /watch | Follow a Code Casting session |
| /embed | Create an embeddable version of the bin |
| /latest | Load the very latest bin (/latest goes in place of the revision) |
| /[username]/last | View the last edited bin for this user |
| /[username]/last/edit | Edit the last edited bin for this user |
| /[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
| /quiet | Remove analytics and edit button from rendered output |
| .js | Load only the JavaScript for a bin |
| .css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. | |