Last active
December 1, 2016 16:11
-
-
Save gordonhatusupy/27ffd36a31b888d165cc77ea19842bcd to your computer and use it in GitHub Desktop.
viz_navigator
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| d3.json('data.json', function(data){ | |
| var datasource = data; | |
| //svg config | |
| var w_navigator = 960; | |
| var h_navigator = 130; | |
| var padding = 5; | |
| console.log(datasource) | |
| var extent = d3.extent(datasource, function(d){ return d.total_sales}) | |
| var colourScale = d3.scaleLinear() | |
| .domain(extent) | |
| .range(['#212121', '#FF71C6']) | |
| var navigator = d3.select('.viz_container') | |
| .append('svg') | |
| .classed('navigator', 'true') | |
| .attr('width', w_navigator) | |
| .attr('height', h_navigator) | |
| var ext_data = d3.extent(datasource, function(d){ | |
| return d.total_sales; | |
| }); | |
| var xScale = d3.scaleLinear() | |
| .domain([0, datasource.length]) | |
| .range([5, (w_navigator + 5) - 0]) | |
| var yScale_current = d3.scaleLinear() | |
| .domain(ext_data) | |
| .range([h_navigator - 10, 15]) | |
| var sparkline_current = d3.line() | |
| .x(function(d, i){ return xScale(i)}) | |
| .y(function(d){ return yScale_current(d.total_sales)}) | |
| navigator.append('svg:path') | |
| .datum(datasource) | |
| .attr('d', sparkline_current) | |
| .attr('class', 'sparkline_current') | |
| .attr('stroke-linecap', 'round') | |
| .attr('stroke-linejoin', 'round') | |
| .attr('stroke', '#fff') | |
| var markers = navigator.selectAll('circle') | |
| .data(datasource) | |
| .enter() | |
| .append('circle') | |
| .attr('r', 3) | |
| .attr('fill', '#FF71C6') | |
| .attr('cx', function(d, i){ | |
| return xScale(i) | |
| }) | |
| .attr('cy', function(d, i){ | |
| return yScale_current(d.total_sales) | |
| }) | |
| var rects = navigator.selectAll('rect') | |
| .data(datasource) | |
| .enter().append('a') | |
| .attr("xlink:href", function(d, i){ | |
| return '#data' + (i - 8) | |
| }) | |
| .append('rect') | |
| .attr('opacity', 1) | |
| .attr('class', function(d, i){ | |
| return 'data' + i | |
| }) | |
| .attr('width', function(d, i){ | |
| return (w_navigator - padding) / datasource.length | |
| }) | |
| .attr('height', h_navigator) | |
| .attr('fill', function(d){ | |
| return colourScale(d.total_sales) | |
| }) | |
| .attr('x', function(d, i){ | |
| return i * (w_navigator / datasource.length) | |
| }) | |
| .attr('y', 10) | |
| .on("mouseover", function(d,i) { | |
| d3.select(this) | |
| .attr('fill', '#FFF7B1') | |
| d3.selectAll('.data' + i) | |
| .classed('active', true) | |
| }) | |
| .on('mouseout', function(d, i){ | |
| d3.select(this) | |
| .attr('fill', function(d, i){ return colourScale(d.total_sales)}) | |
| d3.selectAll('.data' + i) | |
| .classed('active', false) | |
| }) | |
| .on('click', function(d, i){ | |
| }) | |
| }); | |
| d3.json('data.json', function (error,data) { | |
| function tabulate(data, columns) { | |
| var table = d3.select('.table_container').append('table') | |
| var thead = table.append('thead') | |
| var tbody = table.append('tbody'); | |
| // append the header row | |
| thead.append('tr') | |
| .selectAll('th') | |
| .data(columns).enter() | |
| .append('th') | |
| .text(function (column) { return column; }); | |
| // create a row for each object in the data | |
| var rows = tbody.selectAll('tr') | |
| .data(data) | |
| .enter() | |
| .append('tr') | |
| .attr('class', function(d, i){ | |
| return 'data' + i | |
| }) | |
| .on("mouseover", function(d,i) { | |
| d3.select(this) | |
| .classed('active', true) | |
| d3.select('.viz_container').selectAll('.data' + i) | |
| .classed('active_rect', true) | |
| }) | |
| .on('mouseout', function(d, i){ | |
| d3.select(this) | |
| .classed('active', false) | |
| d3.select('.viz_container').selectAll('.data' + i) | |
| .classed('active_rect', false) | |
| }) | |
| rows.append('td').append('a') | |
| .attr("name", function(d, i){ | |
| return 'data' + i | |
| }) | |
| // create a cell in each row for each column | |
| var cells = rows.selectAll('td') | |
| .data(function (row) { | |
| return columns.map(function (column) { | |
| return {column: column, value: row[column]}; | |
| }); | |
| }) | |
| .enter() | |
| .append('td') | |
| .text(function (d) { return d.value; }); | |
| return table; | |
| } | |
| // render the table(s) | |
| tabulate(data, ['','day', 'orders', 'gross_sales', 'discounts', 'refunds','net_sales', 'shipping','taxes', 'total_sales']); // 2 column table | |
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| day | total_sales | |
|---|---|---|
| 2016-01-01 | 200.00 | |
| 2016-01-02 | 0.00 | |
| 2016-01-03 | 0.00 | |
| 2016-01-04 | 0.00 | |
| 2016-01-05 | 0.00 | |
| 2016-01-06 | 454.59 | |
| 2016-01-07 | 184.30 | |
| 2016-01-08 | 0.00 | |
| 2016-01-09 | 0.00 | |
| 2016-01-10 | 0.00 | |
| 2016-01-11 | 0.00 | |
| 2016-01-12 | 0.00 | |
| 2016-01-13 | 201.59 | |
| 2016-01-14 | 0.00 | |
| 2016-01-15 | 100.57 | |
| 2016-01-16 | 0.00 | |
| 2016-01-17 | 0.00 | |
| 2016-01-18 | 0.00 | |
| 2016-01-19 | 0.00 | |
| 2016-01-20 | 0.00 | |
| 2016-01-21 | 32.77 | |
| 2016-01-22 | 0.00 | |
| 2016-01-23 | 0.00 | |
| 2016-01-24 | 0.00 | |
| 2016-01-25 | 0.00 | |
| 2016-01-26 | 0.00 | |
| 2016-01-27 | 0.00 | |
| 2016-01-28 | 0.00 | |
| 2016-01-29 | 0.00 | |
| 2016-01-30 | 0.00 | |
| 2016-01-31 | 230.00 | |
| 2016-02-01 | 623.00 | |
| 2016-02-02 | 0.00 | |
| 2016-02-03 | 0.00 | |
| 2016-02-04 | 44.07 | |
| 2016-02-05 | 0.00 | |
| 2016-02-06 | 0.00 | |
| 2016-02-07 | 0.00 | |
| 2016-02-08 | 0.00 | |
| 2016-02-09 | 230.40 | |
| 2016-02-10 | 0.00 | |
| 2016-02-11 | 0.00 | |
| 2016-02-12 | 0.00 | |
| 2016-02-13 | 0.00 | |
| 2016-02-14 | 0.00 | |
| 2016-02-15 | 0.00 | |
| 2016-02-16 | -230.40 | |
| 2016-02-17 | 88.14 | |
| 2016-02-18 | 0.00 | |
| 2016-02-19 | 548.20 | |
| 2016-02-20 | 0.00 | |
| 2016-02-21 | 0.00 | |
| 2016-02-22 | 0.00 | |
| 2016-02-23 | 44.07 | |
| 2016-02-24 | 876.84 | |
| 2016-02-25 | 32.77 | |
| 2016-02-26 | 379.87 | |
| 2016-02-27 | 0.00 | |
| 2016-02-28 | 0.00 | |
| 2016-02-29 | 628.28 | |
| 2016-03-01 | 359.34 | |
| 2016-03-02 | 348.04 | |
| 2016-03-03 | -32.77 | |
| 2016-03-04 | 88.14 | |
| 2016-03-05 | 0.00 | |
| 2016-03-06 | 0.00 | |
| 2016-03-07 | 0.00 | |
| 2016-03-08 | 0.00 | |
| 2016-03-09 | 0.00 | |
| 2016-03-10 | 0.00 | |
| 2016-03-11 | 0.00 | |
| 2016-03-12 | 0.00 | |
| 2016-03-13 | 0.00 | |
| 2016-03-14 | 0.00 | |
| 2016-03-15 | 55.37 | |
| 2016-03-16 | 0.00 | |
| 2016-03-17 | 0.00 | |
| 2016-03-18 | 0.00 | |
| 2016-03-19 | 0.00 | |
| 2016-03-20 | 0.00 | |
| 2016-03-21 | 0.00 | |
| 2016-03-22 | 0.00 | |
| 2016-03-23 | 88.14 | |
| 2016-03-24 | 0.00 | |
| 2016-03-25 | 0.00 | |
| 2016-03-26 | 0.00 | |
| 2016-03-27 | 0.00 | |
| 2016-03-28 | 0.00 | |
| 2016-03-29 | 0.00 | |
| 2016-03-30 | 702.62 | |
| 2016-03-31 | 1680.75 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [ | |
| { | |
| "day": "2016-07-01", | |
| "orders": 28, | |
| "gross_sales": 1300.57, | |
| "discounts": -34.17, | |
| "refunds": 0, | |
| "net_sales": 1266.4, | |
| "shipping": 44.8, | |
| "taxes": 1.83, | |
| "total_sales": 1313.03 | |
| }, | |
| { | |
| "day": "2016-07-02", | |
| "orders": 7, | |
| "gross_sales": 167.34, | |
| "discounts": -6.13, | |
| "refunds": 0, | |
| "net_sales": 161.21, | |
| "shipping": 33.6, | |
| "taxes": 0, | |
| "total_sales": 194.81 | |
| }, | |
| { | |
| "day": "2016-07-03", | |
| "orders": 5, | |
| "gross_sales": 233.24, | |
| "discounts": -13.08, | |
| "refunds": 0, | |
| "net_sales": 220.16, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 225.76 | |
| }, | |
| { | |
| "day": "2016-07-04", | |
| "orders": 13, | |
| "gross_sales": 438.06, | |
| "discounts": -14.62, | |
| "refunds": 0, | |
| "net_sales": 423.44, | |
| "shipping": 33.6, | |
| "taxes": 0, | |
| "total_sales": 457.04 | |
| }, | |
| { | |
| "day": "2016-07-05", | |
| "orders": 13, | |
| "gross_sales": 911.53, | |
| "discounts": -69.33, | |
| "refunds": 0, | |
| "net_sales": 842.2, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 847.8 | |
| }, | |
| { | |
| "day": "2016-07-06", | |
| "orders": 17, | |
| "gross_sales": 835.98, | |
| "discounts": -25.8, | |
| "refunds": 0, | |
| "net_sales": 810.18, | |
| "shipping": 22.4, | |
| "taxes": 0, | |
| "total_sales": 832.58 | |
| }, | |
| { | |
| "day": "2016-07-07", | |
| "orders": 10, | |
| "gross_sales": 4920.58, | |
| "discounts": -2229.81, | |
| "refunds": -69.9, | |
| "net_sales": 2620.87, | |
| "shipping": 128.49, | |
| "taxes": 13.95, | |
| "total_sales": 2763.31 | |
| }, | |
| { | |
| "day": "2016-07-08", | |
| "orders": 5, | |
| "gross_sales": 118.37, | |
| "discounts": -7.72, | |
| "refunds": 0, | |
| "net_sales": 110.65, | |
| "shipping": 22.4, | |
| "taxes": 0, | |
| "total_sales": 133.05 | |
| }, | |
| { | |
| "day": "2016-07-09", | |
| "orders": 6, | |
| "gross_sales": 402.01, | |
| "discounts": -17.47, | |
| "refunds": 0, | |
| "net_sales": 384.54, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 390.14 | |
| }, | |
| { | |
| "day": "2016-07-10", | |
| "orders": 7, | |
| "gross_sales": 330.56, | |
| "discounts": -19.51, | |
| "refunds": 0, | |
| "net_sales": 311.05, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 327.85 | |
| }, | |
| { | |
| "day": "2016-07-11", | |
| "orders": 6, | |
| "gross_sales": 299.6, | |
| "discounts": -16.48, | |
| "refunds": 0, | |
| "net_sales": 283.12, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 283.12 | |
| }, | |
| { | |
| "day": "2016-07-12", | |
| "orders": 6, | |
| "gross_sales": 352.18, | |
| "discounts": -28.49, | |
| "refunds": 0, | |
| "net_sales": 323.69, | |
| "shipping": 16.2, | |
| "taxes": 0, | |
| "total_sales": 339.89 | |
| }, | |
| { | |
| "day": "2016-07-13", | |
| "orders": 52, | |
| "gross_sales": 2714.09, | |
| "discounts": -330.64, | |
| "refunds": 0, | |
| "net_sales": 2383.45, | |
| "shipping": 28, | |
| "taxes": 4.35, | |
| "total_sales": 2415.8 | |
| }, | |
| { | |
| "day": "2016-07-14", | |
| "orders": 21, | |
| "gross_sales": 1338.84, | |
| "discounts": -116.59, | |
| "refunds": -6.99, | |
| "net_sales": 1215.26, | |
| "shipping": 5.6, | |
| "taxes": 21.78, | |
| "total_sales": 1242.64 | |
| }, | |
| { | |
| "day": "2016-07-15", | |
| "orders": 14, | |
| "gross_sales": 747.42, | |
| "discounts": -69.9, | |
| "refunds": 0, | |
| "net_sales": 677.52, | |
| "shipping": 10.6, | |
| "taxes": 0, | |
| "total_sales": 688.12 | |
| }, | |
| { | |
| "day": "2016-07-16", | |
| "orders": 16, | |
| "gross_sales": 861.49, | |
| "discounts": -50.41, | |
| "refunds": 0, | |
| "net_sales": 811.08, | |
| "shipping": 22.4, | |
| "taxes": 0, | |
| "total_sales": 833.48 | |
| }, | |
| { | |
| "day": "2016-07-17", | |
| "orders": 12, | |
| "gross_sales": 589.39, | |
| "discounts": -49.55, | |
| "refunds": 0, | |
| "net_sales": 539.84, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 545.44 | |
| }, | |
| { | |
| "day": "2016-07-18", | |
| "orders": 14, | |
| "gross_sales": 896.96, | |
| "discounts": -83.8, | |
| "refunds": 0, | |
| "net_sales": 813.16, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 829.96 | |
| }, | |
| { | |
| "day": "2016-07-19", | |
| "orders": 7, | |
| "gross_sales": 543.38, | |
| "discounts": -33.95, | |
| "refunds": 0, | |
| "net_sales": 509.43, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 509.43 | |
| }, | |
| { | |
| "day": "2016-07-20", | |
| "orders": 36, | |
| "gross_sales": 2783.4, | |
| "discounts": -480.38, | |
| "refunds": 0, | |
| "net_sales": 2303.02, | |
| "shipping": 36.8, | |
| "taxes": 4.54, | |
| "total_sales": 2344.36 | |
| }, | |
| { | |
| "day": "2016-07-21", | |
| "orders": 24, | |
| "gross_sales": 1953.18, | |
| "discounts": -311.87, | |
| "refunds": 0, | |
| "net_sales": 1641.31, | |
| "shipping": 5.6, | |
| "taxes": 13.95, | |
| "total_sales": 1660.86 | |
| }, | |
| { | |
| "day": "2016-07-22", | |
| "orders": 13, | |
| "gross_sales": 874.5, | |
| "discounts": -85.26, | |
| "refunds": 0, | |
| "net_sales": 789.24, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 806.04 | |
| }, | |
| { | |
| "day": "2016-07-23", | |
| "orders": 9, | |
| "gross_sales": 612.25, | |
| "discounts": -67.31, | |
| "refunds": 0, | |
| "net_sales": 544.94, | |
| "shipping": 5.6, | |
| "taxes": 3.08, | |
| "total_sales": 553.62 | |
| }, | |
| { | |
| "day": "2016-07-24", | |
| "orders": 10, | |
| "gross_sales": 580.81, | |
| "discounts": -43.49, | |
| "refunds": -6.99, | |
| "net_sales": 530.33, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 535.93 | |
| }, | |
| { | |
| "day": "2016-07-25", | |
| "orders": 11, | |
| "gross_sales": 746.63, | |
| "discounts": -82.03, | |
| "refunds": 0, | |
| "net_sales": 664.6, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 670.2 | |
| }, | |
| { | |
| "day": "2016-07-26", | |
| "orders": 12, | |
| "gross_sales": 897.55, | |
| "discounts": -101.43, | |
| "refunds": 0, | |
| "net_sales": 796.12, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 807.32 | |
| }, | |
| { | |
| "day": "2016-07-27", | |
| "orders": 15, | |
| "gross_sales": 917.41, | |
| "discounts": -88.37, | |
| "refunds": 0, | |
| "net_sales": 829.04, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 834.64 | |
| }, | |
| { | |
| "day": "2016-07-28", | |
| "orders": 9, | |
| "gross_sales": 667.17, | |
| "discounts": -72.4, | |
| "refunds": 0, | |
| "net_sales": 594.77, | |
| "shipping": 11.2, | |
| "taxes": 13.95, | |
| "total_sales": 619.92 | |
| }, | |
| { | |
| "day": "2016-07-29", | |
| "orders": 6, | |
| "gross_sales": 381.49, | |
| "discounts": -42.94, | |
| "refunds": 0, | |
| "net_sales": 338.55, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 338.55 | |
| }, | |
| { | |
| "day": "2016-07-30", | |
| "orders": 2, | |
| "gross_sales": 108.88, | |
| "discounts": -8.49, | |
| "refunds": -7.9, | |
| "net_sales": 92.49, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 98.09 | |
| }, | |
| { | |
| "day": "2016-07-31", | |
| "orders": 6, | |
| "gross_sales": 508.42, | |
| "discounts": -3.39, | |
| "refunds": 0, | |
| "net_sales": 505.03, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 505.03 | |
| }, | |
| { | |
| "day": "2016-08-01", | |
| "orders": 8, | |
| "gross_sales": 294.14, | |
| "discounts": -6.14, | |
| "refunds": 0, | |
| "net_sales": 288, | |
| "shipping": 5.6, | |
| "taxes": 2.38, | |
| "total_sales": 295.98 | |
| }, | |
| { | |
| "day": "2016-08-02", | |
| "orders": 32, | |
| "gross_sales": 2169.44, | |
| "discounts": -303.17, | |
| "refunds": 0, | |
| "net_sales": 1866.27, | |
| "shipping": 5.6, | |
| "taxes": 2.52, | |
| "total_sales": 1874.39 | |
| }, | |
| { | |
| "day": "2016-08-03", | |
| "orders": 16, | |
| "gross_sales": 718.68, | |
| "discounts": -83.91, | |
| "refunds": 0, | |
| "net_sales": 634.77, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 645.97 | |
| }, | |
| { | |
| "day": "2016-08-04", | |
| "orders": 19, | |
| "gross_sales": 1462.15, | |
| "discounts": -280.83, | |
| "refunds": 0, | |
| "net_sales": 1181.32, | |
| "shipping": 0, | |
| "taxes": 13.95, | |
| "total_sales": 1195.27 | |
| }, | |
| { | |
| "day": "2016-08-05", | |
| "orders": 4, | |
| "gross_sales": 145.32, | |
| "discounts": -41.68, | |
| "refunds": 0, | |
| "net_sales": 103.64, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 109.24 | |
| }, | |
| { | |
| "day": "2016-08-06", | |
| "orders": 4, | |
| "gross_sales": 183.76, | |
| "discounts": -15.38, | |
| "refunds": 0, | |
| "net_sales": 168.38, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 168.38 | |
| }, | |
| { | |
| "day": "2016-08-07", | |
| "orders": 4, | |
| "gross_sales": 192.27, | |
| "discounts": -16.83, | |
| "refunds": 0, | |
| "net_sales": 175.44, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 175.44 | |
| }, | |
| { | |
| "day": "2016-08-08", | |
| "orders": 8, | |
| "gross_sales": 445.93, | |
| "discounts": -28.05, | |
| "refunds": -11.24, | |
| "net_sales": 406.64, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 406.64 | |
| }, | |
| { | |
| "day": "2016-08-09", | |
| "orders": 6, | |
| "gross_sales": 309.64, | |
| "discounts": -54.84, | |
| "refunds": -24.78, | |
| "net_sales": 230.02, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 235.62 | |
| }, | |
| { | |
| "day": "2016-08-10", | |
| "orders": 15, | |
| "gross_sales": 1296.56, | |
| "discounts": -124.44, | |
| "refunds": 0, | |
| "net_sales": 1172.12, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 1172.12 | |
| }, | |
| { | |
| "day": "2016-08-11", | |
| "orders": 7, | |
| "gross_sales": 506.25, | |
| "discounts": -36.15, | |
| "refunds": 0, | |
| "net_sales": 470.1, | |
| "shipping": 5.6, | |
| "taxes": 13.95, | |
| "total_sales": 489.65 | |
| }, | |
| { | |
| "day": "2016-08-12", | |
| "orders": 5, | |
| "gross_sales": 170.28, | |
| "discounts": -24.66, | |
| "refunds": 0, | |
| "net_sales": 145.62, | |
| "shipping": 16.2, | |
| "taxes": 0, | |
| "total_sales": 161.82 | |
| }, | |
| { | |
| "day": "2016-08-13", | |
| "orders": 7, | |
| "gross_sales": 366.12, | |
| "discounts": -26.97, | |
| "refunds": 0, | |
| "net_sales": 339.15, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 350.35 | |
| }, | |
| { | |
| "day": "2016-08-14", | |
| "orders": 9, | |
| "gross_sales": 829.07, | |
| "discounts": -54.67, | |
| "refunds": 0, | |
| "net_sales": 774.4, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 785.6 | |
| }, | |
| { | |
| "day": "2016-08-15", | |
| "orders": 7, | |
| "gross_sales": 299.68, | |
| "discounts": -31.85, | |
| "refunds": 0, | |
| "net_sales": 267.83, | |
| "shipping": 11.2, | |
| "taxes": 2.8, | |
| "total_sales": 281.83 | |
| }, | |
| { | |
| "day": "2016-08-16", | |
| "orders": 45, | |
| "gross_sales": 3032.7, | |
| "discounts": -208.79, | |
| "refunds": 0, | |
| "net_sales": 2823.91, | |
| "shipping": 61.6, | |
| "taxes": 1.74, | |
| "total_sales": 2887.25 | |
| }, | |
| { | |
| "day": "2016-08-17", | |
| "orders": 24, | |
| "gross_sales": 1228.63, | |
| "discounts": -104.01, | |
| "refunds": 0, | |
| "net_sales": 1124.62, | |
| "shipping": 33.6, | |
| "taxes": 0, | |
| "total_sales": 1158.22 | |
| }, | |
| { | |
| "day": "2016-08-18", | |
| "orders": 10, | |
| "gross_sales": 720.11, | |
| "discounts": -65.7, | |
| "refunds": -20, | |
| "net_sales": 634.41, | |
| "shipping": 11.2, | |
| "taxes": 13.95, | |
| "total_sales": 659.56 | |
| }, | |
| { | |
| "day": "2016-08-19", | |
| "orders": 4, | |
| "gross_sales": 237.7, | |
| "discounts": -17.98, | |
| "refunds": 0, | |
| "net_sales": 219.72, | |
| "shipping": 0, | |
| "taxes": 2.52, | |
| "total_sales": 222.24 | |
| }, | |
| { | |
| "day": "2016-08-20", | |
| "orders": 2, | |
| "gross_sales": 124.89, | |
| "discounts": -12.48, | |
| "refunds": 0, | |
| "net_sales": 112.41, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 112.41 | |
| }, | |
| { | |
| "day": "2016-08-21", | |
| "orders": 23, | |
| "gross_sales": 1458.96, | |
| "discounts": -50.46, | |
| "refunds": 0, | |
| "net_sales": 1408.5, | |
| "shipping": 16.8, | |
| "taxes": 3.11, | |
| "total_sales": 1428.41 | |
| }, | |
| { | |
| "day": "2016-08-22", | |
| "orders": 11, | |
| "gross_sales": 658.16, | |
| "discounts": -33.14, | |
| "refunds": 0, | |
| "net_sales": 625.02, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 636.22 | |
| }, | |
| { | |
| "day": "2016-08-23", | |
| "orders": 10, | |
| "gross_sales": 591.87, | |
| "discounts": -38.48, | |
| "refunds": 0, | |
| "net_sales": 553.39, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 564.59 | |
| }, | |
| { | |
| "day": "2016-08-24", | |
| "orders": 19, | |
| "gross_sales": 802.08, | |
| "discounts": -40.37, | |
| "refunds": 0, | |
| "net_sales": 761.71, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 778.51 | |
| }, | |
| { | |
| "day": "2016-08-25", | |
| "orders": 12, | |
| "gross_sales": 885.86, | |
| "discounts": -64.05, | |
| "refunds": 0, | |
| "net_sales": 821.81, | |
| "shipping": 5.6, | |
| "taxes": 13.95, | |
| "total_sales": 841.36 | |
| }, | |
| { | |
| "day": "2016-08-26", | |
| "orders": 15, | |
| "gross_sales": 879.91, | |
| "discounts": -5.28, | |
| "refunds": 0, | |
| "net_sales": 874.63, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 880.23 | |
| }, | |
| { | |
| "day": "2016-08-27", | |
| "orders": 7, | |
| "gross_sales": 394.98, | |
| "discounts": -11.38, | |
| "refunds": 0, | |
| "net_sales": 383.6, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 389.2 | |
| }, | |
| { | |
| "day": "2016-08-28", | |
| "orders": 8, | |
| "gross_sales": 366.06, | |
| "discounts": -81.6, | |
| "refunds": 0, | |
| "net_sales": 284.46, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 290.06 | |
| }, | |
| { | |
| "day": "2016-08-29", | |
| "orders": 3, | |
| "gross_sales": 208.79, | |
| "discounts": -22.47, | |
| "refunds": 0, | |
| "net_sales": 186.32, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 186.32 | |
| }, | |
| { | |
| "day": "2016-08-30", | |
| "orders": 4, | |
| "gross_sales": 170.78, | |
| "discounts": 0, | |
| "refunds": 0, | |
| "net_sales": 170.78, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 176.38 | |
| }, | |
| { | |
| "day": "2016-08-31", | |
| "orders": 17, | |
| "gross_sales": 1215.79, | |
| "discounts": -24.86, | |
| "refunds": 0, | |
| "net_sales": 1190.93, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 1202.13 | |
| }, | |
| { | |
| "day": "2016-09-01", | |
| "orders": 5, | |
| "gross_sales": 298.55, | |
| "discounts": 0, | |
| "refunds": 0, | |
| "net_sales": 298.55, | |
| "shipping": 5.6, | |
| "taxes": 17.52, | |
| "total_sales": 321.67 | |
| }, | |
| { | |
| "day": "2016-09-02", | |
| "orders": 4, | |
| "gross_sales": 100.4, | |
| "discounts": -6.98, | |
| "refunds": 0, | |
| "net_sales": 93.42, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 104.62 | |
| }, | |
| { | |
| "day": "2016-09-03", | |
| "orders": 7, | |
| "gross_sales": 285.61, | |
| "discounts": -6.51, | |
| "refunds": 0, | |
| "net_sales": 279.1, | |
| "shipping": 5.6, | |
| "taxes": 2.59, | |
| "total_sales": 287.29 | |
| }, | |
| { | |
| "day": "2016-09-04", | |
| "orders": 7, | |
| "gross_sales": 332.66, | |
| "discounts": -22.12, | |
| "refunds": 0, | |
| "net_sales": 310.54, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 321.74 | |
| }, | |
| { | |
| "day": "2016-09-05", | |
| "orders": 4, | |
| "gross_sales": 216.75, | |
| "discounts": -21.98, | |
| "refunds": 0, | |
| "net_sales": 194.77, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 194.77 | |
| }, | |
| { | |
| "day": "2016-09-06", | |
| "orders": 14, | |
| "gross_sales": 835.62, | |
| "discounts": -176.57, | |
| "refunds": 0, | |
| "net_sales": 659.05, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 675.85 | |
| }, | |
| { | |
| "day": "2016-09-07", | |
| "orders": 36, | |
| "gross_sales": 2147.16, | |
| "discounts": -242.61, | |
| "refunds": 0, | |
| "net_sales": 1904.55, | |
| "shipping": 28, | |
| "taxes": 1.83, | |
| "total_sales": 1934.38 | |
| }, | |
| { | |
| "day": "2016-09-08", | |
| "orders": 11, | |
| "gross_sales": 584.24, | |
| "discounts": -57.21, | |
| "refunds": 0, | |
| "net_sales": 527.03, | |
| "shipping": 11.2, | |
| "taxes": 13.95, | |
| "total_sales": 552.18 | |
| }, | |
| { | |
| "day": "2016-09-09", | |
| "orders": 11, | |
| "gross_sales": 590.33, | |
| "discounts": -57.96, | |
| "refunds": -42.46, | |
| "net_sales": 489.91, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 495.51 | |
| }, | |
| { | |
| "day": "2016-09-10", | |
| "orders": 6, | |
| "gross_sales": 598.44, | |
| "discounts": -127.42, | |
| "refunds": 0, | |
| "net_sales": 471.02, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 471.02 | |
| }, | |
| { | |
| "day": "2016-09-11", | |
| "orders": 4, | |
| "gross_sales": 328.15, | |
| "discounts": -6.36, | |
| "refunds": 0, | |
| "net_sales": 321.79, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 321.79 | |
| }, | |
| { | |
| "day": "2016-09-12", | |
| "orders": 7, | |
| "gross_sales": 371.56, | |
| "discounts": -47.52, | |
| "refunds": 0, | |
| "net_sales": 324.04, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 329.64 | |
| }, | |
| { | |
| "day": "2016-09-13", | |
| "orders": 9, | |
| "gross_sales": 667.25, | |
| "discounts": -11.72, | |
| "refunds": 0, | |
| "net_sales": 655.53, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 666.73 | |
| }, | |
| { | |
| "day": "2016-09-14", | |
| "orders": 22, | |
| "gross_sales": 1053.69, | |
| "discounts": -133.71, | |
| "refunds": 0, | |
| "net_sales": 919.98, | |
| "shipping": 16.2, | |
| "taxes": 0, | |
| "total_sales": 936.18 | |
| }, | |
| { | |
| "day": "2016-09-15", | |
| "orders": 10, | |
| "gross_sales": 643.73, | |
| "discounts": -58.67, | |
| "refunds": -6.74, | |
| "net_sales": 578.32, | |
| "shipping": 0, | |
| "taxes": 16.09, | |
| "total_sales": 594.41 | |
| }, | |
| { | |
| "day": "2016-09-16", | |
| "orders": 8, | |
| "gross_sales": 347.59, | |
| "discounts": -11.83, | |
| "refunds": 0, | |
| "net_sales": 335.76, | |
| "shipping": 16.8, | |
| "taxes": 2.42, | |
| "total_sales": 354.98 | |
| }, | |
| { | |
| "day": "2016-09-17", | |
| "orders": 2, | |
| "gross_sales": 78.94, | |
| "discounts": 0, | |
| "refunds": 0, | |
| "net_sales": 78.94, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 78.94 | |
| }, | |
| { | |
| "day": "2016-09-18", | |
| "orders": 7, | |
| "gross_sales": 384.61, | |
| "discounts": -15.42, | |
| "refunds": 0, | |
| "net_sales": 369.19, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 374.79 | |
| }, | |
| { | |
| "day": "2016-09-19", | |
| "orders": 12, | |
| "gross_sales": 439.99, | |
| "discounts": -29.5, | |
| "refunds": 0, | |
| "net_sales": 410.49, | |
| "shipping": 16.8, | |
| "taxes": 0, | |
| "total_sales": 427.29 | |
| }, | |
| { | |
| "day": "2016-09-20", | |
| "orders": 61, | |
| "gross_sales": 4359.35, | |
| "discounts": -699.09, | |
| "refunds": 0, | |
| "net_sales": 3660.26, | |
| "shipping": 33.6, | |
| "taxes": 0, | |
| "total_sales": 3693.86 | |
| }, | |
| { | |
| "day": "2016-09-21", | |
| "orders": 24, | |
| "gross_sales": 1336.02, | |
| "discounts": -119.22, | |
| "refunds": 0, | |
| "net_sales": 1216.8, | |
| "shipping": 33.6, | |
| "taxes": 6.94, | |
| "total_sales": 1257.34 | |
| }, | |
| { | |
| "day": "2016-09-22", | |
| "orders": 15, | |
| "gross_sales": 917.97, | |
| "discounts": -108.11, | |
| "refunds": 0, | |
| "net_sales": 809.86, | |
| "shipping": 11.2, | |
| "taxes": 15.53, | |
| "total_sales": 836.59 | |
| }, | |
| { | |
| "day": "2016-09-23", | |
| "orders": 5, | |
| "gross_sales": 517.91, | |
| "discounts": -103.57, | |
| "refunds": 0, | |
| "net_sales": 414.34, | |
| "shipping": 0, | |
| "taxes": 0, | |
| "total_sales": 414.34 | |
| }, | |
| { | |
| "day": "2016-09-24", | |
| "orders": 7, | |
| "gross_sales": 384.05, | |
| "discounts": -57.29, | |
| "refunds": 0, | |
| "net_sales": 326.76, | |
| "shipping": 11.2, | |
| "taxes": 0, | |
| "total_sales": 337.96 | |
| }, | |
| { | |
| "day": "2016-09-25", | |
| "orders": 11, | |
| "gross_sales": 583.7, | |
| "discounts": -88.76, | |
| "refunds": -10.19, | |
| "net_sales": 484.75, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 490.35 | |
| }, | |
| { | |
| "day": "2016-09-26", | |
| "orders": 7, | |
| "gross_sales": 359.18, | |
| "discounts": -38.39, | |
| "refunds": 0, | |
| "net_sales": 320.79, | |
| "shipping": 5.6, | |
| "taxes": 0, | |
| "total_sales": 326.39 | |
| }, | |
| { | |
| "day": "2016-09-27", | |
| "orders": 26, | |
| "gross_sales": 1297.54, | |
| "discounts": -123.89, | |
| "refunds": 0, | |
| "net_sales": 1173.65, | |
| "shipping": 28, | |
| "taxes": 0, | |
| "total_sales": 1201.65 | |
| }, | |
| { | |
| "day": "2016-09-28", | |
| "orders": 17, | |
| "gross_sales": 690.28, | |
| "discounts": -12.26, | |
| "refunds": 0, | |
| "net_sales": 678.02, | |
| "shipping": 39.2, | |
| "taxes": 6.3, | |
| "total_sales": 723.52 | |
| }, | |
| { | |
| "day": "2016-09-29", | |
| "orders": 9, | |
| "gross_sales": 502.36, | |
| "discounts": -13.48, | |
| "refunds": 0, | |
| "net_sales": 488.88, | |
| "shipping": 16.8, | |
| "taxes": 13.95, | |
| "total_sales": 519.63 | |
| }, | |
| { | |
| "day": "2016-09-30", | |
| "orders": 3, | |
| "gross_sales": 180.3, | |
| "discounts": -29.93, | |
| "refunds": 0, | |
| "net_sales": 150.37, | |
| "shipping": 5.6, | |
| "taxes": 2.32, | |
| "total_sales": 158.29 | |
| } | |
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <script src="https://d3js.org/d3.v4.min.js"></script> | |
| <script src="http://code.highcharts.com/highcharts.js"></script> | |
| <script src="https://rawgit.com/gka/d3-jetpack/master/d3-jetpack.js"></script> | |
| <link rel="stylesheet" type="text/css" href="style.css"> | |
| </head> | |
| <body> | |
| <div class="viz_container"></div> | |
| <div class="table_container"></div> | |
| <div class="spacer"></div> | |
| </body> | |
| </html> | |
| <script src="app.js"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body{ | |
| font-family: -apple-system, BlinkMacSystemFont, "San Francisco"; | |
| } | |
| .viz_container{ | |
| width: 960px; | |
| margin-bottom: 300px; | |
| margin-top: -18; | |
| left: 50%; | |
| margin-left: -480px; | |
| position: fixed; | |
| clear:both; | |
| background-color: #212121; | |
| } | |
| .viz_container rect{ | |
| opacity: 0.6; | |
| /*mix-blend-mode: multiply;*/ | |
| } | |
| .table_container{ | |
| padding-top: 120px; | |
| } | |
| table{ | |
| width: 960px; | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| th{ | |
| text-align: left; | |
| } | |
| .active{ | |
| background-color: #212121; | |
| color: white; | |
| } | |
| path{ | |
| fill: none; | |
| } | |
| .sparkline_current, path{ | |
| stroke-width: 4; | |
| } | |
| td{ | |
| padding: 3px; | |
| } | |
| .spacer{ | |
| height: 300px; | |
| } | |
| .active_rect{ | |
| fill: #FFF7B1; | |
| /*mix-blend-mode: overlay;*/ | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment