Skip to content

Instantly share code, notes, and snippets.

@drbh
Created April 16, 2016 11:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save drbh/4257b5a60c07a97e53b3ae2ef8ccb5d5 to your computer and use it in GitHub Desktop.
Save drbh/4257b5a60c07a97e53b3ae2ef8ccb5d5 to your computer and use it in GitHub Desktop.
<!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>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
{"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