From 8f410277c6eb05e4160acc4033eaa777ad0fd953 Mon Sep 17 00:00:00 2001 From: Irene Knapp Date: Tue, 26 May 2020 19:28:37 -0700 Subject: Added code that generates a color selection dot. --- index.html | 39 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 39 insertions(+) (limited to 'index.html') diff --git a/index.html b/index.html index 64a2990..ba59d06 100644 --- a/index.html +++ b/index.html @@ -31,6 +31,17 @@ let ILLUMINANT_D65 = [ 0.950489, 1.0, 1.088840 ]; function main() { let svgState = svgInit(); + generateColorWheel(svgState); + + let colorSelectionDotParameters = { + x: 5000, + y: -5000, + }; + + generateColorSelectionDot(svgState, colorSelectionDotParameters); +} + +function generateColorWheel(svgState) { let colorWheelParameters = { scale: 10000, nStepsAround: 128, @@ -131,6 +142,34 @@ function generateOneColorWheelChunk(svgState, colorWheelParameters, chunkParamet } +function generateColorSelectionDot(svgState, colorSelectionDotParameters) { + let dotId = svgGenerateId(svgState, 'colorSelectionDot'), + translateParameters = [ + colorSelectionDotParameters.x, + colorSelectionDotParameters.y + ]; + + let transform = 'translate(' + translateParameters.join(',') + ')'; + + let groupElement = document.createElementNS(svgState.SVG_NS, 'g'); + groupElement.setAttribute('id', dotId); + groupElement.setAttribute('transform', transform); + + let blackCircleElement = document.createElementNS(svgState.SVG_NS, 'circle'); + blackCircleElement.setAttribute('r', '200'); + blackCircleElement.setAttribute('fill', 'black'); + groupElement.appendChild(blackCircleElement); + + let whiteCircleElement = document.createElementNS(svgState.SVG_NS, 'circle'); + whiteCircleElement.setAttribute('r', '150'); + whiteCircleElement.setAttribute('stroke', 'white'); + whiteCircleElement.setAttribute('stroke-width', '50'); + groupElement.appendChild(whiteCircleElement); + + svgState.svgElement.appendChild(groupElement); +} + + function svgInit() { let svgState = { }; -- cgit 1.4.1