Last active
August 13, 2016 00:05
-
-
Save torresomar/b69022a51435aeba77f4fd3c0b3784d4 to your computer and use it in GitHub Desktop.
grouped-bar-charts-d3
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> | |
| <title> | |
| Grouped Bar Charts with d3.js (Tutorial) | |
| </title> | |
| <link rel="stylesheet" type="text/css" href="main.css"></link> | |
| </head> | |
| <body> | |
| <div id="grouped-bar" class="grouped-bar"> | |
| </div> | |
| <script src="main.js" type="text/javascript" language="JavaScript"></script> | |
| </body> | |
| </html> |
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
| { | |
| "name": "01-grouped-bar-charts-d3", | |
| "version": "0.0.1", | |
| "description": "Simple code base for tutorial regarding the use of d3", | |
| "main": "index.js", | |
| "scripts": { | |
| "serve": "webpack", | |
| "dev-server": "webpack-dev-server --watch", | |
| "test": "echo \"Error: no test specified\" && exit 1" | |
| }, | |
| "keywords": [ | |
| "webpack", | |
| "d3", | |
| "kryptophsky" | |
| ], | |
| "author": "Omar Eduardo Torres <torres.omar.eduardo@gmail.com> (http://dataquito.org)", | |
| "license": "MIT", | |
| "devDependencies": { | |
| "autoprefixer-loader": "^3.2.0", | |
| "babel-core": "^6.13.2", | |
| "babel-loader": "^6.2.4", | |
| "babel-preset-es2015": "^6.13.2", | |
| "css-loader": "^0.23.1", | |
| "node-sass": "^3.8.0", | |
| "sass-loader": "^4.0.0", | |
| "style-loader": "^0.13.1", | |
| "webpack": "^1.13.1", | |
| "webpack-dev-server": "^1.14.1", | |
| "extract-text-webpack-plugin": "^1.0.1" | |
| }, | |
| "dependencies": { | |
| "d3": "^4.2.1" | |
| } | |
| } |
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
| .sample { | |
| .test { | |
| border: 1px solid red; | |
| } | |
| } |
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
| const path = require('path'); | |
| const webpack = require('webpack'); | |
| var extractTextPlugin = require('extract-text-webpack-plugin'); | |
| module.exports = { | |
| entry: __dirname + '/scripts/index.js', | |
| output: { | |
| path: __dirname + '/build', | |
| filename: '[name].js', | |
| }, | |
| plugins: [ | |
| new extractTextPlugin('[name].css') | |
| ], | |
| devtool: 'eval-source-map', | |
| debug: true, | |
| module: { | |
| loaders:[ | |
| { | |
| test: /\.json$/, | |
| loader: 'json-loader' | |
| }, | |
| { | |
| test: /\.js$/, | |
| exclude: /node_modules/, | |
| loader: 'babel-loader', | |
| query: { | |
| presets: 'es2015' | |
| } | |
| }, | |
| { | |
| test: /\.scss$/, | |
| exclude: /node_modules/, | |
| loader: extractTextPlugin.extract('style-loader','css-loader!autoprefixer-loader!sass-loader') | |
| }, | |
| { | |
| test: /\.css$/, | |
| loader: extractTextPlugin.extract('style-loader', 'css-loader') | |
| } | |
| ] | |
| }, | |
| resolve: { | |
| root: path.resolve(__dirname), | |
| extensions: ['', '.js', '.json', '.coffee'], | |
| } | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment