A graphing tool to explore data using multi-touch gestures.
Link: View Tool
References used:
Bootstrap columns: https://stackoverflow.com/questions/19089384/bootstrap-3-two-columns-full-height, https://codepen.io/danield770/pen/pEemmB Nested bootstrap columns: https://www.codeply.com/go/bp/dd50he9tGe Vertical navbar inside sidepanel: https://getbootstrap.com/docs/4.1/components/navs/ Design: https://app.rawgraphs.io/ MD Bootstrap accordian: https://mdbootstrap.com/docs/standard/components/accordion/#docsTabsOverview, https://www.geeksforgeeks.org/javascript-mdbootstrap-accordion-component/ MD Bootstrap icons: https://mdbootstrap.com/docs/standard/content-styles/icons/ Creating a table using D3: http://bl.ocks.org/jfreels/6814721 Bootstrap table: https://mdbootstrap.com/docs/standard/data/tables/ Box Plot: https://d3-graph-gallery.com/graph/boxplot_basic.html Scrollbar: https://getbootstrap.com/docs/4.3/utilities/overflow/, https://mdbootstrap.com/docs/b4/jquery/javascript/scroll/ MD Bootstrap Modal: https://mdbootstrap.com/docs/standard/components/modal/, https://jsfiddle.net/gnhta7q8/1/ MD Bootstrap Dropdown: https://mdbootstrap.com/docs/standard/components/dropdowns/ List: https://getbootstrap.com/docs/4.0/components/list-group/ Color Picker: https://getbootstrap.com/docs/5.0/forms/form-control/ Tooltip: https://codepen.io/Johann-S/pen/rNLPpMv, https://bl.ocks.org/d3noob/a22c42db65eb00d4e369, https://d3-graph-gallery.com/graph/interactivity_tooltip.html, https://www.w3schools.com/css/css3_animations.asp Shapes: https://www.geeksforgeeks.org/d3-js-symboltriangle-symbol/, https://stackoverflow.com/questions/15322556/how-to-remove-an-attribute-in-d3-js, https://observablehq.com/@julesblm/how-d3-symbol-works-by-someone-who-keeps-forgetting-how-it-wo Slider: http://ionden.com/a/plugins/ion.rangeSlider/start.html Icons: https://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-icons.php, https://icons.getbootstrap.com/ Radio buttons: https://getbootstrap.com/docs/5.0/forms/checks-radios/ Pinch to zoom: https://danburzo.ro/dom-gestures/ Colors: https://d3-graph-gallery.com/graph/custom_color.html D3 Legend: https://observablehq.com/@d3/color-legend, https://bl.ocks.org/zanarmstrong/0b6276e033142ce95f7f374e20f1c1a7, https://gist.github.com/ymuaa/4b018f238a9d8442aa75dfa32b978a14
Debugging references:
https://www.geeksforgeeks.org/d3-js-d3-keys-function/ https://stackoverflow.com/questions/22849622/how-to-access-key-values-in-an-object-using-d3-js https://www.w3schools.com/jquery/jquery_noconflict.asp https://stackoverflow.com/questions/24620741/get-selected-item-value-from-bootstrap-dropdown-with-specific-id https://stackoverflow.com/questions/71647787/how-to-get-a-value-from-color-picker-in-javascript-and-use-the-color-value-later https://stackoverflow.com/questions/41848677/how-to-make-a-color-scale-in-d3-js-to-use-in-fill-attribute https://stackoverflow.com/questions/1669190/find-the-min-max-element-of-an-array-in-javascript
Misc. tasks:
https://stackoverflow.com/questions/1026069/how-do-i-make-the-first-letter-of-a-string-uppercase-in-javascript https://bobbyhadz.com/blog/javascript-convert-all-elements-of-array-to-uppercase https://flexiple.com/javascript/get-average-of-array-javascript/ https://stackoverflow.com/questions/11832914/how-to-round-to-at-most-2-decimal-places-if-necessary https://www.w3schools.com/jsref/prop_color_value.asp https://bl.ocks.org/mbostock/1424037 https://stackoverflow.com/questions/30474474/jquery-change-function-on-ionslider-not-working https://stackoverflow.com/questions/11246758/how-to-get-unique-values-in-an-array