Every mouse event triggers a re-run of the appropriate analysis (e.g. linked inputs), which causes the d3.js chart to be rebuilt from scratch. This in turn causes mouseenter to be retriggered when the new DOM element appears under the mouse cursor, which causes the analysis to be re-run, the chart to be rebuilt, etc resulting in a loop. Breaking the loop is possible with a flag to drop the handler reentering, but there is also a problem with mouseleave not firing if mouseenter is still active, which I think may be related.
A better approach might be to factor out the code the which sets the visual attributes corresponding to selection information, from the code which constructs the chart, and only run the former when updating the UI. That will stop DOM elements being deleted and re-created under the mouse cursor and mouseenter being repeatedly triggered.
[x] BarChart.js
[x] Extract selection state information (with i, j fields) and verify correct (without using it)
[x] Redo selection state on PureScript side, using nested array indexed by i, j
[x] Extract i, j associated with each rect and use to index into selection info
[x] Detect when view is being updated rather than created, and in that case set selection state on existing view
[x] Remove mouseenterEnabled hack?
[x] LineChart.js
Supply LineChartSelState as argument to drawLineChart Drop that pattern?
[x] Extract point_radius and point_stroke
[x] setSelState
[x] Point selection no longer rendering
Unzip view types to extract selection state information?
[x] MatrixView.js
[x] Extract matrix_cell_classes to PureScript
[x] Drop intMatrix_i_max helpers (etc) in favour of record interface
[x] setSelState
[x] LineChart margin seems to have disappeared
[x] ScatterPlot.js
[x] Migrate CSS logic to selClass
[x] Transient state not showing
[x] Rename data-viz.css to view-styles.css
[x] Delete BubbleChart (see #994)
[x] TableView.js
[x] Extract setSelState
[x] Check ok when mousing over indexKey column
[x] indexKey needed? (Yes because no way to have a distinguished “0th” field of a JS object)
[x] Calculate whether row should be visible (and number of visible rows) in setSelState
[x] Set number of visible rows in setSelState
Only remove/add CSS styles when necessary (might reduce flicker in MatrixView)?
Every mouse event triggers a re-run of the appropriate analysis (e.g. linked inputs), which causes the d3.js chart to be rebuilt from scratch. This in turn causes
mouseenterto be retriggered when the new DOM element appears under the mouse cursor, which causes the analysis to be re-run, the chart to be rebuilt, etc resulting in a loop. Breaking the loop is possible with a flag to drop the handler reentering, but there is also a problem withmouseleavenot firing ifmouseenteris still active, which I think may be related.A better approach might be to factor out the code the which sets the visual attributes corresponding to selection information, from the code which constructs the chart, and only run the former when updating the UI. That will stop DOM elements being deleted and re-created under the mouse cursor and
mouseenterbeing repeatedly triggered.BarChart.jsrectand use to index into selection infomouseenterEnabledhack?LineChart.jsSupplyDrop that pattern?LineChartSelStateas argument todrawLineChartpoint_radiusandpoint_strokesetSelStatePointselection no longer renderingUnzip view types to extract selection state information?MatrixView.jsmatrix_cell_classesto PureScriptintMatrix_i_maxhelpers (etc) in favour of record interfacesetSelStateLineChartmargin seems to have disappearedScatterPlot.jsselClassdata-viz.csstoview-styles.cssBubbleChart(see #994)TableView.jssetSelStateindexKeycolumnindexKeyneeded? (Yes because no way to have a distinguished “0th” field of a JS object)setSelStatesetSelStateOnly remove/add CSS styles when necessary (might reduce flicker inMatrixView)?See also:
980