Scatter plot with color coding according to Mahalanobis distance.
Created based on @veltman's block, and
calculating bi-variate normal
Date | Eto | Precip | Sol_Rad | Vap_Pres | Air_Temp | Rel_Hum | Wind_Speed | Wind_Dir | Soil_Temp | |
---|---|---|---|---|---|---|---|---|---|---|
1/1/2014 01:00 | 0 | 0 | 0 | 0.5 | 3.1 | 70 | 1.4 | 50 | 10.6 | |
1/1/2014 02:00 | 0 | 0 | 0 | 0.5 | 3.2 | 68 | 1.2 | 51 | 10.4 | |
1/1/2014 03:00 | 0 | 0 | 0 | 0.5 | 1.6 | 75 | 0.9 | 44 | 10.3 | |
1/1/2014 04:00 | 0 | 0 | 0 | 0.5 | 1 | 77 | 1 | 47 | 10.1 | |
1/1/2014 05:00 | 0 | 0 | 0 | 0.5 | 2.3 | 69 | 1.2 | 73 | 10 | |
1/1/2014 06:00 | 0 | 0 | 0 | 0.5 | 0.7 | 75 | 0.9 | 54 | 9.8 | |
1/1/2014 07:00 | 0 | 0 | 1 | 0.5 | 1 | 74 | 1.1 | 64 | 9.7 | |
1/1/2014 08:00 | 0 | 0 | 20 | 0.5 | 1.3 | 73 | 1 | 48 | 9.6 | |
1/1/2014 09:00 | 0.07 | 0 | 199 | 0.6 | 5 | 69 | 1 | 356 | 9.5 |
Scatter plot with color coding according to Mahalanobis distance.
Created based on @veltman's block, and
calculating bi-variate normal
Using MathJax.js to display LaTeX equations in the browser.
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<head> | |
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> | |
</head> | |
<body> | |
<script src="//d3js.org/d3.v4.min.js"></script> | |
<div style="margin-left: 50px; margin-top: 20px;"> | |
<button id="btn1" type="button" class="btn btn-info btn-sm">Transition - Sequential</button> | |
<button id="btn2" type="button" class="btn btn-info btn-sm">Transition - Together</button> |
<meta charset="utf-8"> | |
<html> | |
<style> | |
h2 { | |
text-align:center; | |
font-weight: bold; | |
} | |
.card { |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8" /> | |
<title>highlight.js</title> | |
<script src="//d3js.org/d3.v4.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/highlight.min.js"></script> | |
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.9.1/styles/default.min.css" rel="stylesheet" /> | |
<script>hljs.initHighlightingOnLoad();</script> | |
<style> |
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<script src="//d3js.org/d3.v4.min.js"></script> | |
<body> | |
linearGradient with html / svg <br/> | |
<svg width="620" height="120"> | |
<defs> | |
<linearGradient id="gradient"> <!--gradientTransform="rotate(45)"--> |
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<script src="//d3js.org/d3.v4.min.js"></script> | |
<body> | |
<span class="leftlabel">0</span> | |
<input id="range1" type="range" min="0" max="90" value="0" style="width: 300px; margin-right: 10px;" /> | |
<span class="rightlabel">100</span> <br/><br /> |
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<script src="//d3js.org/d3.v4.min.js"></script> | |
<body> | |
<script> | |
var margin = 0, | |
width = 600 - margin, | |
height = 200 - margin; |