How to get a significant correlation value by moving just one point around.

Have you ever seen these scatterplots that report a significant correlation between X and Y, but it looks like it's just the one point to the upper-right driving the correlation? Thanks to this interactive tool, you too can do this at home. Click anywhere in the picture, and the red dot will move. The sliding bar displays the resulting correlation coefficient. The grey interval are non-significant values: place the red dot right to get a significant result.

Data are generated from two standard independent gaussian (N=15). Test values are from the asymptotic Fisher transformation test that's on Wikipedia (two-sided, alpha = 5%). Code: R and d3.js.

<!DOCTYPE html>
<html lang="en">
<head>

.ghost {
    fill: blue;
    fill-opacity: 0;
    }

.label {
    font-size: 12px;
    color: blue;
    }

.datapoint {
    r: 5;
    fill: blue;
    fill-opacity: .5;
    }
    
    #d3plot {
    width: 500px;
    height: 500px;
    }

</style>

</head>

Modified http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js to a secure url

Modified http://d3js.org/d3.v2.js to a secure url

https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

https://d3js.org/d3.v2.js