Skip to content

Commit

Permalink
Merge pull request #14 from etalab/chart-tuning
Browse files Browse the repository at this point in the history 
Chart tuning
  • Loading branch information
@noirbizarre
noirbizarre committed Jun 22, 2015
2 parents 68cc915 + ce3fd88 commit 9374a6f
Show file tree
Hide file tree
Showing 7 changed files with 45 additions and 98 deletions.
39 changes: 25 additions & 14 deletions js/components/charts/widget.vue
View file
Expand Up @@ -100,7 +100,15 @@ var AREA_OPTIONS = {
barValueSpacing: 5,
barDatasetSpacing: 1,
datasetFill: false
};
},
COLORS = [
'#a0d0e0',
'#3c8dbc',
'#4da74d',
'#ffb311',
'#8612ee',
'#aaa',
];
module.exports = {
Expand Down Expand Up @@ -140,19 +148,20 @@ module.exports = {
return moment(item.date).format('L');
}),
datasets: this.y.map(function(serie) {
var dataset = {label: serie.label};
dataset.fillColor = serie.color;
dataset.strokeColor = serie.color;
dataset.pointColor = serie.color;
datasets: this.y.map(function(serie, idx) {
var dataset = {label: serie.label},
color = serie.color || COLORS[idx];
dataset.fillColor = this.toRGBA(color, .5);
dataset.strokeColor = color;
dataset.pointColor = color;
// datasetpointStrokeColor: "#c1c7d1",
dataset.pointHighlightFill = '#fff';
dataset.pointHighlightStroke = serie.color;
dataset.pointHighlightStroke = color;
dataset.data = raw.map(function(item) {
return item[serie.id];
});
return dataset;
})
}.bind(this))
};
return data;
Expand Down Expand Up @@ -211,19 +220,21 @@ module.exports = {
this.chart = null;
}
},
hex_to_rgb: function(hex, opacity) {
toRGBA: function(hex, opacity) {
// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
hex = hex.replace(shorthandRegex, function(m, r, g, b) {
return r + r + g + g + b + b;
});
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
return result ?
'rgba('
+ parseInt(result[1], 16) + ','
+ parseInt(result[2], 16) + ','
+ parseInt(result[3], 16) + ','
+ opacity + ')'
: hex;
}
}
};
Expand Down
12 changes: 4 additions & 8 deletions js/views/dataset.vue
View file
Expand Up @@ -70,21 +70,17 @@ module.exports = {
},
y: [{
id: 'views',
label: this._('Views'),
color: '#a0d0e0'
label: this._('Views')
}, {
id: 'followers',
label: this._('Followers'),
color: '#3c8dbc'
label: this._('Followers')
}],
y_visitors: [{
id: 'views',
label: this._('Hits'),
color: '#a0d0e0'
label: this._('Hits')
}, {
id: 'followers',
label: this._('Unique visitors'),
color: '#3c8dbc'
label: this._('Unique visitors')
}],
notifications: [],
geojson: null
Expand Down
47 changes: 4 additions & 43 deletions js/views/home.vue
View file
Expand Up @@ -30,56 +30,17 @@ module.exports = {
}),
y: [{
id: 'datasets',
label: this._('Datasets'),
color: '#a0d0e0'
label: this._('Datasets')
}, {
id: 'reuses',
label: this._('Reuses'),
color: '#3c8dbc'
label: this._('Reuses')
}, {
id: 'users',
label: this._('Users'),
color: '#4da74d'
label: this._('Users')
}, {
id: 'organizations',
label: this._('Organizations'),
color: '#ffb311'
label: this._('Organizations')
}]
// charts: {
// data: {
// title: this._('Data'),
// y: [{
// id: 'datasets',
// label: this._('Datasets'),
// color: '#3c8dbc'
// }, {
// id: 'reuses',
// label: this._('Reuses'),
// color: '#a0d0e0'
// }]
// },
// community: {
// title: this._('Community'),
// y: [{
// id: 'users',
// label: this._('Users'),
// color: '#3c8dbc'
// }, {
// id: 'organizations',
// label: this._('Organizations'),
// color: '#a0d0e0'
// }]
// },
// all: {
// title: this._('Metrics'),
// series: {
// datasets: this._('Datasets'),
// reuses: this._('Reuses'),
// users: this._('Users'),
// organizations: this._('Organizations'),
// }
// }
// }
};
},
computed: {
Expand Down
23 changes: 5 additions & 18 deletions js/views/organization.vue
View file
Expand Up @@ -78,38 +78,25 @@ module.exports = {
default: 'Area',
y: [{
id: 'nb_uniq_visitors',
label: this._('Organization'),
color: '#3c8dbc'
label: this._('Organization')
}, {
id: 'datasets_nb_uniq_visitors',
label: this._('Datasets'),
color: '#a0d0e0'
label: this._('Datasets')
}, {
id: 'reuses_nb_uniq_visitors',
label: this._('Reuses'),
color: '#8612EE'
label: this._('Reuses')
}]
},
data: {
title: this._('Data'),
default: 'Bar',
y: [{
id: 'datasets',
label: this._('Datasets'),
color: '#3c8dbc'
label: this._('Datasets')
}, {
id: 'reuses',
label: this._('Reuses'),
color: '#a0d0e0'
label: this._('Reuses')
}]
// }, {
// title: this._('Downloads'),
// type: 'Line',
// y: [{
// id: 'resources_downloads',
// label: this._('Resources'),
// color: '#3c8dbc'
// }]
}
}
};
Expand Down
6 changes: 2 additions & 4 deletions js/views/reuse.vue
View file
Expand Up @@ -53,12 +53,10 @@ module.exports = {
},
y: [{
id: 'views',
label: this._('Views'),
color: '#a0d0e0'
label: this._('Views')
}, {
id: 'followers',
label: this._('Followers'),
color: '#3c8dbc'
label: this._('Followers')
}]
};
},
Expand Down
10 changes: 3 additions & 7 deletions js/views/site.vue
View file
Expand Up @@ -60,20 +60,16 @@ module.exports = {
discussions: new Discussions({query: {sort: '-created', page_size: 10}}),
y: [{
id: 'datasets',
label: this._('Datasets'),
color: '#a0d0e0'
label: this._('Datasets')
}, {
id: 'reuses',
label: this._('Reuses'),
color: '#3c8dbc'
label: this._('Reuses')
}, {
id: 'users',
label: this._('Users'),
color: '#aaa'
}, {
id: 'organizations',
label: this._('Organizations'),
color: '#3c8dbc'
label: this._('Organizations')
}]
};
},
Expand Down
6 changes: 2 additions & 4 deletions js/views/user.vue
View file
Expand Up @@ -43,12 +43,10 @@ module.exports = {
},
y: [{
id: 'datasets',
label: this._('Datasets'),
color: '#a0d0e0'
label: this._('Datasets')
}, {
id: 'reuses',
label: this._('Reuses'),
color: '#3c8dbc'
label: this._('Reuses')
}]
};
},
Expand Down

0 comments on commit 9374a6f

Please sign in to comment.