Created
April 16, 2016 11:16
-
-
Save drbh/4257b5a60c07a97e53b3ae2ef8ccb5d5 to your computer and use it in GitHub Desktop.
This file contains hidden or 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
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>US Map of Nielsen Media Markets</title> | |
<style> | |
.background { | |
fill: none; | |
pointer-events: all; | |
} | |
.graticule { | |
fill: none; | |
stroke: #777; | |
stroke-width: .5; | |
stroke-opacity: .7; | |
} | |
#dma-borders { | |
fill: none; | |
stroke: black; | |
stroke-width: 0.7; | |
stroke-linejoin: round; | |
stroke-linecap: round; | |
pointer-events: none; | |
} | |
#textbox { | |
position: absolute; | |
top: 400px; | |
left: 50px; | |
width: 275px; | |
height: 100px; | |
} | |
#textbox text p { | |
font-family: Arial, Helvetica; | |
font-size: .8em; | |
margin: 0; | |
} | |
</style> | |
</head> | |
<body> | |
<div id="textbox"></div> | |
<script src="http://d3js.org/d3.v3.js"></script> | |
<script src="http://d3js.org/topojson.v1.min.js"></script> | |
<script> | |
var width = 960, | |
height = 500; | |
// custom add in for color scaling | |
var colorScale = d3.scale.linear().domain([0, 1500000]).range(['red','darkgreen']); | |
// sets the type of view | |
var projection = d3.geo.albersUsa() | |
.scale(1070) // size, bigger is bigger | |
.translate([width / 2, height / 2]); | |
//creates a new geographic path generator | |
var path = d3.geo.path().projection(projection); | |
var xScale = d3.scale.linear() | |
.domain([0, 7]) | |
.range([0, 500]); | |
var xAxis = d3.svg.axis() | |
.scale(xScale) | |
.orient("bottom") | |
.tickSize(13) | |
.tickFormat(d3.format("0.0f")); | |
//set svg window | |
var svg = d3.select("body") | |
.append("svg") | |
.attr("width", width) | |
.attr("height", height) | |
var graticule = d3.geo.graticule() | |
.extent([[-98 - 45, 38 - 45], [-98 + 45, 38 + 45]]) | |
.step([5, 5]); | |
// adding a blank background | |
svg.append("rect") | |
.datum(graticule) | |
.attr("class", "background") | |
.attr("width", width) | |
.attr("height", height) | |
// .on("click", clicked); | |
//declare g as our appended svg | |
var g = svg.append("g"); | |
var defaultFill = "#aaa"; | |
d3.json("nielsentopo.json", function(error, dma) { | |
var nielsen = dma.objects.nielsen_dma.geometries; | |
// adding data from tv json (number of TVs, etc) to map json | |
d3.json("tv.json", function(error, tv){ | |
for (var i = 0; i < nielsen.length; i++){ | |
var dma_code = nielsen[i].id; | |
for (key in tv[dma_code]){ | |
nielsen[i].properties[key] = tv[dma_code][key]; | |
} | |
} | |
dma.objects.nielsen_dma.geometries = nielsen; | |
g.append("g") | |
.attr("id", "dmas") | |
.selectAll("path") | |
.data(topojson.feature(dma, dma.objects.nielsen_dma).features) | |
.enter() | |
.append("path") | |
.attr("d", path) | |
//.on("click", clicked) | |
.on("mouseover", function(d){ | |
d3.select(this) | |
.attr("fill", "gold"); | |
var prop = d.properties; | |
var string = "<p><strong>DMA #: </strong>: " + prop.dma + "</p>"; | |
string += "<p><strong>Market Area Name</strong>: " + prop.city + "</p>"; | |
string += "<p><strong>Sales Generated</strong>: $" + numberWithCommas(prop["rev"]) + "</p>"; | |
d3.select("#textbox") | |
.html("") | |
.append("text") | |
.html(string) | |
}) | |
.on("mouseout", function(d){ | |
d3.select(this) | |
.attr("fill",colorScale(d['properties']['rev'])) | |
}) | |
.attr("opacity", 0.9) | |
.attr('fill', function(d) { | |
return colorScale(d['properties']['rev'])}); | |
// add dma borders | |
g.append("path", ".graticule") | |
.datum(topojson.mesh(dma, dma.objects.nielsen_dma, function(a, b) { | |
return true; | |
})) | |
.attr("id", "dma-borders") | |
.attr("d", path); | |
}) | |
}) | |
// via http://stackoverflow.com/a/2901298 | |
function numberWithCommas(x) { | |
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); | |
} | |
</script> | |
</body> | |
</html> |
This file contains hidden or 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
{"500":{"rev":397935.14,"city":"Portland-Auburn, ME"},"501":{"rev":2725153.91,"city":"New York, NY"},"502":{"rev":96974.13,"city":"Binghamton, NY"},"503":{"rev":596684.78,"city":"Macon, GA"},"504":{"rev":1766700.33,"city":"Philadelphia, PA"},"505":{"rev":1348494.47,"city":"Detroit, MI"},"506":{"rev":705447.19,"city":"Boston, MA-Manchester, NH"},"507":{"rev":1121207.01,"city":"Savannah, GA"},"508":{"rev":883274.81,"city":"Pittsburgh, PA"},"509":{"rev":153943.21,"city":"Ft. Wayne, IN"},"510":{"rev":1926131.8,"city":"Cleveland-Akron (Canton), OH"},"512":{"rev":1972933.55,"city":"Baltimore, MD"},"513":{"rev":406265.28,"city":"Flint-Saginaw-Bay City, MI"},"514":{"rev":519119.47,"city":"Buffalo, NY"},"515":{"rev":5051310.9,"city":"Cincinnati, OH"},"516":{"rev":242416.48,"city":"Erie, PA"},"517":{"rev":4778032.41,"city":"Charlotte, NC"},"518":{"rev":775967.77,"city":"Greensboro-High Point-Winston Salem, NC"},"519":{"rev":545186.72,"city":"Charleston, SC"},"520":{"rev":267628.16,"city":"Augusta, GA"},"521":{"rev":193832.4,"city":"Providence, RI-New Bedford, MA"},"522":{"rev":144219.74,"city":"Columbus, GA"},"523":{"rev":294837.82,"city":"Burlington, VT-Plattsburgh, NY"},"524":{"rev":4926582.06,"city":"Atlanta, GA"},"525":{"rev":470040.29,"city":"Albany, GA"},"526":{"rev":71679.57,"city":"Utica, NY"},"527":{"rev":1492723.64,"city":"Indianapolis, IN"},"528":{"rev":3098829.28,"city":"Miami-Ft. Lauderdale, FL"},"529":{"rev":1166144.78,"city":"Louisville, KY"},"530":{"rev":226926.92,"city":"Tallahassee, FL-Thomasville, GA"},"531":{"rev":386081.01,"city":"Tri-Cities, TN-VA"},"532":{"rev":748881.5,"city":"Albany-Schenectady-Troy, NY"},"533":{"rev":926564.51,"city":"Hartford & New Haven, CT"},"534":{"rev":2985943.04,"city":"Orlando-Daytona Beach-Melbourne, FL"},"535":{"rev":8870433.17,"city":"Columbus, OH"},"536":{"rev":625410.53,"city":"Youngstown, OH"},"537":{"rev":135122.09,"city":"Bangor, ME"},"538":{"rev":360361.51,"city":"Rochester, NY"},"539":{"rev":1570650.38,"city":"Tampa-St Petersburg (Sarasota), FL"},"540":{"rev":279232.46,"city":"Traverse City-Cadillac, MI"},"541":{"rev":4784828.08,"city":"Lexington, KY"},"542":{"rev":1033586.55,"city":"Dayton, OH"},"543":{"rev":194898.67,"city":"Springfield-Holyoke, MA"},"544":{"rev":3075910.54,"city":"Norfolk-Portsmouth-Newport News,VA"},"545":{"rev":529478.74,"city":"Greenville-New Bern-Washington, NC"},"546":{"rev":368627.83,"city":"Columbia, SC"},"547":{"rev":614389.85,"city":"Toledo, OH"},"548":{"rev":725836.64,"city":"West Palm Beach-Ft. Pierce, FL"},"549":{"rev":178402.17,"city":"Watertown, NY"},"550":{"rev":1215459.68,"city":"Wilmington, NC"},"551":{"rev":255654.67,"city":"Lansing, MI"},"552":{"rev":36537.55,"city":"Presque Isle, ME"},"553":{"rev":103790.56,"city":"Marquette, MI"},"554":{"rev":113428.25,"city":"Wheeling, WV-Steubenville, OH"},"555":{"rev":344451.98,"city":"Syracuse, NY"},"556":{"rev":2561292.62,"city":"Richmond-Petersburg, VA"},"557":{"rev":1305482.76,"city":"Knoxville, TN"},"558":{"rev":233157.85,"city":"Lima, OH"},"559":{"rev":546380.08,"city":"Bluefield-Beckley-Oak Hill, WV"},"560":{"rev":4326184.5,"city":"Raleigh-Durham (Fayetteville), NC"},"561":{"rev":484662.39,"city":"Jacksonville, FL"},"563":{"rev":569095.03,"city":"Grand Rapids-Kalamazoo-Battle Creek, MI"},"564":{"rev":1842047.01,"city":"Charleston-Huntington, WV"},"565":{"rev":69335.63,"city":"Elmira, NY"},"566":{"rev":511301.43,"city":"Harrisburg-Lancaster-Lebanon-York, PA"},"567":{"rev":637213.08,"city":"Greenville-Spartanburg, SC-Asheville, NC-Anderson, SC"},"569":{"rev":206851.59,"city":"Harrisonburg, VA"},"570":{"rev":569283.13,"city":"Florence-Myrtle Beach, SC"},"571":{"rev":881291.03,"city":"Ft. Myers-Naples, FL"},"573":{"rev":804198.04,"city":"Roanoke-Lynchburg, VA"},"574":{"rev":254626.15,"city":"Johnstown-Altoona, PA"},"575":{"rev":302676.98,"city":"Chattanooga, TN"},"576":{"rev":209219.28,"city":"Salisbury, MD"},"577":{"rev":596866.94,"city":"Wilkes Barre-Scranton, PA"},"581":{"rev":262834.08,"city":"Terre Haute, IN"},"582":{"rev":119812.19,"city":"Lafayette, IN"},"583":{"rev":23330.75,"city":"Alpena, MI"},"584":{"rev":360156.86,"city":"Charlottesville, VA"},"588":{"rev":312268.78,"city":"South Bend-Elkhart, IN"},"592":{"rev":190751.58,"city":"Gainesville, FL"},"596":{"rev":72385.14,"city":"Zanesville, OH"},"597":{"rev":222039.26,"city":"Parkersburg, WV"},"598":{"rev":537002.86,"city":"Clarksburg-Weston, WV"},"600":{"rev":649929.7,"city":"Corpus Christi, TX"},"602":{"rev":5152901.92,"city":"Chicago, IL"},"603":{"rev":94849.03,"city":"Joplin, MO-Pittsburg, KS"},"604":{"rev":430889.27,"city":"Columbia-Jefferson City, MO"},"605":{"rev":428450.56,"city":"Topeka, KS"},"606":{"rev":69447.57,"city":"Dothan, AL"},"609":{"rev":672901.6,"city":"St. Louis, MO"},"610":{"rev":146134.58,"city":"Rockford, IL"},"611":{"rev":53651.75,"city":"Rochester, MN-Mason City, IA-Austin, MN"},"612":{"rev":163802.74,"city":"Shreveport, LA"},"613":{"rev":817806.24,"city":"Minneapolis-St. Paul, MN"},"616":{"rev":1161310.05,"city":"Kansas City, MO"},"617":{"rev":604170,"city":"Milwaukee, WI"},"618":{"rev":12947806.38,"city":"Houston, TX"},"619":{"rev":473838.43,"city":"Springfield, MO"},"622":{"rev":649956.59,"city":"New Orleans, LA"},"623":{"rev":3370999.63,"city":"Dallas-Ft. Worth, TX"},"624":{"rev":65170.14,"city":"Sioux City, IA"},"625":{"rev":653815.73,"city":"Waco-Temple-Bryan, TX"},"626":{"rev":133742.62,"city":"Victoria, TX"},"627":{"rev":162024.34,"city":"Wichita Falls, TX & Lawton, OK"},"628":{"rev":71612.06,"city":"Monroe, LA-El Dorado, AR"},"630":{"rev":720306.91,"city":"Birmingham, AL"},"631":{"rev":40753.36,"city":"Ottumwa, IA-Kirksville, MO"},"632":{"rev":390711.42,"city":"Paducah, KY-Cape Girardeau, MO-Harrisburg-Mount Vernon, IL"},"633":{"rev":497550.45,"city":"Odessa-Midland, TX"},"634":{"rev":339084.36,"city":"Amarillo, TX"},"635":{"rev":2823583.25,"city":"Austin, TX"},"636":{"rev":1412896.68,"city":"Harlingen-Weslaco-Brownsville-McAllen, TX"},"637":{"rev":290159.65,"city":"Cedar Rapids-Waterloo-Iowa City & Dubuque, IA"},"638":{"rev":108516.18,"city":"St. Joseph, MO"},"639":{"rev":196884.9,"city":"Jackson, TN"},"640":{"rev":575490.73,"city":"Memphis, TN"},"641":{"rev":1967620.82,"city":"San Antonio, TX"},"642":{"rev":74402.08,"city":"Lafayette, LA"},"643":{"rev":157499.34,"city":"Lake Charles, LA"},"644":{"rev":118699.39,"city":"Alexandria, LA"},"647":{"rev":48607.41,"city":"Greenwood-Greenville, MS"},"648":{"rev":866538.13,"city":"Champaign & Springfield-Decatur,IL"},"649":{"rev":146982.33,"city":"Evansville, IN"},"650":{"rev":1472067.81,"city":"Oklahoma City, OK"},"651":{"rev":326975.38,"city":"Lubbock, TX"},"652":{"rev":336802.54,"city":"Omaha, NE"},"656":{"rev":425817.06,"city":"Panama City, FL"},"657":{"rev":298409.87,"city":"Sherman, TX-Ada, OK"},"658":{"rev":414438.09,"city":"Green Bay-Appleton, WI"},"659":{"rev":1685466.03,"city":"Nashville, TN"},"661":{"rev":144133.75,"city":"San Angelo, TX"},"662":{"rev":216298.06,"city":"Abilene-Sweetwater, TX"},"669":{"rev":1443479.17,"city":"Madison, WI"},"670":{"rev":336820.18,"city":"Ft. Smith-Fayetteville-Springdale-Rogers, AR"},"671":{"rev":989178.3,"city":"Tulsa, OK"},"673":{"rev":257133.47,"city":"Columbus-Tupelo-West Point, MS"},"675":{"rev":268138.97,"city":"Peoria-Bloomington, IL"},"676":{"rev":97321.62,"city":"Duluth, MN-Superior, WI"},"678":{"rev":1055723.52,"city":"Wichita-Hutchinson, KS"},"679":{"rev":379608.56,"city":"Des Moines-Ames, IA"},"682":{"rev":192636.13,"city":"Davenport,IA-Rock Island-Moline,IL"},"686":{"rev":337950.14,"city":"Mobile, AL-Pensacola (Ft. Walton Beach), FL"},"687":{"rev":371648.85,"city":"Minot-Bismarck-Dickinson(Williston), ND"},"691":{"rev":442072.98,"city":"Huntsville-Decatur (Florence), AL"},"692":{"rev":406289.59,"city":"Beaumont-Port Arthur, TX"},"693":{"rev":928700.76,"city":"Little Rock-Pine Bluff, AR"},"698":{"rev":125523.22,"city":"Montgomery (Selma), AL"},"702":{"rev":358567.82,"city":"La Crosse-Eau Claire, WI"},"705":{"rev":202639.01,"city":"Wausau-Rhinelander, WI"},"709":{"rev":453756.71,"city":"Tyler-Longview(Lufkin & Nacogdoches), TX"},"710":{"rev":101690.59,"city":"Hattiesburg-Laurel, MS"},"711":{"rev":100073.13,"city":"Meridian, MS"},"716":{"rev":659010.88,"city":"Baton Rouge, LA"},"717":{"rev":18288.88,"city":"Quincy, IL-Hannibal, MO-Keokuk, IA"},"718":{"rev":437016.36,"city":"Jackson, MS"},"722":{"rev":274489.55,"city":"Lincoln & Hastings-Kearney, NE"},"724":{"rev":210636.24,"city":"Fargo-Valley City, ND"},"725":{"rev":468896.46,"city":"Sioux Falls(Mitchell), SD"},"734":{"rev":67199.84,"city":"Jonesboro, AR"},"736":{"rev":86441.97,"city":"Bowling Green, KY"},"737":{"rev":34224.9,"city":"Mankato, MN"},"740":{"rev":21840.8,"city":"North Platte, NE"},"743":{"rev":549565.1,"city":"Anchorage, AK"},"744":{"rev":630731,"city":"Honolulu, HI"},"745":{"rev":159534.73,"city":"Fairbanks, AK"},"746":{"rev":207092.91,"city":"Biloxi-Gulfport, MS"},"747":{"rev":142049.81,"city":"Juneau, AK"},"749":{"rev":425371.73,"city":"Laredo, TX"},"751":{"rev":2140463.14,"city":"Denver, CO"},"752":{"rev":629578.65,"city":"Colorado Springs-Pueblo, CO"},"753":{"rev":2124492.89,"city":"Phoenix, AZ"},"754":{"rev":85630.47,"city":"Butte-Bozeman, MT"},"755":{"rev":169094.73,"city":"Great Falls, MT"},"756":{"rev":160571.27,"city":"Billings, MT"},"757":{"rev":427523.94,"city":"Boise, ID"},"758":{"rev":303818.63,"city":"Idaho Falls-Pocatello, ID"},"759":{"rev":8658.65,"city":"Cheyenne, WY-Scottsbluff, NE"},"760":{"rev":52749.29,"city":"Twin Falls, ID"},"762":{"rev":109742.66,"city":"Missoula, MT"},"764":{"rev":110100.13,"city":"Rapid City, SD"},"765":{"rev":521884.06,"city":"El Paso, TX"},"766":{"rev":53957.61,"city":"Helena, MT"},"767":{"rev":113221.74,"city":"Casper-Riverton, WY"},"770":{"rev":521684.99,"city":"Salt Lake City, UT"},"771":{"rev":78201.49,"city":"Yuma, AZ-El Centro, CA"},"773":{"rev":251016.57,"city":"Grand Junction-Montrose, CO"},"789":{"rev":449534.9,"city":"Tucson (Sierra Vista), AZ"},"790":{"rev":1208466.03,"city":"Albuquerque-Santa Fe, NM"},"798":{"rev":16450.33,"city":"Glendive, MT"},"800":{"rev":654719.31,"city":"Bakersfield, CA"},"801":{"rev":219436.71,"city":"Eugene, OR"},"802":{"rev":96102.33,"city":"Eureka, CA"},"803":{"rev":25953539.88,"city":"Los Angeles, CA"},"804":{"rev":282260.58,"city":"Palm Springs, CA"},"807":{"rev":6904089.12,"city":"San Francisco-Oakland-San Jose, CA"},"810":{"rev":478302.59,"city":"Yakima-Pasco-Richland-Kennewick, WA"},"811":{"rev":340478.71,"city":"Reno, NV"},"813":{"rev":295184.59,"city":"Medford-Klamath Falls, OR"},"819":{"rev":5756813.96,"city":"Seattle-Tacoma, WA"},"820":{"rev":2074768.52,"city":"Portland, OR"},"821":{"rev":110558.35,"city":"Bend, OR"},"825":{"rev":1021719.61,"city":"San Diego, CA"},"828":{"rev":266024.76,"city":"Monterey-Salinas, CA"},"839":{"rev":842332.65,"city":"Las Vegas, NV"},"855":{"rev":327506.01,"city":"Santa Barbara-Santa Maria-San Luis Obispo, CA"},"862":{"rev":3376856.19,"city":"Sacramento-Stockton-Modesto, CA"},"866":{"rev":558601.28,"city":"Fresno-Visalia, CA"},"868":{"rev":223675.9,"city":"Chico-Redding, CA"},"881":{"rev":1082361.96,"city":"Spokane, WA"}} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment