Skip to content

Tweaks to the info window #84

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
May 21, 2015
Merged

Tweaks to the info window #84

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
07fd3e6
Minor tweaks to phrasing and info window
May 20, 2015
1d11401
Fixed some more boundary conditions with census coloring
May 20, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions src/censusLayer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -293,7 +293,6 @@ define([
self.getPropertyData(),
colorbrewer[self._colorBrewerName]);
feature.map_mouse_over = true;
console.log(feature)
});
layer.on("mouseout", function (e) {
feature.map_mouse_over = false;
Expand Down Expand Up @@ -332,7 +331,7 @@ define([

if (val) {
if ((typeof(highlight)!=="undefined") || feature.map_mouse_over==true) {
return {"fillColor": this._getColor(prop.serie,val) , "color" : "#404040" , "weight": 4 , "opacity" : 1.0, "fillOpacity": 0.6};
return {"fillColor": this._getColor(prop.serie, val) , "color" : "#404040" , "weight": 4 , "opacity" : 1.0, "fillOpacity": 0.6};
} else {
return {"fillColor": this._getColor(prop.serie,val) , "weight": 0 , "opacity" : 0.0, "fillOpacity": 0.6};
}
Expand Down
7 changes: 4 additions & 3 deletions src/colors.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
define([], function() {
return {
getColor: function(colorSeries, boundsArray, val) {
var colors = colorSeries[boundsArray.length];
for (var i in boundsArray) {
if ((val-boundsArray[i]>=0) && (val-boundsArray[parseInt(i)+1]<0)) {
return colorSeries[boundsArray.length][i];
if (val-boundsArray[parseInt(i)+1]<0) {
return colors[i];
}
}
return "#7F7F7F";
return colors[i - 1];
}
};
});
49 changes: 43 additions & 6 deletions src/iwindow.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,17 +5,41 @@ define(['jquery', 'underscore', "hoverTract", "variables", "colors"], function($

var currentVar, currentFeature, currentProp, currentColors;

function commaSeparate(s) {
var split = s.split("."),
after = split[1];

s = split[0];

var l = s.length;
if (l <= 3)
return s;

var istart = 0,
iend = (l % 3) || 3,
pieces = [],
p;

while ((p = s.slice(istart, iend))) {
pieces.push(p);
istart = iend;
iend += 3;
}

return pieces.join(",") + (after ? ("." + after) : "");
}

var formatters = {
"%": function(n) {
return parseFloat(n).toFixed(2) + "%";
return n.toFixed(2) + "%";
},

"#": function(n) {
return parseFloat(n).toFixed(2);
return commaSeparate(n.toFixed(2));
},

"$": function(n) {
return "$" + parseFloat(n).toFixed(2);
return "$" + commaSeparate(n.toFixed(2));
}
};

Expand All @@ -33,23 +57,36 @@ define(['jquery', 'underscore', "hoverTract", "variables", "colors"], function($

$('<p>').html('<strong class="tract">Census Tract ID number:</strong>' + ' ' + featureId).appendTo($tract);

var previousVal = null;

_.each(YEARS, function(year) {
var val = featureProps[currentVar + "_" + year.slice(2)];
if (val && currentProp) {
console.log(currentProp.unit);
val = parseFloat(val);
var color = colors.getColor(currentColors,
currentProp.serie, val),
formatter = formatters[currentProp.unit] ||
formatters["#"];

$("<li>")
.append("<div class='swatch' style='background-color:" +
var li = $("<li>");

li.append("<div class='swatch' style='background-color:" +
color + ";'/>")
.append("<strong class='year'>" + year + ":</strong>" + ' ' +
formatter(val))
.appendTo($vals);

if (previousVal) {
var changeSpan = $("<span class='change'/>");

changeSpan.addClass((val > previousVal) ?
"increase" : "decrease")
.html(formatter(val - previousVal))
.appendTo(li);
}
}

previousVal = val;
});
}
}
Expand Down
21 changes: 21 additions & 0 deletions src/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,27 @@ div.map > h2 {
height: 15px;
}

.change {
font-size: x-small;
padding-left: 20px;
}

.increase {
color: green;
}

.increase:before {
content: "⬆";
}

.decrease {
color: red;
}

.decrease:before {
content: "⬇";
}

.lwrapper{
position: absolute;
bottom: 3%;
Expand Down
28 changes: 14 additions & 14 deletions src/variables.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,32 +1,32 @@
define([], function() {
return {
"pcthhchild": {
"desc": "Percentage of households per census tract with children residing in them.",
"desc": "Percentage of households with children residing in them.",
"props": "PuRd",
"name": "% of Households with Children",
"category": "People"
},
"pctind_finance": {
"name": "% Employed in Finance",
"desc": "Percentage of people per census tract employed in jobs qualified by the ACS as \"finance.\"",
"desc": "Percentage of people employed in jobs qualified by the ACS as \"finance.\"",
"props": "PuRd",
"category": "People"
},
"pctind_professional": {
"name": "% Employed as Professionals",
"desc": "Percentage of people per census tract employed in jobs qualified by the ACS as \"professional.\"",
"desc": "Percentage of people employed in jobs qualified by the ACS as \"professional.\"",
"props": "PuRd",
"category": "People"
},
"pctocc_profmanage": {
"name": "% Employed in Management",
"desc": '',
"desc": "Percentage of adults employed in management positions",
"props": "PuRd",
"category": "People"
},
"pctcollege": {
"name": "% College Educated",
"desc": "Percentage of people per census tract that possess a college degree.",
"desc": "Percentage of people who possess a college degree.",
"props": "PuRd",
"category": "People"
},
Expand All @@ -44,55 +44,55 @@ define([], function() {
},
"pctinc_50k_100k": {
"name": "% Of Household inc. 50-100K",
"desc": '',
"desc": "Percentage of househoulds that earn between $50,000 and $100,000",
"props": "GnBu",
"category": "Economic"
},
"pctinc_100k_more": {
"name": "% Of Household inc. 100K and up",
"desc": 'Percentage of people per census tract that have an income of $100,000 or more.',
"desc": 'Percentage of people that have an income of $100,000 or more.',
"props": "GnBu",
"category": "Economic"
},
"medianhhincome": {
"name": "Median Household Income",
"desc": "Median income of all households per census tract",
"desc": "Median income of all households",
"props": "GnBu",
"category": "Economic"
},
"pctpoverty": {
"name": "% of Residents in Poverty",
"desc": "Percentage of people per census tract living under the federal poverty line.",
"desc": "Percentage of people living under the federal poverty line.",
"props": "GnBu",
"category": "Economic"
},
"pctpublicassist": {
name: "% of Residents on Public Assistance",
"desc": "",
"desc": "Percentage of people on public assistance.",
"props": "GnBu",
"category": "Economic"
},
"units": {
name: "Number of Housing Units",
"desc": "Number of housing units per census tract.",
"desc": "Number of housing units",
"props": "OrRd",
"category": "Housing"
},
"pctown": {
name: "% of Units Owned",
"desc": "Percentage of housing units per census tract that are owner-occupied.",
"desc": "Percentage of housing units that are owner-occupied.",
"props": "OrRd",
"category": "Housing"
},
"pctrent": {
name: "% of Units Rented",
"desc": "Percentage of housing units per census tract that are renter-occupied.",
"desc": "Percentage of housing units that are renter-occupied.",
"props": "OrRd",
"category": "Housing"
},
"pctvacant": {
name: "% of Units Vacant",
"desc": "Percentage of housing units per census tract that are vacant.",
"desc": "Percentage of housing units that are vacant.",
"props": "OrRd",
"category": "Housing"
},
Expand Down