canvas-heatmap
Advanced tools
Comparing version 1.4.0 to 1.4.1
{ | ||
"name": "canvas-heatmap", | ||
"version": "1.4.0", | ||
"version": "1.4.1", | ||
"description": "Interactive heatmap, capable of displaying 1,000,000+ data points using canvas and d3. ", | ||
@@ -5,0 +5,0 @@ "main": "src/index.js", |
@@ -21,2 +21,3 @@ import { | ||
range, | ||
format, | ||
zoom as d3zoom, | ||
@@ -43,2 +44,3 @@ timeFormatDefaultLocale, | ||
languageOptions, | ||
scientificNotation, | ||
} from "./functions"; | ||
@@ -152,51 +154,2 @@ import { canvasGrid, canvasContour } from "./fillcanvas"; | ||
const prepareContours = (data, nullData, zDomain, options) => { | ||
var thresholds = range( | ||
zDomain[0], | ||
zDomain[1], | ||
(zDomain[1] - zDomain[0]) / options.thresholdStep | ||
); | ||
var step = (zDomain[1] - zDomain[0]) / options.thresholdStep; | ||
var baseContour = []; | ||
var mainContour = []; | ||
var nanContour = []; | ||
for (var i = 0; i < data.length; i++) { | ||
let cr = contours() | ||
.size([data[i].z[0].length, data[i].z.length]) | ||
.smooth(false); | ||
let c = contours().size([data[i].z[0].length, data[i].z.length]); | ||
let values = data[i].z.flat(); | ||
let nullValues = nullData[i].z.flat(); | ||
baseContour.push(cr.thresholds(thresholds)(values)[0]); | ||
mainContour.push(c.thresholds(thresholds)(values)); | ||
nanContour.push(cr.thresholds([options.zMax * 1000])(nullValues)[0]); | ||
} | ||
return { baseContour, mainContour, nanContour, step }; | ||
}; | ||
const replaceNull = (data, zMax) => { | ||
var nullData = JSON.parse(JSON.stringify(data)); | ||
for (var i = 0; i < data.length; i++) { | ||
for (var y = 1; y < data[i].z.length - 1; y++) { | ||
for (var x = 1; x < data[i].z[y].length - 1; x++) { | ||
if (data[i].z[y][x] === null || !isNumeric(data[i].z[y][x])) { | ||
if (data[i].z[y][x] !== null) data[i].z[y][x] = null; | ||
nullData[i].z[y][x] = zMax * 10; | ||
nullData[i].z[y][x + 1] = zMax * 10; | ||
nullData[i].z[y - 1][x + 1] = zMax * 10; | ||
nullData[i].z[y - 1][x] = zMax * 10; | ||
nullData[i].z[y - 1][x - 1] = zMax * 10; | ||
nullData[i].z[y][x - 1] = zMax * 10; | ||
nullData[i].z[y + 1][x - 1] = zMax * 10; | ||
nullData[i].z[y + 1][x] = zMax * 10; | ||
nullData[i].z[y + 1][x + 1] = zMax * 10; | ||
} | ||
} | ||
} | ||
} | ||
return nullData; | ||
}; | ||
const processOptions = (div, data, userOptions) => { | ||
@@ -283,6 +236,6 @@ var defaultOptions = [ | ||
if (!("marginLeft" in userOptions)) | ||
options.marginLeft = options.fontSize * 3 + 10; | ||
options.marginLeft = options.fontSize * 4 + 10; | ||
if (!("marginRight" in userOptions)) { | ||
if (options.legendRight) { | ||
options.marginRight = options.fontSize * 5 + 10; | ||
options.marginRight = options.fontSize * 5 + 12; | ||
} else { | ||
@@ -321,2 +274,51 @@ options.marginRight = 10; | ||
const prepareContours = (data, nullData, zDomain, options) => { | ||
var thresholds = range( | ||
zDomain[0], | ||
zDomain[1], | ||
(zDomain[1] - zDomain[0]) / options.thresholdStep | ||
); | ||
var step = (zDomain[1] - zDomain[0]) / options.thresholdStep; | ||
var baseContour = []; | ||
var mainContour = []; | ||
var nanContour = []; | ||
for (var i = 0; i < data.length; i++) { | ||
let cr = contours() | ||
.size([data[i].z[0].length, data[i].z.length]) | ||
.smooth(false); | ||
let c = contours().size([data[i].z[0].length, data[i].z.length]); | ||
let values = data[i].z.flat(); | ||
let nullValues = nullData[i].z.flat(); | ||
baseContour.push(cr.thresholds(thresholds)(values)[0]); | ||
mainContour.push(c.thresholds(thresholds)(values)); | ||
nanContour.push(cr.thresholds([options.zMax * 1000])(nullValues)[0]); | ||
} | ||
return { baseContour, mainContour, nanContour, step }; | ||
}; | ||
const replaceNull = (data, zMax) => { | ||
var nullData = JSON.parse(JSON.stringify(data)); | ||
for (var i = 0; i < data.length; i++) { | ||
for (var y = 1; y < data[i].z.length - 1; y++) { | ||
for (var x = 1; x < data[i].z[y].length - 1; x++) { | ||
if (data[i].z[y][x] === null || !isNumeric(data[i].z[y][x])) { | ||
if (data[i].z[y][x] !== null) data[i].z[y][x] = null; | ||
nullData[i].z[y][x] = zMax * 10; | ||
nullData[i].z[y][x + 1] = zMax * 10; | ||
nullData[i].z[y - 1][x + 1] = zMax * 10; | ||
nullData[i].z[y - 1][x] = zMax * 10; | ||
nullData[i].z[y - 1][x - 1] = zMax * 10; | ||
nullData[i].z[y][x - 1] = zMax * 10; | ||
nullData[i].z[y + 1][x - 1] = zMax * 10; | ||
nullData[i].z[y + 1][x] = zMax * 10; | ||
nullData[i].z[y + 1][x + 1] = zMax * 10; | ||
} | ||
} | ||
} | ||
} | ||
return nullData; | ||
}; | ||
const getDomain = (domain) => { | ||
@@ -420,2 +422,4 @@ var minarr = domain.map((d) => d[0]); | ||
axis.tickFormat(multiFormat); | ||
} else if (scientificNotation(xDomain[0], xDomain[1])) { | ||
axis.tickFormat(format(".1e")); | ||
} | ||
@@ -483,2 +487,4 @@ | ||
axis.tickFormat(multiFormat); | ||
} else if (scientificNotation(yDomain[0], yDomain[1])) { | ||
axis.tickFormat(format(".1e")); | ||
} | ||
@@ -537,2 +543,3 @@ | ||
const addLegendRight = (svg, options) => { | ||
console.log(options); | ||
var defs = svg.append("defs"); | ||
@@ -548,2 +555,10 @@ var ndp = 100; | ||
if (scientificNotation(options.zMin, options.zMax)) { | ||
t1 = t1.toExponential(); | ||
t2 = t2.toExponential(); | ||
t3 = t3.toExponential(); | ||
t4 = t4.toExponential(); | ||
t5 = t5.toExponential(); | ||
} | ||
var svgGradient = defs | ||
@@ -550,0 +565,0 @@ .append("linearGradient") |
@@ -367,1 +367,5 @@ export const convertToRGB = (hex) => { | ||
}; | ||
export const scientificNotation = (min, max) => { | ||
return (min > -0.0001 && max < 0.0001) || (min < -10000 || max > 10000) | ||
}; |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
944244
8120