.heatmap .slice_container { position: relative; top: 0; left: 0; height: 100%; } .heatmap .axis text { font: 10px sans-serif; text-rendering: optimizeLegibility; } .heatmap .axis path, .heatmap .axis line { fill: none; stroke: #000; shape-rendering: crispEdges; } .heatmap svg { } .heatmap canvas, .heatmap img { image-rendering: optimizeSpeed; /* Older versions of FF */ image-rendering: -moz-crisp-edges; /* FF 6.0+ */ image-rendering: -webkit-optimize-contrast; /* Safari */ image-rendering: -o-crisp-edges; /* OS X & Windows Opera (12.02+) */ image-rendering: pixelated; /* Awesome future-browsers */ -ms-interpolation-mode: nearest-neighbor; /* IE */ } /* from d3-tip */ .d3-tip { line-height: 1; font-weight: bold; padding: 12px; background: rgba(0, 0, 0, 0.8); color: #fff; border-radius: 2px; pointer-events: none; z-index: 1000; } /* Creates a small triangle extender for the tooltip */ .d3-tip:after { box-sizing: border-box; display: inline; font-size: 10px; width: 100%; line-height: 1; color: rgba(0, 0, 0, 0.8); position: absolute; pointer-events: none; } /* Northward tooltips */ .d3-tip.n:after { content: "\25BC"; margin: -1px 0 0 0; top: 100%; left: 0; text-align: center; } /* Eastward tooltips */ .d3-tip.e:after { content: "\25C0"; margin: -4px 0 0 0; top: 50%; left: -8px; } /* Southward tooltips */ .d3-tip.s:after { content: "\25B2"; margin: 0 0 1px 0; top: -8px; left: 0; text-align: center; } /* Westward tooltips */ .d3-tip.w:after { content: "\25B6"; margin: -4px 0 0 -1px; top: 50%; left: 100%; }