(data, yLabel, xLabel, dest, yMin, yMax, finiteScale = false, visColors, scaleType, stepped = false)
| 13 | const panelsOffset = 402; // should be 722 ...not 752 |
| 14 | |
| 15 | function createChart(data, yLabel, xLabel, dest, yMin, yMax, finiteScale = false, visColors, scaleType, stepped = false) { |
| 16 | let chartWidth, chartHeight; |
| 17 | const windowWidth = window.innerWidth; |
| 18 | const windowHeight = window.innerHeight; |
| 19 | let adjustedHeight = (windowHeight - 300) / 2; // subtract heading, tabs height and padding from measurement |
| 20 | let adjustedWidth; |
| 21 | const maxWidth = 792; |
| 22 | |
| 23 | if (dest === '#interpolationChart' || dest === '#interpolationChart2' || dest === '#interpolationChart3') { |
| 24 | let availableWidth = windowWidth - panelsOffset; // subtract panel width and padding from measurement |
| 25 | let newMaxWidth = 548; //476 |
| 26 | adjustedWidth = availableWidth < newMaxWidth ? availableWidth : newMaxWidth; |
| 27 | |
| 28 | chartWidth = adjustedWidth; |
| 29 | adjustedHeight = (windowHeight - 332) / 3; |
| 30 | chartHeight = 178; |
| 31 | } |
| 32 | if (dest === `#${scaleType}InterpolationChart` || dest === `#${scaleType}InterpolationChart2` || dest === `#${scaleType}InterpolationChart3`) { |
| 33 | let availableWidth = windowWidth - (388 + 34) - 8; // subtract panel width and padding from measurement |
| 34 | let newMaxWidth = 476; |
| 35 | adjustedWidth = availableWidth < newMaxWidth ? availableWidth : newMaxWidth; |
| 36 | |
| 37 | chartWidth = adjustedWidth; |
| 38 | adjustedHeight = (windowHeight - 332) / 3; |
| 39 | chartHeight = 196; |
| 40 | } |
| 41 | if (dest === `#sequentialRGBchart` || dest === '#divergingRGBchart') { |
| 42 | chartWidth = 368; |
| 43 | adjustedHeight = (windowHeight - 332) / 3; |
| 44 | chartHeight = 196; // 196 |
| 45 | } |
| 46 | if (dest === '#RGBchart') { |
| 47 | chartWidth = 368; |
| 48 | adjustedHeight = (windowHeight - 332) / 3; |
| 49 | chartHeight = 216; |
| 50 | } |
| 51 | if (dest === '#contrastChart' || dest === '#detailContrastChart' || dest === '#luminosityChart' || dest === '#detailLightnessChart') { |
| 52 | adjustedWidth = windowWidth - panelsOffset; |
| 53 | chartWidth = adjustedWidth < maxWidth ? adjustedWidth : maxWidth; |
| 54 | } |
| 55 | if (dest === '#contrastChart' || dest === '#luminosityChart') { |
| 56 | if (windowHeight < 900) chartHeight = windowHeight / 2 - 174; |
| 57 | else chartHeight = 300; |
| 58 | } |
| 59 | if (dest === '#detailContrastChart' || dest === '#detailLightnessChart') { |
| 60 | chartHeight = 240; |
| 61 | } |
| 62 | |
| 63 | let xy_chart = d3_xy_chart().width(chartWidth).height(chartHeight).xlabel(xLabel).ylabel(yLabel); |
| 64 | |
| 65 | let svg = d3.select(dest).append('svg').datum(data).call(xy_chart); |
| 66 | |
| 67 | function d3_xy_chart() { |
| 68 | let width = chartWidth, |
| 69 | height = chartHeight, |
| 70 | xlabel = 'X Axis Label', |
| 71 | ylabel = 'Y Axis Label'; |
| 72 |
no test coverage detected