<editor-fold defaultstate="collapsed" desc="Visualization">
542505
@Override
    protected void paintComponent(Graphics g) {
        if (!isInitialized()) {
            return;
        }

        final Graphics2D G2 = (Graphics2D) g.create();

        G2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        G2.setRenderingHint(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY);
        G2.setRenderingHint(RenderingHints.KEY_STROKE_CONTROL, RenderingHints.VALUE_STROKE_NORMALIZE);
        G2.setRenderingHint(RenderingHints.KEY_TEXT_ANTIALIASING, RenderingHints.VALUE_TEXT_ANTIALIAS_ON);

        // Translate the coordinate system related to insets
        G2.translate(getFramelessOffset().getX(), getFramelessOffset().getY());

        final AffineTransform OLD_TRANSFORM = G2.getTransform();

        // Draw combined background image
        G2.drawImage(bImage, 0, 0, null);

        // Draw blips
        G2.setColor(BLIP_TEXT_COLOR);
        G2.setFont(BLIP_FONT);
        for (Poi poi : blips.values()) {
            if (poi.distanceTo(MY_LOCATION) < this.range) {
                G2.drawImage(poi.getPoiImage(), (int) (CENTER.getX() - poi.getPoiImage().getWidth() / 2.0 + (poi.getLocationXY().getX() - CENTER_XY.getX()) / pixelScaleX), (int) (CENTER.getY() - poi.getPoiImage().getWidth() / 2.0 + (poi.getLocationXY().getY() - CENTER_XY.getY()) / pixelScaleY), null);
                G2.drawString(poi.getName(), (int) (CENTER.getX() - poi.getPoiImage().getWidth() + (poi.getLocationXY().getX() - CENTER_XY.getX()) / pixelScaleX), (int) (CENTER.getY() - poi.getPoiImage().getWidth() + (poi.getLocationXY().getY() - CENTER_XY.getY()) / pixelScaleY));
            }
        }

        // Draw the beam
        G2.rotate(rotationAngle, CENTER.getX(), CENTER.getY());
        G2.drawImage(beamImage, 0, 0, null);
        G2.setTransform(OLD_TRANSFORM);

        G2.rotate(Math.toRadians(-135) + rotationAngle, CENTER.getX(), CENTER.getY());
        G2.setColor(BEAM_COLOR);
        G2.draw(BEAM);
        G2.setTransform(OLD_TRANSFORM);

        if (!isEnabled()) {
            G2.drawImage(disabledImage, 0, 0, null);
        }

        G2.dispose();
    }
704054
function (vis) {
		var point = this,
			series = point.series,
			chart = series.chart,
			method;

		// if called without an argument, toggle visibility
		point.visible = point.options.visible = vis = vis === UNDEFINED ? !point.visible : vis;
		series.options.data[inArray(point, series.data)] = point.options; // update userOptions.data
		
		method = vis ? 'show' : 'hide';

		// Show and hide associated elements
		each(['graphic', 'dataLabel', 'connector', 'shadowGroup'], function (key) {
			if (point[key]) {
				point[key][method]();
			}
		});

		if (point.legendItem) {
			chart.legend.colorizeItem(point, vis);
		}
		
		// Handle ignore hidden slices
		if (!series.isDirty && series.options.ignoreHiddenPoint) {
			series.isDirty = true;
			chart.redraw();
		}
	}
543628
public void storeVisualization(File destination) throws IOException {
        final byte[] data = Base64.decodeBase64(getVisualization());
        try (OutputStream stream = new FileOutputStream(destination)) {
            stream.write(data);
        }
    }
854437
@Override protected void initGraphics() {
        super.initGraphics();

        if (tile.isAutoScale()) tile.calcAutoScale();
        oldValue          = tile.getValue();
        sectionMap        = new HashMap<>(sections.size());
        for(Section section : sections) { sectionMap.put(section, new Arc()); }

        barColor       = tile.getBarColor();
        thresholdColor = tile.getThresholdColor();

        barBackground = new Arc(PREFERRED_WIDTH * 0.5, PREFERRED_HEIGHT * 0.696, PREFERRED_WIDTH * 0.275, PREFERRED_WIDTH * 0.275, angleRange * 0.5 + 90, -angleRange);
        barBackground.setType(ArcType.OPEN);
        barBackground.setStroke(barColor);
        barBackground.setStrokeWidth(PREFERRED_WIDTH * 0.02819549 * 2);
        barBackground.setStrokeLineCap(StrokeLineCap.BUTT);
        barBackground.setFill(null);

        thresholdBar = new Arc(PREFERRED_WIDTH * 0.5, PREFERRED_HEIGHT * 0.696, PREFERRED_WIDTH * 0.275, PREFERRED_WIDTH * 0.275, -angleRange * 0.5 + 90, 0);
        thresholdBar.setType(ArcType.OPEN);
        thresholdBar.setStroke(tile.getThresholdColor());
        thresholdBar.setStrokeWidth(PREFERRED_WIDTH * 0.02819549 * 2);
        thresholdBar.setStrokeLineCap(StrokeLineCap.BUTT);
        thresholdBar.setFill(null);
        Helper.enableNode(thresholdBar, !tile.getSectionsVisible());

        sectionPane = new Pane();
        Helper.enableNode(sectionPane, tile.getSectionsVisible());

        if (sectionsVisible) { drawSections(); }

        alertIcon = new Path();
        alertIcon.setFillRule(FillRule.EVEN_ODD);
        alertIcon.setFill(Color.YELLOW);
        alertIcon.setStroke(null);
        Helper.enableNode(alertIcon, tile.isAlert());
        alertTooltip = new Tooltip(tile.getAlertMessage());
        Tooltip.install(alertIcon, alertTooltip);

        needleRotate     = new Rotate((tile.getValue() - oldValue - minValue) * angleStep);
        needleRectRotate = new Rotate((tile.getValue() - oldValue - minValue) * angleStep);

        needleRect = new Rectangle();
        needleRect.setFill(tile.getBackgroundColor());
        needleRect.getTransforms().setAll(needleRectRotate);

        needle = new Path();
        needle.setFillRule(FillRule.EVEN_ODD);
        needle.getTransforms().setAll(needleRotate);
        needle.setFill(tile.getNeedleColor());
        needle.setStrokeWidth(0);
        needle.setStroke(Color.TRANSPARENT);

        titleText = new Text(tile.getTitle());
        titleText.setFill(tile.getTitleColor());
        Helper.enableNode(titleText, !tile.getTitle().isEmpty());

        valueText = new Text(String.format(locale, formatString, tile.getCurrentValue()));
        valueText.setFill(tile.getValueColor());
        valueText.setTextOrigin(VPos.BASELINE);
        Helper.enableNode(valueText, tile.isValueVisible() && !tile.isAlert());

        unitText = new Text(tile.getUnit());
        unitText.setFill(tile.getUnitColor());
        unitText.setTextOrigin(VPos.BASELINE);
        Helper.enableNode(unitText, tile.isValueVisible() && !tile.isAlert());

        valueUnitFlow = new TextFlow(valueText, unitText);
        valueUnitFlow.setTextAlignment(TextAlignment.CENTER);

        minValueText = new Text(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", tile.getMinValue()));
        minValueText.setFill(tile.getTitleColor());

        maxValueText = new Text(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", tile.getMaxValue()));
        maxValueText.setFill(tile.getTitleColor());

        thresholdRect = new Rectangle();
        thresholdRect.setFill(sectionsVisible ? Color.TRANSPARENT : tile.getValue() > tile.getThreshold() ? tile.getThresholdColor() : Tile.GRAY);
        Helper.enableNode(thresholdRect, tile.isThresholdVisible());

        thresholdText = new Text(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", tile.getThreshold()));
        thresholdText.setFill(sectionsVisible ? Color.TRANSPARENT : Tile.GRAY);
        Helper.enableNode(thresholdText, tile.isThresholdVisible());

        getPane().getChildren().addAll(barBackground, thresholdBar, sectionPane, alertIcon, needleRect, needle, titleText, valueUnitFlow, minValueText, maxValueText, thresholdRect, thresholdText);
    }
1105732
function getColorVisual(seriesModel, visualMapModel, value, valueState) {
    var mappings = visualMapModel.targetVisuals[valueState];
    var visualTypes = VisualMapping.prepareVisualTypes(mappings);
    var resultVisual = {
        color: seriesModel.getData().getVisual('color') // default color.
    };

    for (var i = 0, len = visualTypes.length; i < len; i++) {
        var type = visualTypes[i];
        var mapping = mappings[
            type === 'opacity' ? '__alphaForOpacity' : type
        ];
        mapping && mapping.applyVisual(value, getVisual, setVisual);
    }

    return resultVisual.color;

    function getVisual(key) {
        return resultVisual[key];
    }

    function setVisual(key, value) {
        resultVisual[key] = value;
    }
}
976128
private PVPanel createVisualization(final ProtovisWidget graphWidget) {

        final PVPanel vis = graphWidget.getPVPanel()
                .width(400)
                .height(30)
                .margin(20)
                .left(100)  // translate(_,y)
                .top(
                        new JsDoubleFunction() {
                            public double f(JsArgs args) {
                                PVMark _this = args.getThis();
                                return 10 + _this.index() * 60; // translate(x,_)
                            }
                        }
                );

        PVBulletLayout bullet = vis.add(PV.Layout.Bullet()).orient(LEFT)
                .ranges(new JsFunction<JsArrayNumber>() {
                    public JsArrayNumber f(JsArgs args) {
                        Bullet d = args.getObject();
                        return JsUtils.toJsArrayNumber(d.ranges);
                    }
                }).measures(new JsFunction<JsArrayNumber>() {
                    public JsArrayNumber f(JsArgs args) {
                        Bullet d = args.getObject();
                        return JsUtils.toJsArrayNumber(d.measures);
                    }
                }).markers(new JsFunction<JsArrayNumber>() {
                    public JsArrayNumber f(JsArgs args) {
                        Bullet d = args.getObject();
                        return JsUtils.toJsArrayNumber(d.markers);
                    }
                });


        // workaround for right hand side labels
        graphWidget.addAttachHandler(new AttachEvent.Handler() {
            @Override
            public void onAttachOrDetach(AttachEvent event) {
                if(event.isAttached()) {
                    Scheduler.get().scheduleDeferred(new Scheduler.ScheduledCommand() {
                        @Override
                        public void execute() {
                            Element svg = graphWidget.getElement().getFirstChildElement();
                            if (svg != null) {
                                svg.setAttribute("overflow", "visible");
                            }
                        }
                    });
                }
            }
        });

        bullet.strokeStyle("#CFCFCF");
        bullet.lineWidth(0.9);

        bullet.range().add(PV.Bar).fillStyle("#ffffff");
        bullet.measure().add(PV.Bar).fillStyle("#666666");

        bullet.marker().add(PV.Dot).shape(PVShape.TRIANGLE).fillStyle("white");
        bullet.tick().add(PV.Rule)
                .strokeStyle("#CFCFCF")
                .anchor(BOTTOM)
                .add(PV.Label)
                .text(bullet.x().tickFormat());

        // title
        bullet.anchor(LEFT).add(PV.Label).font("12px sans-serif")
                .textAlign(RIGHT).textBaseline(BOTTOM)
                .text(new JsStringFunction() {
                    public String f(JsArgs args) {
                        Bullet d = args.getObject(0);
                        return d.title;
                    }
                });

        // subtitle
        bullet.anchor(LEFT).add(PV.Label).textStyle("#616161").textAlign(RIGHT)
                .textBaseline(TOP).text(new JsStringFunction() {
            public String f(JsArgs args) {
                Bullet d = args.getObject(0);
                return d.subtitle;
            }
        });

        // scale
        bullet.anchor(RIGHT)
                .add(PV.Label)
                .textStyle("#616161")
                .textAlign(LEFT)
                .textBaseline(MIDDLE)
                .text(new JsStringFunction() {
                    public String f(JsArgs args) {
                        Bullet d = args.getObject(0);
                        double measures = d.measures[0];
                        return measures > 0.00 ? String.valueOf(Double.valueOf(d.ranges[0]).longValue()) : "";
                    }
                });


        return vis;
    }
812687
function MichaelBromleyVisualization(){
	/*
		Sets the ID and Name of the visualization.
	*/
	this.id = 'michaelbromley_visualization';
	this.name = 'Michael Bromley Visualization';

	/*
		Initializes the analyser for the visualization.
	*/
	this.analyser = '';

	/*
		Initializes the container and preferences.
	*/
	this.container = '';
	this.preferences = {
		width: 500,
		height: 500,
		fullscreen: false,
		inherit: true
	}

	/*
		Default tile size for the visualization
	*/
	this.tileSize = '';

	/*
		Initializes the tiles and stars arrays
	*/
	this.tiles = [];
	this.stars = [];

	/*
		Initializes the variables used for foregorund elements.
	*/
	this.fgCanvas = '';
	this.fgCtx = '';
	this.fgRotation = 0.001;

	/*
		Initializes the variables used for background elements.
	*/
	this.bgCanvas = '';
	this.bgCtx = '';

	/*
		Initializes the variables used for the starfield elements.
	*/
	this.sfCanvas = '';
	this.sfCtx = '';

	/*
		Initializes the volume and stream data.
	*/
	this.volume = 0;
	this.streamData = new Uint8Array( 128 );

	/*
		Initializes the rotation intervals.
	*/
	this.drawBgInterval = '';
	this.rotateForegroundInterval = '';
	this.sampleAudioStreamInterval = '';

	/*
		Initializes the animation frames.
	*/
	this.animationFrame = '';

	/**
	 * Sets the user defined preferences for the visualization.
	 *
	 * @param {object} userPreferences 	- The preferences passed in by the user for the visualization.
	 */
	this.setPreferences = function( userPreferences ){
		for( var key in this.preferences ){
			if( userPreferences[ key ] != undefined) {
				this.preferences[key] = userPreferences[key];
			}
		}
	}

	/**
	 * Starts the visualization.
	 *
	 * @param {Node} element  - The element we are starting the visualization with.
	 */
	this.startVisualization = function( element ){
		/*
			Set the analyser and the container elements.
		*/
		this.analyser = Amplitude.getAnalyser();
		this.container = element;

		/*
			If we are inheriting the width and height of the container,
			set the container to the width and height of the element.
		*/
		if( this.preferences.inherit ){
			this.preferences.width = this.container.offsetWidth;
			this.preferences.height = this.container.offsetHeight;
		}

		/*
			Foreground Hexagons Layer
		*/
		this.fgCanvas = document.createElement('canvas');
		this.fgCanvas.setAttribute('style', 'position: absolute; z-index: 10');
		this.fgCtx = this.fgCanvas.getContext("2d");
		this.container.appendChild( this.fgCanvas );

		/*
			Middle Starfield Layer
		*/
		this.sfCanvas = document.createElement('canvas');
		this.sfCtx = this.sfCanvas.getContext("2d");
		this.sfCanvas.setAttribute('style', 'position: absolute; z-index: 5');
		this.container.appendChild( this.sfCanvas );

		/*
			Background Image Layer
		*/
		this.bgCanvas = document.createElement('canvas');
		this.bgCtx = this.bgCanvas.getContext("2d");
		this.container.appendChild( this.bgCanvas );

		/*
			Make the polygon and star arrays.
		*/
		this.makePolygonArray();
		this.makeStarArray();

		/*
			Resize the canvas and draw the visualization.
		*/
		this.resizeCanvas();
		this.draw();

		/*
			Set the sample audio interval.
		*/
		this.sampleAudioStreamInterval = setInterval( this.sampleAudioStream.bind(this), 20 );

		/*
			Set the drawing of the background and rotation of the foreground interval.
		*/
		this.drawBgInterval = setInterval( this.drawBg.bind(this), 100 );
		this.rotateForegroundInterval = setInterval( this.rotateForeground.bind(this), 20 );

		/*
			When the window is resized, resize the canvas.
		*/
		window.addEventListener('resize', this.resizeCanvas, false );
	}

	/*
		Make the polygon array.
	*/
	this.makePolygonArray = function(){
		/*
			Initialize the tiles to an array.
		*/
		this.tiles = [];

		/**
		 * Arrange into a grid x, y, with the y axis at 60 degrees to the x, rather than
		 * the usual 90.
		 * @type {number}
		 */
		let i = 0;

		/*
			Unique number for each tile
		*/
		this.tiles.push( new Polygon(6, 0, 0, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles ) );

		/*
			The centre tile
		*/
		i++;

		/*
			Build the tiles needed for the the visualization.
		*/
		for( var layer = 1; layer < 7; layer++ ){
			this.tiles.push(new Polygon( 6, 0, layer, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
			this.tiles.push(new Polygon( 6, 0, -layer, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;

			for(var x = 1; x < layer; x++) {
				this.tiles.push(new Polygon( 6, x, -layer, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
				this.tiles.push(new Polygon( 6, -x, layer, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
				this.tiles.push(new Polygon( 6, x, layer-x, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
				this.tiles.push(new Polygon( 6, -x, -layer+x, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
			}
			for(var y = -layer; y <= 0; y++) {
				this.tiles.push(new Polygon( 6, layer, y, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
				this.tiles.push(new Polygon( 6, -layer, -y, this.tileSize, this.fgCtx, i, this.analyser, this.streamData, this.tiles, this.fgRotation ) ); i++;
			}
		}
	},

	/*
		Build the star array.
	*/
	this.makeStarArray = function(){
		var x;
		var y;
		var starSize;

		this.stars = [];
		var limit = this.fgCanvas.width / 15;

		for( var i = 0; i < limit; i++ ){
			x = ( Math.random() - 0.5 ) * this.fgCanvas.width;
			y = ( Math.random() - 0.5 ) * this.fgCanvas.height;
			starSize = ( Math.random() + 0.1 ) * 3;
			this.stars.push( new Star( x, y, starSize, this.sfCtx, this.fgCanvas, this.analyser, this.streamData ) );
		}
	},

	/*
		Resize the canvas.
	*/
	this.resizeCanvas = function(){
		if( this.fgCanvas ){
			if( this.preferences.fullscreen ){
				/*
					Resize the foreground canvas
				*/
				this.fgCanvas.width = window.innerWidth;
				this.fgCanvas.height = window.innerHeight;
				this.fgCtx.translate(this.fgCanvas.width/2,this.fgCanvas.height/2);

				/*
					Resize the bg canvas
				*/
				this.bgCanvas.width = window.innerWidth;
				this.bgCanvas.height = window.innerHeight;

				/*
					Resize the starfield canvas
				*/
				this.sfCanvas.width = window.innerWidth;
				this.bgCanvas.height = window.innerHeight;
				this.sfCtx.translate(this.fgCanvas.width/2,this.fgCanvas.height/2);
			}else{
				/*
					Resize the foreground canvas
				*/
				this.fgCanvas.width = this.preferences.width;
				this.fgCanvas.height = this.preferences.height;
				this.fgCtx.translate(this.fgCanvas.width/2,this.fgCanvas.height/2);

				/*
					Resize the bg canvas
				*/
				this.bgCanvas.width = this.preferences.width;
				this.bgCanvas.height = this.preferences.height;

				/*
					Resize the starfield canvas
				*/
				this.sfCanvas.width = this.preferences.width;
				this.bgCanvas.height = this.preferences.height;
				this.sfCtx.translate(this.fgCanvas.width/2,this.fgCanvas.height/2);
			}
			this.tileSize = this.fgCanvas.width > this.fgCanvas.height ? this.fgCanvas.width / 25 : this.fgCanvas.height / 25;


			this.drawBg();
			this.makePolygonArray();
			this.makeStarArray();
		}
	},

	/*
		Draw the visualization.
	*/
	this.draw = function(){
		/*
			Clear the foreground
		*/
		this.fgCtx.clearRect(-this.fgCanvas.width, -this.fgCanvas.height, this.fgCanvas.width*2, this.fgCanvas.height *2);

		/*
			Clear the star field
		*/
		this.sfCtx.clearRect(-this.fgCanvas.width/2, -this.fgCanvas.height/2, this.fgCanvas.width, this.fgCanvas.height);

		/*
			Draw all of the stars
		*/
		this.stars.forEach(function(star) {
			star.drawStar();
		});

		/*
			Draw all of the tiles.
		*/
		this.tiles.forEach(function(tile) {
			tile.drawPolygon();
		});

		/*
			Draw all of the highlights
		*/
		this.tiles.forEach(function(tile) {
			if (tile.highlight > 0) {
				tile.drawHighlight();
			}
		});

		/*
			Request the animation frame.
		*/
		this.animationFrame = window.requestAnimationFrame( this.draw.bind(this) );
	},

	/**
	 * Draw the background
	 */
	this.drawBg = function(){
		this.bgCtx.clearRect(0, 0, this.bgCanvas.width, this.bgCanvas.height);
		var r, g, b, a;
		var val = this.volume/1000;

		r = 200 + (Math.sin(val) + 1) * 28;
		g = val * 2;
		b = val * 8;
		a = Math.sin(val+3*Math.PI/2) + 1;
		this.bgCtx.beginPath();
		this.bgCtx.rect(0, 0, this.bgCanvas.width, this.bgCanvas.height);
		/*
			Create radial gradient
		*/
		var grd = this.bgCtx.createRadialGradient(this.bgCanvas.width/2, this.bgCanvas.height/2, val, this.bgCanvas.width/2, this.bgCanvas.height/2, this.bgCanvas.width-Math.min(Math.pow(val, 2.7), this.bgCanvas.width - 20));
		/*
			Centre is transparent black
		*/
		grd.addColorStop(0, 'rgba(0,0,0,0)');
		grd.addColorStop(0.8, "rgba(" +
		Math.round(r) + ", " +
		Math.round(g) + ", " +
		Math.round(b) + ", 0.4)");

		this.bgCtx.fillStyle = grd;
		this.bgCtx.fill();
	},

	/**
	 * Sample the audio stream.
	 */
	this.sampleAudioStream = function(){
		this.analyser.getByteFrequencyData( this.streamData );

		/*
    	Calculate an overall volume value
    */
    var total = 0;
    /*
			Get the volume from the first 80 bins, else it gets too loud with treble
		*/
    for (var i = 0; i < 80; i++) {
        total += this.streamData[i];
    }

    this.volume = total;
	},

	/**
	 * Rotate foreground
	 */
	this.rotateForeground = function(){
		for( let i = 0; i < this.tiles.length; i++ ){
			this.tiles[i].rotateVertices();
		}
	},

	/**
	 * Returns the name of the visualization.
	 */
	this.getName = function(){
		return name;
	},

	/**
	 * Returns the id of the visualization.
	 */
	this.getID = function(){
		return this.id;
	},

	/**
	 * Stops the visualization.
	 */
	this.stopVisualization = function(){
		clearInterval(this.sampleAudioStreamInterval);
		clearInterval(this.drawBgInterval);
		clearInterval(this.rotateForegroundInterval);

		window.cancelAnimationFrame( this.animationFrame );

    this.container.innerHTML = '';
	},

	/**
	 * Returns the volume of the visualization.
	 */
	this.getVolume = function(){
		return this.volume;
	}
}
863660
@Override protected void initGraphics() {
        super.initGraphics();

        averagingListener = o -> handleEvents("AVERAGING_PERIOD");

        timeFormatter = DateTimeFormatter.ofPattern("HH:mm", tile.getLocale());

        state = State.CONSTANT;

        if (tile.isAutoScale()) tile.calcAutoScale();

        low            = tile.getMaxValue();
        high           = tile.getMinValue();
        movingAverage  = tile.getMovingAverage();
        noOfDatapoints = tile.getAveragingPeriod();
        dataList       = new LinkedList<>();

        // To get smooth lines in the chart we need at least 4 values
        if (noOfDatapoints < 4) throw new IllegalArgumentException("Please increase the averaging period to a value larger than 3.");

        graphBounds = new Rectangle(PREFERRED_WIDTH * 0.05, PREFERRED_HEIGHT * 0.5, PREFERRED_WIDTH * 0.9, PREFERRED_HEIGHT * 0.45);

        titleText = new Text(tile.getTitle());
        titleText.setFill(tile.getTitleColor());
        Helper.enableNode(titleText, !tile.getTitle().isEmpty());

        valueText = new Text(String.format(locale, formatString, tile.getValue()));
        valueText.setBoundsType(TextBoundsType.VISUAL);
        valueText.setFill(tile.getValueColor());
        Helper.enableNode(valueText, tile.isValueVisible());

        valueUnitFlow = new TextFlow(valueText);
        valueUnitFlow.setTextAlignment(TextAlignment.RIGHT);

        highText = new Text();
        highText.setTextOrigin(VPos.BOTTOM);
        highText.setFill(tile.getValueColor());

        lowText = new Text();
        lowText.setTextOrigin(VPos.TOP);
        lowText.setFill(tile.getValueColor());

        text = new Text(tile.getText());
        text.setTextOrigin(VPos.TOP);
        text.setFill(tile.getTextColor());

        timeSpanText = new Text("");
        timeSpanText.setTextOrigin(VPos.TOP);
        timeSpanText.setFill(tile.getTextColor());
        Helper.enableNode(timeSpanText, !tile.isTextVisible());

        referenceLine = new Line();
        referenceLine.getStrokeDashArray().addAll(3d, 3d);
        referenceLine.setVisible(false);

        pathElements = new ArrayList<>(noOfDatapoints);
        pathElements.add(0, new MoveTo());
        for (int i = 1 ; i < noOfDatapoints ; i++) { pathElements.add(i, new LineTo()); }

        sparkLine = new Path();
        sparkLine.getElements().addAll(pathElements);
        sparkLine.setFill(null);
        sparkLine.setStroke(tile.getBarColor());
        sparkLine.setStrokeWidth(PREFERRED_WIDTH * 0.0075);
        sparkLine.setStrokeLineCap(StrokeLineCap.ROUND);
        sparkLine.setStrokeLineJoin(StrokeLineJoin.ROUND);

        dot = new Circle();
        dot.setFill(tile.getBarColor());
        dot.setVisible(false);

        triangle = new Path();
        triangle.setStroke(null);
        triangle.setFill(state.color);
        indicatorPane = new StackPane(triangle);

        changeText = new Label(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", (tile.getCurrentValue() - tile.getReferenceValue())));
        changeText.setTextFill(state.color);
        changeText.setAlignment(Pos.CENTER_RIGHT);

        changePercentageText = new Text(new StringBuilder().append(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", (tile.getCurrentValue() / tile.getReferenceValue() * 100.0) - 100.0)).append("\u0025").toString());
        changePercentageText.setFill(state.color);

        changePercentageFlow = new TextFlow(indicatorPane, changePercentageText);
        changePercentageFlow.setTextAlignment(TextAlignment.RIGHT);

        getPane().getChildren().addAll(titleText, valueUnitFlow, sparkLine, dot, referenceLine, highText, lowText, timeSpanText, text, changeText, changePercentageFlow);
    }
1236123
function BarVisualization(){
	/*
		Define the ID, name, and initialize the container. These are a part
		of the visualization template and are necessary.
	*/
	this.id = 'bar_visualization';
	this.name = 'Bar Visualization';
	this.container = '';

	/**
	 * Define the preferences for the visualization
	 */
	this.preferences = {
		bar_color: '#ff0000',
		width: 500,
		height: 200,
		inherit: true,
		spacer_width: 10,
		bar_width: 5,
		offset: 100,
		cutoff: 23
	}

	/*
		Intiialize the analyser used to generate the visualization.
	*/
	this.analyser = '';

	/*
		Initialize the local canvas height, canvas width, context, canvas
		and request animation variables.
	*/
	this.canvasHeight = '';
	this.canvasWidth = '';
	this.ctx = '';
	this.canvas = '';
	this.requestAnimation = '';

	/**
	 * Get the ID of the visualization.
	 */
	this.getID = function(){
		return this.id;
	}

	/**
	 * Get the name of the visualization.
	 */
	this.getName = function(){
		return this.name;
	}

	/**
	 * Set the preferences for the visualization.
	 *
	 * @param {object} userPreferences - The user preferences for the visualization.
	 */
	this.setPreferences = function( userPreferences ){
		for( var key in this.preferences ){
			if( userPreferences[ key ] != undefined) {
				this.preferences[key] = userPreferences[key];
			}
		}
	}

	/**
	 * Start the visualization.
	 *
	 * @param {Node} element - The element that will contain the visualization.
	 */
	this.startVisualization = function( element ){
		/*
			Set the analyser to the Amplitude analyser.
		*/
		this.analyser = Amplitude.getAnalyser();

		/*
			Set the container to the element passed in.
		*/
		this.container = element;

		/*
			Build a canvas element we can draw on for the visualization.
		*/
		this.canvas = document.createElement('canvas');

		/*
			If the user wants the size of the canvas to be the size of the container,
			set the width and height of the visualization to the width and height
			of the container.
		*/
		if( this.preferences.inherit ){
			this.preferences.width = this.container.offsetWidth;
			this.preferences.height = this.container.offsetHeight;
		}

		/*
			Set the width and height of the canvas element in the container.
		*/
		this.canvas.setAttribute('width', this.preferences.width);
		this.canvas.setAttribute('height', this.preferences.height);

		/*
			Get the 2D context of the canvas and append the canvas to the container.
		*/
		this.ctx = this.canvas.getContext('2d');
		this.container.appendChild( this.canvas );

		/*
			Set the local canvas height and canvas width variables to the width
			and height of the canvas. We will use these later.
		*/
		this.canvasHeight = this.canvas.height;
		this.canvasWidth = this.canvas.width;

		/*
			Kick off the visualization.
		*/
		this.rafCallback();
	}

	/**
	 * Stops the visualization and clears the container.
	 */
	this.stopVisualization = function(){
		window.cancelAnimationFrame( this.requestAnimation );
		this.container.innerHTML = '';
	}

	/**
	 * The callback that draws the visualization based on the frequency of the song.
	 */
	this.rafCallback = function( ){
		/*
			Builds an animation frame that updates the visualization to what is
			in the frequency.
		*/
		this.requestAnimation = window.requestAnimationFrame( this.rafCallback.bind(this), this.canvas );

		/*
			Get the frequency data from the analyser.
		*/
		let freqByteData = new Uint8Array( this.analyser.frequencyBinCount );
		this.analyser.getByteFrequencyData( freqByteData );

		/*
			Compute how many bars we need to have
		*/
		let numberOfBars = Math.round( this.canvasWidth / this.preferences.spacer_width );

		/*
			Build the rectangle for each of the elements in the visualization.
		*/
		this.ctx.clearRect( 0, 0, this.canvasWidth, this.canvasHeight );
		this.ctx.fillStyle = this.preferences.bar_color;
		this.ctx.lineCap = 'round';

		/*
			Iterate over how many bars we need and draw the height based
			off of the magnitude of the wave we are displaying
		*/
		for( let i = 0; i < numberOfBars; i++ ){
			let magnitude = freqByteData[ i + this.preferences.offset ];

			this.ctx.fillRect( i * this.preferences.spacer_width, this.canvasHeight, this.preferences.bar_width, -magnitude );
		}
	}
}
803138
protected void initGraphics() {
        // Set initial size
        if (Double.compare(tile.getPrefWidth(), 0.0) <= 0 || Double.compare(tile.getPrefHeight(), 0.0) <= 0 ||
            Double.compare(tile.getWidth(), 0.0) <= 0 || Double.compare(tile.getHeight(), 0.0) <= 0) {
            if (tile.getPrefWidth() > 0 && tile.getPrefHeight() > 0) {
                tile.setPrefSize(tile.getPrefWidth(), tile.getPrefHeight());
            } else {
                tile.setPrefSize(PREFERRED_WIDTH, PREFERRED_HEIGHT);
            }
        }

        shadow = new DropShadow(BlurType.TWO_PASS_BOX, Color.rgb(0, 0, 0, 0.65), 3, 0, 0, 0);

        backgroundImageView = new ImageView();
        backgroundImageView.setPreserveRatio(true);
        backgroundImageView.setMouseTransparent(true);
        if (null == tile.getBackgroundImage()) {
            enableNode(backgroundImageView, false);
        } else {
            backgroundImageView.setImage(tile.getBackgroundImage());
            enableNode(backgroundImageView, true);
        }

        notifyRegion = new NotifyRegion();
        enableNode(notifyRegion, false);

        infoRegion = new InfoRegion();
        infoRegion.setPickOnBounds(false);
        enableNode(infoRegion, false);

        pane = new Pane(backgroundImageView, notifyRegion, infoRegion);
        pane.setBorder(new Border(new BorderStroke(tile.getBorderColor(), BorderStrokeStyle.SOLID, new CornerRadii(PREFERRED_WIDTH * 0.025), new BorderWidths(tile.getBorderWidth()))));
        pane.setBackground(new Background(new BackgroundFill(tile.getBackgroundColor(), new CornerRadii(PREFERRED_WIDTH * 0.025), Insets.EMPTY)));

        getChildren().setAll(pane);
    }
546821
@Override
    public void paint(Graphics g, Shape allocation)
    {
        if (view != null)
        {
            view.paint(g, allocation);
        }
    }
917811
public void destroy() {
    context.removeVisualizationListener(this);
    context.removeResultListener(this);
    for(Entry<VisualizationTask, Visualization> v : taskmap.entrySet()) {
      Visualization vis = v.getValue();
      if(vis != null) {
        vis.destroy();
      }
    }
    taskmap.clear();
  }
1050259
@Override protected void initGraphics() {
        super.initGraphics();

        oldValue = tile.getValue();
        double deviation = calculateDeviation();
        updateState(deviation);

        titleText = new Text();
        titleText.setFill(tile.getTitleColor());
        Helper.enableNode(titleText, !tile.getTitle().isEmpty());

        text = new Text(tile.getUnit());
        text.setFill(tile.getUnitColor());
        Helper.enableNode(text, tile.isTextVisible());

        valueText = new Text(String.format(locale, formatString, tile.getValue()));
        valueText.setFill(tile.getValueColor());
        Helper.enableNode(valueText, tile.isValueVisible());

        unitText = new Text(tile.getUnit());
        unitText.setFill(tile.getUnitColor());
        Helper.enableNode(unitText, !tile.getUnit().isEmpty());

        valueUnitFlow = new TextFlow(valueText, unitText);
        valueUnitFlow.setTextAlignment(TextAlignment.RIGHT);

        description = new Label(tile.getDescription());
        description.setAlignment(tile.getDescriptionAlignment());
        description.setWrapText(true);
        description.setTextFill(tile.getTextColor());
        Helper.enableNode(description, !tile.getDescription().isEmpty());
        
        triangle = new Path();
        triangle.setStroke(null);
        triangle.setFill(state.color);
        indicatorPane = new StackPane(triangle);

        deviationText = new Text(String.format(locale, "%." + tile.getTickLabelDecimals() + "f", deviation));
        deviationText.setFill(state.color);

        deviationUnitText = new Text("%");
        deviationUnitText.setFill(Tile.FOREGROUND);

        referenceUnitFlow = new TextFlow(indicatorPane, deviationText, deviationUnitText);
        referenceUnitFlow.setTextAlignment(TextAlignment.LEFT);

        getPane().getChildren().addAll(titleText, text, valueUnitFlow, description, referenceUnitFlow);

        //handleCurrentValue(tile.getValue());
    }
309078
function(r) {
            r = r.toJSON? r.toJSON() : r;

            this.report.del("visualizations", { silent: true });
            this.report.set(r);
            hr.History.navigate("report/"+this.report.get("id"));
        }
574051
@Override protected void initGraphics() {
        super.initGraphics();

        mouseHandler     = event -> { if (event.getClickCount() == 2) { centerLocation(); } };
        locationListener = e -> redraw();
        poiListener      = c -> {
            while (c.next()) {
                if (c.wasPermutated()) {      // Get items that have been permutated in list
                    for (int i = c.getFrom(); i < c.getTo(); ++i) {
                        updatePoi(tile.getPoiList().get(i));
                    }
                } else if (c.wasUpdated()) {  // Get items that have been updated in list
                    for (int i = c.getFrom(); i < c.getTo(); ++i) {
                        updatePoi(tile.getPoiList().get(i));
                    }
                } else if (c.wasAdded()) {
                    c.getAddedSubList().forEach(poi -> addPoi(poi));
                } else if (c.wasRemoved()) {
                    c.getRemoved().forEach(poi -> removePoi(poi));
                }
            }
        };

        titleText = new Text();
        titleText.setFill(tile.getTitleColor());
        Helper.enableNode(titleText, !tile.getTitle().isEmpty());

        text = new Text(tile.getText());
        text.setFill(tile.getTextColor());
        Helper.enableNode(text, tile.isTextVisible());

        webView = new WebView();
        webView.setMinSize(size * 0.9, tile.isTextVisible() ? size * 0.72 : size * 0.795);
        webView.setMaxSize(size * 0.9, tile.isTextVisible() ? size * 0.72 : size * 0.795);
        webView.setPrefSize(size * 0.9, tile.isTextVisible() ? size * 0.72 : size * 0.795);
        webEngine = webView.getEngine();
        webEngine.getLoadWorker().stateProperty().addListener((ov, o, n) -> {
            if (Worker.State.SUCCEEDED == n) {
                readyToGo = true;
                if (MapProvider.BW != tile.getMapProvider()) { changeMapProvider(tile.getMapProvider()); }
                updateLocation();
                updateLocationColor();
                tile.getPoiList().forEach(poi -> addPoi(poi));
                addTrack(tile.getTrack());
                updateTrackColor();
            }
        });
        URL maps = Tile.class.getResource("osm.html");
        webEngine.load(maps.toExternalForm());

        getPane().getChildren().addAll(titleText, webView, text);
    }
645638
public static void main(String[] argv) {
		JFrame frame = new JFrame("Whiskas Gradient Editor");
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

		JPanel main = new JPanel();
		main.setLayout(new BoxLayout(main, BoxLayout.Y_AXIS));
		main.setBackground(Color.CYAN);
		frame.getContentPane().add(main);

		//
		GraphEditorWindow bottom = new GraphEditorWindow();

		ArrayList curve = new ArrayList();
		curve.add(new Vector2f(0.0f, 0.0f));
		curve.add(new Vector2f(1.0f, 255.0f));
		LinearInterpolator test = new ConfigurableEmitter("bla").new LinearInterpolator(
				curve, 0, 255);
		bottom.registerValue(test, "Test");

		curve = new ArrayList();
		curve.add(new Vector2f(0.0f, 255.0f));
		curve.add(new Vector2f(1.0f, 0.0f));
		test = new ConfigurableEmitter("bla").new LinearInterpolator(curve, 0,
				255);
		bottom.registerValue(test, "Test 2");

		main.add(bottom);

		frame.pack();
		frame.setVisible(true);
		frame.setSize(600, 300);
		frame.addWindowListener(new WindowAdapter() {
			public void windowClosing(WindowEvent e) {
				System.exit(0);
			}
		});

		frame.setVisible(true);
	}
1182076
private static <N, E> void writeRaw(Graph<N, E> graph,
                                        Appendable a,
                                        DOTVisualizationHelper<N, ? super E> dotHelperOrNull) throws IOException {

        final DOTVisualizationHelper<N, ? super E> dotHelper;

        if (dotHelperOrNull == null) {
            dotHelper = new DefaultDOTVisualizationHelper<>();
        } else {
            dotHelper = dotHelperOrNull;
        }

        final boolean directed = !(graph instanceof UndirectedGraph);

        if (directed) {
            a.append("di");
        }

        a.append("graph g {").append(System.lineSeparator());

        Map<String, String> props = new HashMap<>();

        dotHelper.getGlobalNodeProperties(props);
        if (!props.isEmpty()) {
            a.append('\t').append("node");
            appendParams(props, a);
            a.append(';').append(System.lineSeparator());
        }

        props.clear();
        dotHelper.getGlobalEdgeProperties(props);
        if (!props.isEmpty()) {
            a.append('\t').append("edge");
            appendParams(props, a);
            a.append(';').append(System.lineSeparator());
        }

        dotHelper.writePreamble(a);
        a.append(System.lineSeparator());

        MutableMapping<N, String> nodeNames = graph.createStaticNodeMapping();
        Set<String> initialNodes = new HashSet<>();

        int i = 0;

        for (N node : graph) {
            props.clear();
            if (!dotHelper.getNodeProperties(node, props)) {
                continue;
            }
            String id = "s" + i++;

            // remove potential attributes that are no valid DOT attributes
            if (Boolean.parseBoolean(props.remove(NodeAttrs.INITIAL))) {
                initialNodes.add(id);
            }
            props.remove(NodeAttrs.ACCEPTING);

            a.append('\t').append(id);
            appendParams(props, a);
            a.append(';').append(System.lineSeparator());
            nodeNames.put(node, id);
        }

        for (N node : graph) {
            String srcId = nodeNames.get(node);
            if (srcId == null) {
                continue;
            }
            Collection<E> outEdges = graph.getOutgoingEdges(node);
            if (outEdges.isEmpty()) {
                continue;
            }
            for (E e : outEdges) {
                N tgt = graph.getTarget(e);
                String tgtId = nodeNames.get(tgt);
                if (tgtId == null) {
                    continue;
                }

                if (!directed && tgtId.compareTo(srcId) < 0) {
                    continue;
                }

                props.clear();
                if (!dotHelper.getEdgeProperties(node, e, tgt, props)) {
                    continue;
                }

                a.append('\t').append(srcId).append(' ');
                if (directed) {
                    a.append("-> ");
                } else {
                    a.append("-- ");
                }
                a.append(tgtId);
                appendParams(props, a);
                a.append(';').append(System.lineSeparator());
            }
        }

        a.append(System.lineSeparator());
        renderInitialArrowTip(initialNodes, a);

        dotHelper.writePostamble(a);
        a.append(System.lineSeparator());

        a.append('}').append(System.lineSeparator());
        if (a instanceof Flushable) {
            ((Flushable) a).flush();
        }
    }