This simple line chart is created with Webcharts and plots temperature over time between January 2014 and April 2015 in Wake County, NC. A line plots the average of the six station readings, each of which is represented by a circle. Data sourced from the National Climatic Data Center.
Last active
September 14, 2015 13:10
-
-
Save nbryant/2dc50b892378a6dc2813 to your computer and use it in GitHub Desktop.
Webcharts - Chart with Multiple Marks
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
STATION | STATION_NAME | DATE | TPCP | TSNW | EMXT | EMNT | Monthly Mean Max | Monthly Mean Min | Monthly Mean | |
---|---|---|---|---|---|---|---|---|---|---|
COOP:311535 | CARY NC US | 201401 | 221 | 24 | 67 | 8 | 46.4 | 24.2 | 35.3 | |
COOP:311535 | CARY NC US | 201402 | 350 | 41 | 71 | 15 | 52.1 | 31.4 | 41.7 | |
COOP:311535 | CARY NC US | 201403 | 507 | 2 | 78 | 16 | 55.3 | 32 | 43.6 | |
COOP:311535 | CARY NC US | 201404 | 305 | 0 | 87 | 32 | 71.6 | 46.3 | 59 | |
COOP:311535 | CARY NC US | 201405 | 573 | 0 | 90 | 46 | 79.8 | 57.7 | 68.7 | |
COOP:311535 | CARY NC US | 201406 | 250 | 0 | 95 | 52 | 86.3 | 64.8 | 75.6 | |
COOP:311535 | CARY NC US | 201407 | 760 | 0 | 96 | 61 | 85.6 | 67.4 | 76.5 | |
COOP:311535 | CARY NC US | 201408 | 856 | 0 | 89 | 59 | 81.1 | 65.6 | 73.4 | |
COOP:311535 | CARY NC US | 201409 | 421 | 0 | 91 | 53 | 77.3 | 63.1 | 70.2 | |
COOP:311535 | CARY NC US | 201410 | 327 | 0 | 84 | 41 | 72.9 | 49.7 | 61.3 | |
COOP:311535 | CARY NC US | 201411 | 418 | 0 | 74 | 21 | 55.2 | 34.6 | 44.9 | |
COOP:311535 | CARY NC US | 201412 | 535 | 0 | 72 | 27 | 52.3 | 35.9 | 44.1 | |
COOP:311535 | CARY NC US | 201501 | 418 | 0 | 68 | 10 | 48.1 | 28.7 | 38.4 | |
COOP:311535 | CARY NC US | 201502 | 265 | 56 | 70 | 7 | 43.5 | 22.5 | 33 | |
COOP:311535 | CARY NC US | 201503 | 327 | 0 | 82 | 21 | 60.2 | 38.2 | 49.2 | |
COOP:311535 | CARY NC US | 201504 | 578 | 0 | 83 | 37 | 70.9 | 48.4 | 59.7 | |
COOP:310212 | APEX NC US | 201401 | 279 | 28 | 65 | 9 | 47.3 | 24.5 | 35.9 | |
COOP:310212 | APEX NC US | 201402 | 350 | 55 | 72 | 18 | 52.9 | 32.5 | 42.7 | |
COOP:310212 | APEX NC US | 201403 | 574 | 0 | 78 | 16 | 55.8 | 32.8 | 44.3 | |
COOP:310212 | APEX NC US | 201404 | 338 | 0 | 87 | 33 | 71.6 | 47.2 | 59.4 | |
COOP:310212 | APEX NC US | 201405 | 580 | 0 | 91 | 48 | 80.4 | 58.3 | 69.3 | |
COOP:310212 | APEX NC US | 201406 | 308 | 0 | 96 | 52 | 87 | 65.4 | 76.2 | |
COOP:310212 | APEX NC US | 201407 | 659 | 0 | 97 | 61 | 86.5 | 67.7 | 77.1 | |
COOP:310212 | APEX NC US | 201408 | 875 | 0 | 91 | 60 | 82.9 | 66.2 | 74.5 | |
COOP:310212 | APEX NC US | 201409 | 400 | 0 | 94 | 54 | 78.9 | 63.6 | 71.3 | |
COOP:310212 | APEX NC US | 201410 | 240 | 0 | 84 | 41 | 73.7 | 48.9 | 61.3 | |
COOP:310212 | APEX NC US | 201411 | 408 | 0 | 76 | 21 | 56.7 | 35.1 | 45.9 | |
COOP:310212 | APEX NC US | 201412 | 509 | 0 | 73 | 28 | 53.5 | 36.5 | 45 | |
COOP:310212 | APEX NC US | 201501 | 422 | 0 | 69 | 10 | 49.5 | 29.2 | 39.3 | |
COOP:310212 | APEX NC US | 201502 | 297 | 61 | 71 | 7 | 44.9 | 23.5 | 34.2 | |
COOP:310212 | APEX NC US | 201503 | 380 | 0 | 83 | 21 | 61.1 | 38.7 | 49.9 | |
COOP:310212 | APEX NC US | 201504 | 453 | 0 | 83 | 37 | 71.6 | 49 | 60.3 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201401 | 305 | 30 | 70 | 9 | 46.9 | 25.8 | 36.4 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201402 | 287 | 43 | 73 | 23 | 54.1 | 32.3 | 43.2 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201403 | 637 | 0 | 79 | 25 | 57.1 | 35 | 46.1 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201404 | 511 | 0 | 85 | 32 | 72.9 | 49.5 | 61.2 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201405 | 547 | 0 | 92 | 46 | 82.5 | 58.6 | 70.5 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201406 | 450 | 0 | 97 | 57 | 89 | 67.6 | 78.3 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201407 | 607 | 0 | 97 | 62 | 89.6 | 69 | 79.3 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201408 | 782 | 0 | 97 | 59 | 86.4 | 67.5 | 76.9 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201409 | 498 | 0 | 97 | 54 | 80.9 | 63.6 | 72.3 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201410 | 463 | 0 | 84 | 39 | 74.5 | 51.2 | 62.9 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201411 | 369 | 0 | 72 | 21 | 56.6 | 35.9 | 46.3 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201412 | 448 | 0 | 70 | 28 | 54.2 | 36.7 | 45.4 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201501 | 224 | 0 | 72 | 15 | 48.3 | 28.9 | 38.6 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201502 | 294 | 0 | 72 | 7 | 45.6 | 23.4 | 34.5 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201503 | 362 | 0 | 76 | 22 | 59.7 | 38.7 | 49.2 | |
COOP:317079 | RALEIGH STATE UNIVERSITY NC US | 201504 | 492 | 0 | 83 | 38 | 71 | 51.6 | 61.3 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201401 | 196 | 19 | 69 | 7 | 48.1 | 25.2 | 36.7 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201402 | 300 | 37 | 73 | 23 | 53.5 | 33.4 | 43.4 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201403 | 505 | 2 | 79 | 16 | 57.9 | 34 | 46 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201404 | 523 | 0 | 86 | 31 | 72.3 | 48 | 60.2 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201405 | 401 | 0 | 92 | 45 | 81.4 | 58.3 | 69.8 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201406 | 331 | 0 | 97 | 52 | 88.8 | 65.8 | 77.3 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201407 | 896 | 0 | 98 | 60 | 88.1 | 68.7 | 78.4 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201408 | 687 | 0 | 92 | 58 | 84.6 | 67.1 | 75.9 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201409 | 591 | 0 | 96 | 54 | 79.9 | 64.4 | 72.2 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201410 | 218 | 0 | 86 | 39 | 75 | 51 | 63 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201411 | 378 | 0 | 76 | 19 | 58.1 | 35.8 | 47 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201412 | 497 | 0 | 74 | 26 | 53.8 | 35.6 | 44.7 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201501 | 335 | 0 | 69 | 11 | 49.5 | 30 | 39.8 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201502 | 291 | 79 | 72 | 7 | 45 | 24.6 | 34.8 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201503 | 328 | 0 | 82 | 20 | 62.7 | 39.8 | 51.3 | |
COOP:317069 | RALEIGH DURHAM INTERNATIONAL AIRPORT NC US | 201504 | 526 | 0 | 84 | 33 | 72.5 | 50.6 | 61.5 | |
COOP:312993 | FALLS LAKE NC US | 201401 | 219 | 20 | 67 | 7 | 47.2 | 24.5 | 35.9 | |
COOP:312993 | FALLS LAKE NC US | 201403 | 556 | 3 | 77 | 15 | 56.2 | 30.6 | 43.4 | |
COOP:312993 | FALLS LAKE NC US | 201404 | 449 | 0 | 88 | 31 | 72.6 | 43.5 | 58.1 | |
COOP:312993 | FALLS LAKE NC US | 201405 | 488 | 0 | 88 | 46 | 77.8 | 55.8 | 66.8 | |
COOP:312993 | FALLS LAKE NC US | 201406 | 418 | 0 | 90 | 51 | 83.6 | 63.2 | 73.4 | |
COOP:312993 | FALLS LAKE NC US | 201407 | 587 | 0 | 93 | 58 | 83.9 | 66.8 | 75.4 | |
COOP:312993 | FALLS LAKE NC US | 201408 | 372 | 0 | 86 | 58 | 79.5 | 65.3 | 72.4 | |
COOP:312993 | FALLS LAKE NC US | 201409 | 793 | 0 | 90 | 54 | 76.3 | 62.9 | 69.6 | |
COOP:312993 | FALLS LAKE NC US | 201410 | 392 | 0 | 80 | 39 | 70.4 | 49.4 | 59.9 | |
COOP:312993 | FALLS LAKE NC US | 201411 | 400 | 0 | 72 | 20 | 54.8 | 33.6 | 44.2 | |
COOP:312993 | FALLS LAKE NC US | 201412 | 503 | 0 | 70 | 25 | 52 | 33.2 | 42.6 | |
COOP:312993 | FALLS LAKE NC US | 201501 | 353 | 0 | 68 | 11 | 48 | 27.1 | 37.5 | |
COOP:312993 | FALLS LAKE NC US | 201502 | 300 | 118 | 71 | 7 | 43.7 | 21.9 | 32.8 | |
COOP:312993 | FALLS LAKE NC US | 201503 | 348 | 0 | 82 | 19 | 60.4 | 35.6 | 48 | |
COOP:312993 | FALLS LAKE NC US | 201504 | 331 | 0 | 84 | 32 | 71.4 | 46.5 | 58.9 | |
COOP:316122 | NEW HILL NC US | 201401 | 218 | 0 | 66 | 3 | 47 | 21.8 | 34.4 | |
COOP:316122 | NEW HILL NC US | 201402 | 190 | 0 | 73 | 20 | 55.8 | 31.3 | 43.5 | |
COOP:316122 | NEW HILL NC US | 201403 | 569 | 0 | 76 | 16 | 55.9 | 30.3 | 43.1 | |
COOP:316122 | NEW HILL NC US | 201404 | 367 | 0 | 88 | 31 | 73.1 | 43.3 | 58.2 | |
COOP:316122 | NEW HILL NC US | 201405 | 790 | 0 | 92 | 44 | 81.4 | 55.3 | 68.4 | |
COOP:316122 | NEW HILL NC US | 201406 | 204 | 0 | 96 | 49 | 87.6 | 62.6 | 75.1 | |
COOP:316122 | NEW HILL NC US | 201407 | 564 | 0 | 97 | 59 | 87.1 | 65.5 | 76.3 | |
COOP:316122 | NEW HILL NC US | 201408 | 636 | 0 | 91 | 53 | 83.1 | 64.6 | 73.9 | |
COOP:316122 | NEW HILL NC US | 201409 | 301 | 0 | 94 | 53 | 79.5 | 62.5 | 71 | |
COOP:316122 | NEW HILL NC US | 201410 | 225 | 0 | 84 | 38 | 74.2 | 47.6 | 60.9 | |
COOP:316122 | NEW HILL NC US | 201411 | 412 | 0 | 75 | 16 | 56.8 | 32.1 | 44.5 | |
COOP:316122 | NEW HILL NC US | 201412 | 483 | 0 | 73 | 24 | 52.8 | 33.6 | 43.2 | |
COOP:316122 | NEW HILL NC US | 201501 | 426 | 0 | 68 | 10 | 49.2 | 26.5 | 37.9 | |
COOP:316122 | NEW HILL NC US | 201502 | 171 | 0 | 71 | 6 | 46.4 | 21.7 | 34 | |
COOP:316122 | NEW HILL NC US | 201503 | 246 | 0 | 82 | 18 | 62 | 36.1 | 49 | |
COOP:316122 | NEW HILL NC US | 201504 | 702 | 0 | 84 | 32 | 71.7 | 47.2 | 59.5 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html lang="en"> | |
<title>Webcharts - Chart with Multiple Marks</title> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
<link rel="stylesheet" href="https://rawgit.com/RhoInc/Webcharts/master/css/webcharts.css"> | |
<script src="http://d3js.org/d3.v3.min.js"></script> | |
<script src='https://rawgit.com/RhoInc/Webcharts/master/build/webcharts.js'></script> | |
</head> | |
<body style="padding:1em;"> | |
</body> | |
<script src="manyMarks.js" defer></script> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var settings = { | |
"max_width":"500", | |
"x":{ | |
"label":"", | |
"type":"time", | |
"column":"DATE", | |
"format": "%b'%y" | |
}, | |
"y":{ | |
"label": function(){return this.config.y.column+" (F)"; }, | |
"type":"linear", | |
"column":"Monthly Mean" | |
}, | |
date_format: "%Y%m", | |
"marks":[ | |
{ | |
"type":"circle", | |
"per":["STATION_NAME", "DATE"], | |
"tooltip":"[STATION_NAME]\n$x\n$y", | |
summarizeY: "mean" | |
}, | |
{ | |
"type":"line", | |
"per":[], | |
summarizeY: "mean", | |
attributes: {stroke: "#555"} | |
} | |
], | |
color_by: "STATION_NAME", | |
"gridlines":"xy", | |
"legend": { | |
"label": "Station" | |
} | |
}; | |
var controls = webCharts.createControls("body", {location: "top", | |
inputs:[ | |
{type: "dropdown", option: "y.column", label: "Y Values", values: ["Monthly Mean Max","Monthly Mean Min","Monthly Mean"], require: true}, | |
{type: "subsetter", value_col: "STATION_NAME", label: "Filter by Station", multiple: true} | |
] | |
}); | |
d3.csv("593576.csv", function(error, data){ | |
webCharts.createChart("body", settings, controls).init(data); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment