diff --git a/public/js/appChart.js b/public/js/appChart.js index 81de4543060fcf9d5a591a561b1b97a1c689dd3c..fe00205c662cba5f9b9dca18c282f72a5cae3548 100644 --- a/public/js/appChart.js +++ b/public/js/appChart.js @@ -662,12 +662,19 @@ const drawScatterPlotHC = function ( const SERIES_2_TEXT_COLOR = `rgb(${SERIES_2_SYMBOL_COLOR_RGB_ELEMENTS})`; // remove transparency from symbol color for a more "intense" color const SERIES_2_SYMBOL = `${PHENOMENON_SYMBOL_SERIES_2}`; + const MARKER_RADIUS = 2; + Highcharts.chart("chart-scatter-plot", { chart: { type: "scatter", zoomType: "xy", }, + boost: { + useGPUTranslations: true, + usePreAllocated: true, + }, + title: { text: CHART_TITLE, }, @@ -721,21 +728,24 @@ const drawScatterPlotHC = function ( }, ], + // legend: { + // layout: "vertical", + // align: "left", + // verticalAlign: "top", + // x: 100, + // y: 70, + // floating: true, + // backgroundColor: Highcharts.defaultOptions.chart.backgroundColor, + // borderWidth: 1, + // }, legend: { - layout: "vertical", - align: "left", - verticalAlign: "top", - x: 100, - y: 70, - floating: true, - backgroundColor: Highcharts.defaultOptions.chart.backgroundColor, - borderWidth: 1, + enabled: false, }, plotOptions: { scatter: { marker: { - radius: 5, + radius: MARKER_RADIUS, states: { hover: { enabled: true, @@ -782,7 +792,10 @@ const drawScatterPlotHC = function ( }); }; -(async () => { +/** + * Test drawing of scatter plot chart + */ +const drawScatterPlotHCTest = async function () { // Input array - building, sensor, samplingRate const sensorsOfInterestArr = [ ["weather_station_521", "outside_temp", "60min"], @@ -807,6 +820,10 @@ const drawScatterPlotHC = function ( formatSTAResponseForLineChartOrScatterPlot(obsSensorTwoArr), formatDatastreamMetadataForChart(metadataSensorTwo) ); +}; + +(async () => { + await drawScatterPlotHCTest(); })(); export {