Skip to content

Instantly share code, notes, and snippets.

@renauld94

renauld94/.block

Created November 12, 2018 10:10
Show Gist options
  • Save renauld94/7ce0175f526d9633c74c40863d86a951 to your computer and use it in GitHub Desktop.
Save renauld94/7ce0175f526d9633c74c40863d86a951 to your computer and use it in GitHub Desktop.
Download ZIP
Labels Colors
Raw
.block
license: mit
height: 1000
Raw
README.md
Raw
index.html
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="dc.css">
<link rel="stylesheet" type="text/css" href="https://unpkg.com/dc@2/dc.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div id="Districtname">
<span class="reset" style="display: none;">Selected: <span class="filter">
</span></span>
<a class="reset" href="
javascript:districtnamechart.filterAll();dc.redrawAll();" style="display:
none;">reset</a>
<div class="clearfix"></div>
</div>
<div id="pop">
<span class="reset" style="display: none;">Selected: <span class="filter">
</span></span>
<a class="reset" href="
javascript:popnamechart.filterAll();dc.redrawAll();" style="display:
none;">reset</a>
<div class="clearfix"></div>
</div>
//DISPLAY MAP
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css" />
<style>
#mapid { height: 180px; }
</style>
</head>
<body>
<div id="mapid" style="width: 500px; height: 400px;"></div>
<script src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
<script>
var mymap = L.map('mapid').setView([10.762622, 106.660172], 13);
var pharmaciesMarkers = new L.FeatureGroup();
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(mymap);
</script>
</body>
<script src="https://unpkg.com/[email protected]/crossfilter.js"></script>
<script src="https://unpkg.com/d3@3/d3.js"></script>
<script src="https://unpkg.com/dc@2/dc.js"></script>
<script>
var districtnamechart = dc.rowChart("#Districtname"),
wardnamechart = dc.rowChart("#wardname"),
popnamechart = dc.rowChart("#pop"),
visCount = dc.dataCount(".dc-data-count"),
visTable = dc.dataTable(".dc-data-table"),
yearchart = dc.pieChart("dateDim");
d3.csv("universe_test.csv", function (err,data) {
//,kmist,city,district,ward,Lat,Long
//0,KTMPVN15707,Ho Chi Minh,Can Gio,Can Thanh,10.41525,106.97254
//1,KTMPVN15706,Ho Chi Minh,Can Gio,Can Thanh,10.41392,106.9705
if (err) throw err;
data.forEach(function (d) {
d.Timestamp = new Date(d.Timestamp);
});
var fullDateFormat = d3.time.format('%a, %d %b %Y %X %Z');
var yearFormat = d3.time.format('%Y');
var monthFormat = d3.time.format('%b');
var dayOfWeekFormat = d3.time.format('%a');
var ndx = crossfilter(data);
var all = ndx.groupAll();
var allDim = ndx.dimension(function(d) {return d;});
var dateDim = ndx.dimension(function (d) { return d.Timestamp; });
var yearDim = ndx.dimension(function (d) { return d["first_had_year"]; })
;
var districtDIM = ndx.dimension(function (d) { return d["district"]; })
;
var wardDIM = ndx.dimension(function (d) { return d["ward"]; })
;
var popDIM = ndx.dimension(function (d) { return d["pop"];
});
var districtgroup = districtDIM.group();
var wardgroup = wardDIM.group();
var popgroup = popDIM.group();
var dateGroup = dateDim.group();
var countPerYear = yearDim.group().reduceCount();
popnamechart
.dimension(popDIM)
.height(100)
.width(700)
.group(popgroup)
.elasticX(true)
yearchart
.dimension(dateDim)
.group(countPerYear)
visCount
.dimension(ndx)
.group(all);
visTable
.dimension(dateDim)
// Data table does not use crossfilter group but rather a closure
// as a grouping function
.group(function (d) {
var format = d3.format('02d');
return d.Timestamp.getFullYear() + '/' + format((d.Timestamp.getMonth() + 1));
})
.columns([
"Timestamp",
"KMIST_TEMP_ID",
"ID POP",
"CUSTOMER NAME",
"district",
"ward",
]);
// update map with pharmacies to match filtered data
pharmaciesMarkers.clearLayers();
allDim.top(Infinity).forEach(function (d) {
//var loc = d.KMIST_TEMP_ID;
var marker = L.marker([+d.lat, +d.lng]);
marker.bindPopup("<p>" + name + " " + d.district + " " + d.ward + "</p>");
pharmaciesMarkers.addLayer(marker);
});
mymap.addLayer(pharmaciesMarkers);
mymap.fitBounds(pharmaciesMarkers.getBounds());
dc.renderAll();
});
</script>
</body>
</html>
Raw
universe_test.csv
KMIST_TEMP_ID ID POP pop Timestamp panel CUSTOMER NAME city district ward lat lng
KTMPVN12119 2018 2018-07-11 22:50 Nha Thuoc An Binh Ho Chi Minh Thu Duc Linh Trung 10.8539167 106.7716921
KTMPVN12144 17019 2018 2017-10-15 18:05 Nha Thuoc Thuy Nguyen Ho Chi Minh Binh Thanh 21 10.798508 106.711179
KTMPVN12149 2018 2018-03-25 16:13 Nha Thuoc Tay Anh Phuong Ho Chi Minh Binh Thanh 13 10.813232 106.70039
KTMPVN12162 2018 2018-08-14 8:24 Nha Thuoc The Ky Ho Chi Minh 1 NA 10.7732238 106.6986981
KTMPVN12191 2018 2018-04-28 19:27 Nha Thuoc Kim Ngan Ho Chi Minh Tan Phu Hoa Thanh 10.7840823 106.6392241
KTMPVN12199 2018 2018-02-22 21:29 Nha Thuoc Mai Khuong Ho Chi Minh 11 10 10.762648 106.642335
KTMPVN12201 2018 2018-08-30 20:07 Nha Thuoc Mai Thao Ho Chi Minh Tan Phu Tan Thoi Hoa 10.765549 106.63155
KTMPVN12242 2018 2018-04-29 8:44 Nha Thuoc Anh Phuong Ho Chi Minh Binh Thanh Binh Hung Hoa 10.8176735 106.6042386
KTMPVN12275 2018 2018-07-24 9:31 Nha Thuoc Thu Huong Ho Chi Minh Go Vap 18 10.8515163 106.6622063
KTMPVN12277 23815 2018 2017-12-17 13:07 Nha Thuoc Ngoc Diep Ho Chi Minh Phu Nhuan 5 10.8049906 106.6870048
KTMPVN12391 Never Covered 2018-08-04 19:13 Nha Thuoc Thien Phuc Ho Chi Minh 10 4 10.7622278 106.6699374
KTMPVN12399 7923 Never Covered 2017-11-09 3:06 Nha Thuoc Minh Chau Ho Chi Minh 10 12 10.7728525 106.665413
KTMPVN13749 Never Covered 2017-11-25 5:16 Nha Thuoc Hoang Tri Ho Chi Minh 3 13 10.785097 106.678377
KTMPVN13750 Never Covered 2018-01-16 1:25 Nha Thuoc Duc Thinh Ho Chi Minh Tan Binh Tan Thanh 10.787494 106.640947
KTMPVN13751 8701 Never Covered 2017-08-23 17:51 Nha Thuoc Phu Thinh Ho Chi Minh Go Vap 5 10.8283487 106.6898297
KTMPVN13752 Never Covered 2018-06-20 18:38 Nha Thuoc Truang An Ho Chi Minh 7 Phu Thuan 10.731497 106.731839
KTMPVN13753 14091 Never Covered 2018-07-11 10:01 Nha Thuoc Bao Tran Ho Chi Minh Phu Nhuan 5 10.8043036 106.683745
KTMPVN13754 Never Covered 2018-02-09 21:56 Nha Thuoc Minh Tam Ho Chi Minh 5 9 10.760286 106.67118
KTMPVN13755 Never Covered 2017-04-14 16:50 Nha Thuoc Minh Thu Ho Chi Minh Binh Thanh Binh Tri Dong 10.75636 106.623667
KTMPVN13756 Never Covered 2018-01-19 15:31 Nha Thuoc Tu Nhan Nam Phuong Ho Chi Minh Tan Phu Hoa Thanh 10.775237 106.633015
KTMPVN13757 Other Periods 2017-11-17 19:27 Hieu Thuoc Tay So 1 - Cholipharco Ho Chi Minh 5 2 10.75829 106.68113
KTMPVN13758 Other Periods 2017-10-17 2:39 Hieu Thuoc So 1 Ho Chi Minh 3 1 10.769171 106.677917
KTMPVN13759 Other Periods 2017-09-02 10:03 Nha Thuoc Quynh Giao Ho Chi Minh Binh Thanh Binh Tri Dong 10.758138 106.611612
KTMPVN13760 Other Periods 2018-01-31 13:26 Nha Thuoc Thanh Son Ho Chi Minh 1 Nguyen Thai Binh 10.77002 106.700455
KTMPVN13761 Other Periods 2018-09-07 1:36 Nha Thuoc Diem Ha Ho Chi Minh 1 Ben Than 10.77186 106.697069
KTMPVN13762 Other Periods 2018-05-17 7:36 Hieu Thuoc So 7 Ho Chi Minh 1 Ben Nghe 10.771181 106.702459
KTMPVN13763 Other Periods 2017-11-06 6:37 Nha Thuoc Tu Nhan Hai Ho Chi Minh 1 Pham Ngu Lao 10.766903 106.687943
KTMPVN13764 Other Periods 2017-11-21 15:11 Nha Thuoc Dang Khoa Ho Chi Minh 1 Da Kao 10.791071 106.696652
KTMPVN13765 Other Periods 2018-06-07 22:01 Nha Thuoc Tu Nhan Da Kao Ho Chi Minh 1 Da Kao 10.792805 106.696823
KTMPVN13766 Other Periods 2018-04-21 15:28 Nha Thuoc Chau Ngoc Ho Chi Minh 1 Ben Nghe 10.77673 106.6999
KTMPVN13767 Other Periods 2018-04-24 17:03 Nha Thuoc Tu Nhan 183 Ho Chi Minh 1 Ngu Lao 10.766118 106.691269
KTMPVN13768 Other Periods 2018-08-02 19:40 Hieu Thuoc So 12 Ho Chi Minh 1 Ngu Lao 10.76983 106.68842
KTMPVN13769 Other Periods 2018-09-03 14:19 Nha Thuoc TOT (Nha Thuoc Thu Nhan Phuong Anh Cu) Ho Chi Minh 1 Da Kao 10.792765 106.696252
KTMPVN13770 Other Periods 2018-03-01 14:32 Hieu Thuoc So 7 Ho Chi Minh 1 Ben Thanh 10.773284 106.698318
KTMPVN13771 Other Periods 2017-10-20 12:24 Nha Thuoc Ngoc Duyen Ho Chi Minh 1 Da Kao 10.791822 106.700154
KTMPVN13772 Other Periods 2018-01-24 2:46 Nha Thuoc Hong An Ho Chi Minh 1 Cau Kho 10.758499 106.688412
KTMPVN13773 Other Periods 2017-09-01 16:10 Nha Thuoc Minh Tam Ho Chi Minh 10 8 10.765563 106.666625
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment