Examples with CSSClass de.lmu.ifi.dbs.elki.visualization.css.CSSClass used on opensource projects

Example 1 with CSSClass

use of de.lmu.ifi.dbs.elki.visualization.css.CSSClass in project elki by elki-project.

the class HistogramVisualization method makeVisualization.

@Override
public Visualization makeVisualization(VisualizerContext context, VisualizationTask task, VisualizationPlot plot, double width, double height, Projection proj) {
    HistogramResult curve = task.getResult();
    final StyleLibrary style = context.getStyleLibrary();
    final double sizex = StyleLibrary.SCALE;
    final double sizey = StyleLibrary.SCALE * height / width;
    final double margin = style.getSize(StyleLibrary.MARGIN);
    Element layer = SVGUtil.svgElement(plot.getDocument(), SVGConstants.SVG_G_TAG);
    final String transform = SVGUtil.makeMarginTransform(width, height, sizex, sizey, margin);
    SVGUtil.setAtt(layer, SVGConstants.SVG_TRANSFORM_ATTRIBUTE, transform);
    // find maximum, determine step size
    int dim = -1;
    DoubleMinMax xminmax = new DoubleMinMax();
    DoubleMinMax yminmax = new DoubleMinMax();
    for (double[] point : curve) {
        xminmax.put(point[0]);
        dim = dim < point.length ? point.length : dim;
        for (int i = 1; i < point.length; i++) {
            yminmax.put(point[i]);
        }
    }
    // Minimum should always start at 0 for histograms
    yminmax.put(0.0);
    // remove one dimension which are the x values.
    dim = dim - 1;
    int size = curve.size();
    double range = xminmax.getMax() - xminmax.getMin();
    double binwidth = range / (size - 1);
    LinearScale xscale = new LinearScale(xminmax.getMin() - binwidth * .49999, xminmax.getMax() + binwidth * .49999);
    LinearScale yscale = new LinearScale(yminmax.getMin(), yminmax.getMax());
    SVGPath[] path = new SVGPath[dim];
    for (int i = 0; i < dim; i++) {
        path[i] = new SVGPath(sizex * xscale.getScaled(xminmax.getMin() - binwidth * .5), sizey);
    }
    // draw curves.
    for (double[] point : curve) {
        for (int d = 0; d < dim; d++) {
            path[d].lineTo(sizex * (xscale.getScaled(point[0] - binwidth * .5)), sizey * (1 - yscale.getScaled(point[d + 1])));
            path[d].lineTo(sizex * (xscale.getScaled(point[0] + binwidth * .5)), sizey * (1 - yscale.getScaled(point[d + 1])));
        }
    }
    // close all histograms
    for (int i = 0; i < dim; i++) {
        path[i].lineTo(sizex * xscale.getScaled(xminmax.getMax() + binwidth * .5), sizey);
    }
    // add axes
    try {
        SVGSimpleLinearAxis.drawAxis(plot, layer, yscale, 0, sizey, 0, 0, SVGSimpleLinearAxis.LabelStyle.LEFTHAND, style);
        SVGSimpleLinearAxis.drawAxis(plot, layer, xscale, 0, sizey, sizex, sizey, SVGSimpleLinearAxis.LabelStyle.RIGHTHAND, style);
    } catch (CSSNamingConflict e) {
        LoggingUtil.exception(e);
    }
    // Setup line styles and insert lines.
    ColorLibrary cl = style.getColorSet(StyleLibrary.PLOT);
    for (int d = 0; d < dim; d++) {
        CSSClass csscls = new CSSClass(this, SERIESID + "_" + d);
        csscls.setStatement(SVGConstants.SVG_FILL_ATTRIBUTE, SVGConstants.SVG_NONE_VALUE);
        csscls.setStatement(SVGConstants.SVG_STROKE_ATTRIBUTE, cl.getColor(d));
        csscls.setStatement(SVGConstants.SVG_STROKE_WIDTH_ATTRIBUTE, style.getLineWidth(StyleLibrary.PLOT));
        plot.addCSSClassOrLogError(csscls);
        Element line = path[d].makeElement(plot);
        line.setAttribute(SVGConstants.SVG_CLASS_ATTRIBUTE, csscls.getName());
        layer.appendChild(line);
    }
    return new StaticVisualizationInstance(context, task, plot, width, height, layer);
}

Example 2 with CSSClass

use of de.lmu.ifi.dbs.elki.visualization.css.CSSClass in project elki by elki-project.

the class XYCurveVisualization method setupCSS.

/**
 * Setup the CSS classes for the plot.
 *
 * @param svgp Plot
 */
private void setupCSS(VisualizerContext context, SVGPlot svgp) {
    StyleLibrary style = context.getStyleLibrary();
    CSSClass csscls = new CSSClass(this, SERIESID);
    // csscls.setStatement(SVGConstants.SVG_STROKE_WIDTH_ATTRIBUTE, "0.2%");
    csscls.setStatement(SVGConstants.SVG_FILL_ATTRIBUTE, SVGConstants.SVG_NONE_VALUE);
    style.lines().formatCSSClass(csscls, 0, style.getLineWidth(StyleLibrary.XYCURVE));
    svgp.addCSSClassOrLogError(csscls);
    // Axis label
    CSSClass label = new CSSClass(this, CSS_AXIS_LABEL);
    label.setStatement(SVGConstants.CSS_FILL_PROPERTY, style.getTextColor(StyleLibrary.XYCURVE));
    label.setStatement(SVGConstants.CSS_FONT_FAMILY_PROPERTY, style.getFontFamily(StyleLibrary.XYCURVE));
    label.setStatement(SVGConstants.CSS_FONT_SIZE_PROPERTY, style.getTextSize(StyleLibrary.XYCURVE));
    label.setStatement(SVGConstants.CSS_TEXT_ANCHOR_PROPERTY, SVGConstants.CSS_MIDDLE_VALUE);
    svgp.addCSSClassOrLogError(label);
    svgp.updateStyleElement();
}

Example 3 with CSSClass

use of de.lmu.ifi.dbs.elki.visualization.css.CSSClass in project elki by elki-project.

the class DragableArea method makeVisible.

/**
 * Make the rectangle visible, for debug purposes.
 */
public void makeVisible() {
    CSSClass cls = new CSSClass(this, "unused");
    cls.setStatement(SVGConstants.CSS_FILL_PROPERTY, SVGConstants.CSS_GREEN_VALUE);
    cls.setStatement(SVGConstants.CSS_FILL_OPACITY_PROPERTY, "0.2");
    cls.setStatement(SVGConstants.CSS_CURSOR_PROPERTY, SVGConstants.CSS_POINTER_VALUE);
    SVGUtil.setAtt(element, SVGConstants.SVG_STYLE_ATTRIBUTE, cls.inlineCSS());
}

Example 4 with CSSClass

use of de.lmu.ifi.dbs.elki.visualization.css.CSSClass in project elki by elki-project.

the class DetailView method addBackground.

/**
 * Create a background node. Note: don't call this at arbitrary times - the
 * background may cover already drawn parts of the image!
 *
 * @param context
 */
private void addBackground(VisualizerContext context) {
    // Make a background
    CSSClass cls = new CSSClass(this, "background");
    cls.setStatement(SVGConstants.CSS_FILL_PROPERTY, context.getStyleLibrary().getBackgroundColor(StyleLibrary.PAGE));
    Element bg = this.svgElement(SVGConstants.SVG_RECT_TAG);
    SVGUtil.setAtt(bg, SVGConstants.SVG_X_ATTRIBUTE, "0");
    SVGUtil.setAtt(bg, SVGConstants.SVG_Y_ATTRIBUTE, "0");
    SVGUtil.setAtt(bg, SVGConstants.SVG_WIDTH_ATTRIBUTE, "100%");
    SVGUtil.setAtt(bg, SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100%");
    SVGUtil.setAtt(bg, NO_EXPORT_ATTRIBUTE, NO_EXPORT_ATTRIBUTE);
    addCSSClassOrLogError(cls);
    SVGUtil.setCSSClass(bg, cls.getName());
    // Note that we rely on this being called before any other drawing routines.
    getRoot().appendChild(bg);
}

Example 5 with CSSClass

use of de.lmu.ifi.dbs.elki.visualization.css.CSSClass in project elki by elki-project.

the class OverviewPlot method initializePlot.

/**
 * Initialize the SVG plot.
 */
private void initializePlot() {
    plot = new VisualizationPlot();
    {
        // Add a background element:
        CSSClass cls = new CSSClass(this, "background");
        final String bgcol = context.getStyleLibrary().getBackgroundColor(StyleLibrary.PAGE);
        cls.setStatement(SVGConstants.CSS_FILL_PROPERTY, bgcol);
        plot.addCSSClassOrLogError(cls);
        Element background = plot.svgElement(SVGConstants.SVG_RECT_TAG);
        background.setAttribute(SVGConstants.SVG_X_ATTRIBUTE, "0");
        background.setAttribute(SVGConstants.SVG_Y_ATTRIBUTE, "0");
        background.setAttribute(SVGConstants.SVG_WIDTH_ATTRIBUTE, "100%");
        background.setAttribute(SVGConstants.SVG_HEIGHT_ATTRIBUTE, "100%");
        SVGUtil.setCSSClass(background, cls.getName());
        // Don't export a white background:
        if ("white".equals(bgcol)) {
            background.setAttribute(SVGPlot.NO_EXPORT_ATTRIBUTE, SVGPlot.NO_EXPORT_ATTRIBUTE);
        }
        plot.getRoot().appendChild(background);
    }
    {
        // setup the hover CSS classes.
        selcss = new CSSClass(this, "s");
        if (DEBUG_LAYOUT) {
            selcss.setStatement(SVGConstants.CSS_STROKE_PROPERTY, SVGConstants.CSS_RED_VALUE);
            selcss.setStatement(SVGConstants.CSS_STROKE_WIDTH_PROPERTY, .00001 * StyleLibrary.SCALE);
            selcss.setStatement(SVGConstants.CSS_STROKE_OPACITY_PROPERTY, "0.5");
        }
        selcss.setStatement(SVGConstants.CSS_FILL_PROPERTY, SVGConstants.CSS_RED_VALUE);
        selcss.setStatement(SVGConstants.CSS_FILL_OPACITY_PROPERTY, "0");
        selcss.setStatement(SVGConstants.CSS_CURSOR_PROPERTY, SVGConstants.CSS_POINTER_VALUE);
        plot.addCSSClassOrLogError(selcss);
        CSSClass hovcss = new CSSClass(this, "h");
        hovcss.setStatement(SVGConstants.CSS_FILL_OPACITY_PROPERTY, "0.25");
        plot.addCSSClassOrLogError(hovcss);
        // Hover listener.
        hoverer = new CSSHoverClass(hovcss.getName(), null, true);
    }
    // Disable Batik default interactions (zoom, rotate, etc.)
    if (single) {
        plot.setDisableInteractions(true);
    }
    SVGEffects.addShadowFilter(plot);
    SVGEffects.addLightGradient(plot);
}