Skip to content

Commit

Permalink
Merge branch 'master' of github.com:com-480-data-visualization/projec…
Browse files Browse the repository at this point in the history
…t-2023-insightsquad
  • Loading branch information
Lugiasc committed Jun 4, 2023
2 parents 753b03a + bf28ea8 commit f592546
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 26 deletions.
2 changes: 1 addition & 1 deletion website/js/donutchart.js
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ const palettes_donut = {
17: ['#643100', '#763a00', '#7f3e00', '#914600', '#af5500', '#b96619', '#c27731', '#cb8849', '#d49961', '#eacaae'],
};
// choose a random color palette for the nodes
const palette_donut = palettes_donut[Math.floor(Math.random() * 8) + 1];
const palette_donut = palettes_donut[Math.floor(Math.random() * 17) + 1];
// color palette
var colorDonut = d3.scaleOrdinal()
.domain(data.columns.slice(1))
Expand Down
37 changes: 35 additions & 2 deletions website/js/heatmap.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// set the dimensions and margins of the graph
var marginHeatmap = {top: 20, right: 25, bottom: 30, left: 40},
var marginHeatmap = {top: 20, right: 25, bottom: 30, left: 60},
widthHeatmap = 850 - marginHeatmap.left - marginHeatmap.right,
heightHeatmap = 800 - marginHeatmap.top - marginHeatmap.bottom;

Expand Down Expand Up @@ -106,12 +106,30 @@ function updateHeatmapChart(data) {
.style("font-size", 15)
.call(d3.axisLeft(y).tickSize(0))
.select(".domain").remove()

const palettes = {
1: ['#0061ff', '#60efff'],
2: ['#40c9ff', '#e81cff'],
3: ['#ff930f', '#fff95b'],
4: ['#696eff', '#f8acff'],
5: ['#006e90', '#f18f01'],
6: ['#0a2463', '#fb3640'],
7: ['#57ebde', '#aefb2a'],
8: ['#ef798a', '#f7a9a8'],
9: ['#00ffff', '#8000ff'],
10: ['#ffc7f8', '#6bf8fa'],
};

// choose a random color palette for the nodes
const palette = palettes[Math.floor(Math.random() * 10) + 1];
// palette is an array of hex colors, pick one at random
const hexColor = palette[Math.floor(Math.random() * palette.length)];

// Build color scale
var maxValue = d3.max(data, function(d) { return +d.value; })
var myColor = d3.scaleLog()
.base(10)
.range(["white", "blue"])
.range(["white", hexColor])
.domain([1,maxValue])


Expand Down Expand Up @@ -169,6 +187,21 @@ function updateHeatmapChart(data) {
.on("mousemove", mousemove)
.on("mouseleave", mouseleave)

// X axis label
svg.append("text")
.attr("x", widthHeatmap / 2)
.attr("y", heightHeatmap + marginHeatmap.top -130) // Adjust the position as needed
.style("text-anchor", "middle")
.text("# Downloads");

// Y axis label
svg.append("text")
.attr("transform", "rotate(-90)")
.attr("x", -heightHeatmap/2 + 80)
.attr("y", -marginHeatmap.left + 20) // Adjust the position as needed
.style("text-anchor", "middle")
.text("Rating");

}

function updateHeatmapChartCategoryChange() {
Expand Down
33 changes: 11 additions & 22 deletions website/js/stacked.js
Original file line number Diff line number Diff line change
Expand Up @@ -53,30 +53,20 @@
var chart = new google.visualization.ColumnChart(document.getElementById('stacked'));

const palettes = {
1: ["264653","2a9d8f","e9c46a","f4a261","e76f51"],
2: ["03045e","0077b6","00b4d8","90e0ef","caf0f8"],
3: ["2b2d42","8d99ae","edf2f4","ef233c","d90429"],
4: ["03045e","023e8a","0077b6","0096c7","00b4d8","48cae4","90e0ef","ade8f4","caf0f8"],
5: ["390099","9e0059","ff0054","ff5400","ffbd00"],
6: ["7400b8","6930c3","5e60ce","5390d9","4ea8de","48bfe3","56cfe1","64dfdf","72efdd","80ffdb"],
7: ["ff7b00","ff8800","ff9500","ffa200","ffaa00","ffb700","ffc300","ffd000","ffdd00","ffea00"],
8: ["16697a","489fb5","82c0cc","ede7e3","ffa62b"],
9: ["f7b267","f79d65","f4845f","f27059","f25c54"],
10: ["fadde1","ffc4d6","ffa6c1","ff87ab","ff5d8f","ff97b7","ffacc5","ffcad4","f4acb7"],
11: ["004b23","006400","007200","008000","38b000","70e000","9ef01a","ccff33"],
12: ["250902","38040e","640d14","800e13","ad2831"],
13: ["30f2f2","ffd23f","ff6f59","3066be","a0a4b8"],
14: ["33a8c7","52e3e1","a0e426","fdf148","ffab00","f77976","f050ae","d883ff","9336fd"],
15: ["ff0000","ff8700","ffd300","deff0a","a1ff0a","0aff99","0aefff","147df5","580aff","be0aff"],
16: ["ff0000","ff8700","ffd300","deff0a","a1ff0a","0aff99","0aefff","147df5","580aff","be0aff"],
17: ["001219","005f73","0a9396","94d2bd","e9d8a6","ee9b00","ca6702","bb3e03","ae2012","9b2226"],
18: ["001219","005f73","0a9396","94d2bd","e9d8a6","ee9b00","ca6702","bb3e03","ae2012","9b2226"],
19: ["001219","005f73","0a9396","94d2bd","e9d8a6","ee9b00","ca6702","bb3e03","ae2012","9b2226"],
20: ["001219","005f73","0a9396","94d2bd","e9d8a6","ee9b00","ca6702","bb3e03","ae2012","9b2226"]
1: ["0061ff","60efff"],
2: ["40c9ff","e81cff"],
3: ["ff930f","fff95b"],
4: ["696eff","f8acff"],
5: ["006e90","f18f01"],
6: ["0a2463","fb3640"],
7: ["57ebde","aefb2a"],
8: ["ef798a","f7a9a8"],
9: ["00ffff","8000ff"],
10:["ffc7f8","6bf8fa"]
};

// choose a random color palette for the nodes
const palette = palettes[Math.floor(Math.random() * 20) + 1];
const palette = palettes[Math.floor(Math.random() * 10) + 1];

var options = {
animation:{
Expand Down Expand Up @@ -109,7 +99,6 @@
bar: { groupWidth: '75%' },
isStacked: true,
backgroundColor: '#f2f2f2',
title: "Business Model"
};

chart.draw(dataTable, options);
Expand Down
2 changes: 1 addition & 1 deletion website/js/streamgraph.js
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ function buildStreamgraph(data, dataRadius) {
17: ['#643100', '#763a00', '#7f3e00', '#914600', '#af5500', '#b96619', '#c27731', '#cb8849', '#d49961', '#eacaae'],
};
// choose a random color palette for the nodes
const palette = palettes[Math.floor(Math.random() * 8) + 1];
const palette = palettes[Math.floor(Math.random() * 17) + 1];
// color palette
var color = d3.scaleOrdinal()
.domain(keys)
Expand Down

0 comments on commit f592546

Please sign in to comment.