Malaysia flag map using d3-composite-projections. The idea is based on this block by Saiful Azfar Ramlee.
<!DOCTYPE html>
<meta charset="utf-8">
<style>
</style>
<body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
<script src="https://unpkg.com/d3-composite-projections@1.2.0/d3-composite-projections.min.js"></script>
<script>
var width = 960,
height = 500;
var flags = [{},
{'name': 'Johor', 'img': "https://upload.wikimedia.org/wikipedia/commons/5/5a/Flag_of_Johor.svg"},
{'name': 'Kedah', 'img': "https://upload.wikimedia.org/wikipedia/commons/c/cc/Flag_of_Kedah.svg"},
{'name': 'Kelantan', 'img': "https://upload.wikimedia.org/wikipedia/commons/6/61/Flag_of_Kelantan.svg"},
{'name': 'Kuala Lumpur', 'img': "https://upload.wikimedia.org/wikipedia/commons/6/64/Flag_of_Kuala_Lumpur%2C_Malaysia.svg"},
{'name': 'Labuan', 'img': "https://upload.wikimedia.org/wikipedia/commons/0/00/Flag_of_the_Federal_Territories_of_Malaysia.svg"},
{'name': 'Melaka', 'img': "https://upload.wikimedia.org/wikipedia/commons/0/09/Flag_of_Malacca.svg"},
{'name': 'Negeri Sembilan', 'img': "https://upload.wikimedia.org/wikipedia/commons/d/db/Flag_of_Negeri_Sembilan.svg"},
{'name': 'Pahang', 'img': "https://upload.wikimedia.org/wikipedia/commons/a/aa/Flag_of_Pahang.svg"},
{'name': 'Perak', 'img': "https://upload.wikimedia.org/wikipedia/commons/8/87/Flag_of_Perak.svg"},
{'name': 'Perlis', 'img': "https://upload.wikimedia.org/wikipedia/commons/a/aa/Flag_of_Perlis.svg"},
{'name': 'Pulau Pinang', 'img': "https://upload.wikimedia.org/wikipedia/commons/d/d4/Flag_of_Penang_%28Malaysia%29.svg"},
{'name': 'Putrajaya', 'img': "https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Putrajaya.svg"},
{'name': 'Sabah', 'img': "https://upload.wikimedia.org/wikipedia/commons/b/b5/Flag_of_Sabah.svg"},
{'name': 'Sarawak', 'img': "https://upload.wikimedia.org/wikipedia/commons/7/7e/Flag_of_Sarawak.svg"},
{'name': 'Selangor', 'img': "https://upload.wikimedia.org/wikipedia/commons/0/0c/Flag_of_Selangor.svg"},
{'name': 'Terengganu', 'img': "https://upload.wikimedia.org/wikipedia/commons/6/6b/Flag_of_Terengganu.svg"},
]
var projection = d3.geoMercatorMalaysia();
var path = d3.geoPath()
.projection(projection);
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
var t = d3.transition();
d3.json("malaysia.json", function(error, malaysia) {
var states = topojson.feature(malaysia, malaysia.objects.states);
var land = topojson.feature(malaysia, malaysia.objects.land);
svg.selectAll(".land")
.data(land.features)
.enter()
.append("path")
.attr("class", "land")
.attr("d", path)
.style("fill", "#aca")
.style("stroke", "#000")
.style("stroke-width", "1px");
var statesEnter = svg.selectAll(".state")
.data(states.features)
.enter();
statesEnter.append("clipPath")
.attr("class","mask")
.attr("id",function(d){return "clip"+d.properties.id;})
.append("path")
.attr("d",path);
statesEnter.append("image")
.attr("xlink:href",function(d){return flags[d.properties.id].img;})
.attr("x", function(d){return path.bounds(d)[0][0];})
.attr("y", function(d){return path.bounds(d)[0][1];})
.attr("width", function(d){var bounds = path.bounds(d); return bounds[1][0] - bounds[0][0];})
.attr("height", function(d){var bounds = path.bounds(d); return bounds[1][1] - bounds[0][1];})
.attr("preserveAspectRatio","none")
.attr("clip-path", function(d){return "url(#clip"+d.properties.id+")";});
statesEnter.append("path")
.attr("class", "states")
.attr("d", path)
.style("stroke", "#000")
.style("fill", "none")
.style("stroke-width", "1px")
;
svg
.append("path")
.style("fill","none")
.style("stroke","#000")
.attr("d", projection.getCompositionBorders());
});
</script>