3495 results map

[cyrusnaficy]

Resolves #3495

For many neighborhoods, the value severityVal was undefined. This variable is passed into getColorFromGradient and is supposed to be an int used to determine the color in a loop. Since this variable was undefined, the loop didn't work and there was no resulting color to load. This fix sets severityVal to 100 (the default value) whenever it is undefined.

Before

After

Testing instructions

1. Load the results map before and after the fix.

Things to check before submitting the PR

• [x] I've written a descriptive PR title.
• [x] I've included before/after screenshots above.
• [ ] I've updated any logging. Clicks, keyboard presses, and other user interactions should be logged. If you're not sure how (or if you need to update the logging), ask Mikey. Then make sure the documentation on this wiki page is up to date for the logs you added/updated.
• [x] I've tested on mobile (only needed for validation page).

[misaugstad]

@cyrusnaficy can you try to figure out why this is happening in some cities, but not others? For example, I'm going to send you a db dump for Burnaby, where I just opened up a few new neighborhoods with no data in them. But those are displaying on the map just fine. So I'm not sure why we would get an undefined value in some cities but not others?

[cyrusnaficy]

@cyrusnaficy can you try to figure out why this is happening in some cities, but not others? For example, I'm going to send you a db dump for Burnaby, where I just opened up a few new neighborhoods with no data in them. But those are displaying on the map just fine. So I'm not sure why we would get an undefined value in some cities but not others?

const totalIssues = polygonData.NoSidewalk + polygonData.NoCurbRamp + polygonData.SurfaceProblem + polygonData.Obstacle;
const severityVal = Math.min(100, 1000.0 * totalIssues / polygonData.completed_distance_m);

Here is where severityVal is calculated. For cities like New Taipei, totalIssues and polygonData.completed_distance_m are both 0. This 0/0 case leads to an NaN reponse.

console.log(Math.min(100, 1000.0 * 0/0))

With the fix above, severityVal is set to 100 if the current value is 0 to prevent the error.

Some neighborhoods in New Taipei (which shows none) do have data, but they are not shown because this error on a previous neighborhood exits the process.

Example neighborhood with data

This also explains why some cities only have some neighborhoods, because those were added asynchronously before the process failed.

let renderNeighborhoods = Promise.all([mapLoaded, loadNeighborhoods, loadCompletionRates, loadLabelCounts]).then(function(data) {
    choropleth = data[0];
    AddNeighborhoodsToMap(choropleth, data[1], data[2], data[3], params);
});

[misaugstad]

Here is where severityVal is calculated. For cities like New Taipei, totalIssues and polygonData.completed_distance_m are both 0. This 0/0 case leads to an NaN reponse.

But shouldn't this also be the case in Burnaby? They are newly opened neighborhoods, so both totalIssues and polygonData.completed_distance_m should be 0 here, yet all the neighborhoods are showing up?

[cyrusnaficy]

Here is where severityVal is calculated. For cities like New Taipei, totalIssues and polygonData.completed_distance_m are both 0. This 0/0 case leads to an NaN reponse.

But shouldn't this also be the case in Burnaby? They are newly opened neighborhoods, so both totalIssues and polygonData.completed_distance_m should be 0 here, yet all the neighborhoods are showing up?

When significantData is true, it uses the getColorFromGradient function to get the color gradient. For Burnaby, when the significantData var is true, severityVal isn't NaN. But for New Taipei, there are cases where significantData is true and severityVal is NaN. This causes there to be an error since the function is trying to use severityVal as an int but it is undefined.

Here are some log images showing the two cities. Generated from this code below:

Burnaby

New Taipei

[misaugstad]

When significantData is true, it uses the getColorFromGradient function to get the color gradient. For Burnaby, when the significantData var is true, severityVal isn't NaN. But for New Taipei, there are cases where significantData is true and severityVal is NaN.

Okay that makes sense, but why is that actually the case? Why would significantData be true while severityVal is NaN?

[cyrusnaficy]

When significantData is true, it uses the getColorFromGradient function to get the color gradient. For Burnaby, when the significantData var is true, severityVal isn't NaN. But for New Taipei, there are cases where significantData is true and severityVal is NaN.

Okay that makes sense, but why is that actually the case? Why would significantData be true while severityVal is NaN?

That is because many neighborhoods have a total distance of 0. This automatically sets the completion rate to 100%. Since there is no data like NoSidewalk or SurfaceProblem, it causes totalIssues to be 0. Burnaby doesn't have this issue because new neighborhoods, although having a completed distance of 0 still have a total distance higher than 0.

[misaugstad]

Ohhh that makes a lot of sense! In that case, wouldn't it make more sense for the color of the neighborhoods with no streets at all to be gray instead of bright red? You have it set to severityVal || 100, so if the neighborhood has no streets then we are saying that it has the worst severity. I think that it would make more sense to make it so that significantData is false in this case, no?