How to use colornames - 10 common examples

To help you get started, we’ve selected a few colornames examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github cncjs / cncjs / src / web / components / widgets / visualizer / Visualizer.jsx View on Github external
this.camera = this.createPerspectiveCamera(width, height);

        { // Creating a directional light
            let directionalLight = this.createDirectionalLight();
            directionalLight.name = 'DirectionalLight';
            this.group.add(directionalLight);
        }

        { // Creating the coordinate grid
            let gridLine = new GridLine(
                GRID_X_LENGTH,
                GRID_X_SPACING,
                GRID_Y_LENGTH,
                GRID_Y_SPACING,
                colornames('blue'), // center line
                colornames('gray 44') // grid
            );
            _.each(gridLine.children, (o) => {
                o.material.opacity = 0.15;
                o.material.transparent = true;
                o.material.depthWrite = false;
            });
            gridLine.name = 'GridLine';
            this.group.add(gridLine);
        }

        { // Creating coordinate axes
            let coordinateAxes = new CoordinateAxes(AXIS_LENGTH);
            coordinateAxes.name = 'CoordinateAxes';
            this.group.add(coordinateAxes);
        }
github cncjs / cncjs / src / app / widgets / Visualizer / Visualizer.jsx View on Github external
createLimits(xmin, xmax, ymin, ymax, zmin, zmax) {
        const dx = Math.abs(xmax - xmin) || Number.MIN_VALUE;
        const dy = Math.abs(ymax - ymin) || Number.MIN_VALUE;
        const dz = Math.abs(zmax - zmin) || Number.MIN_VALUE;
        const color = colornames('indianred');
        const opacity = 0.5;
        const transparent = true;
        const dashed = true;
        const dashSize = 3; // The size of the dash.
        const gapSize = 1; // The size of the gap.
        const linewidth = 1; // Controls line thickness.
        const scale = 1; // The scale of the dashed part of a line.
        const limits = new Cuboid({
            dx,
            dy,
            dz,
            color,
            opacity,
            transparent,
            linewidth,
            dashed,
github cncjs / cncjs / src / app / widgets / Visualizer / Visualizer.jsx View on Github external
createCoordinateSystem(units) {
        const axisLength = (units === IMPERIAL_UNITS) ? IMPERIAL_AXIS_LENGTH : METRIC_AXIS_LENGTH;
        const gridCount = (units === IMPERIAL_UNITS) ? IMPERIAL_GRID_COUNT : METRIC_GRID_COUNT;
        const gridSpacing = (units === IMPERIAL_UNITS) ? IMPERIAL_GRID_SPACING : METRIC_GRID_SPACING;
        const group = new THREE.Group();

        { // Coordinate Grid
            const gridLine = new GridLine(
                gridCount * gridSpacing,
                gridSpacing,
                gridCount * gridSpacing,
                gridSpacing,
                colornames('blue'), // center line
                colornames('gray 44') // grid
            );
            _each(gridLine.children, (o) => {
                o.material.opacity = 0.15;
                o.material.transparent = true;
                o.material.depthWrite = false;
            });
            gridLine.name = 'GridLine';
            group.add(gridLine);
        }

        { // Coordinate Axes
            const coordinateAxes = new CoordinateAxes(axisLength);
            coordinateAxes.name = 'CoordinateAxes';
            group.add(coordinateAxes);
        }
github cncjs / cncjs / src / web / widgets / Visualizer / GCodeVisualizer.js View on Github external
import colornames from 'colornames';
import Toolpath from 'gcode-toolpath';
import * as THREE from 'three';
import log from '../../lib/log';

const defaultColor = new THREE.Color(colornames('lightgrey'));
const motionColor = {
    'G0': new THREE.Color(colornames('green')),
    'G1': new THREE.Color(colornames('blue')),
    'G2': new THREE.Color(colornames('deepskyblue')),
    'G3': new THREE.Color(colornames('deepskyblue'))
};

class GCodeVisualizer {
    constructor() {
        this.group = new THREE.Object3D();
        this.geometry = new THREE.Geometry();

        // Example
        // [
        //   {
        //     code: 'G1 X1',
        //     vertexIndex: 2
        //   }
github cncjs / cncjs / src / web / components / widgets / visualizer / Visualizer.jsx View on Github external
color: colornames('red'),
                    opacity: 0.5
                });
                this.group.add(textLabel);
            }
            for (let i = -GRID_Y_LENGTH; i <= GRID_Y_LENGTH; i += 50) {
                if (i === 0) {
                    continue;
                }
                let textLabel = new TextSprite({
                    x: -10,
                    y: i,
                    z: 0,
                    size: 8,
                    text: i,
                    color: colornames('green'),
                    opacity: 0.5
                });
                this.group.add(textLabel);
            }
        }

        { // Creating an engraving cutter
            let color = colornames('silver');
            let url = 'textures/brushed-steel-texture.jpg';
            loadTexture(url, (err, texture) => {
                let engravingCutter = new EngravingCutter(color, texture);
                engravingCutter.name = 'EngravingCutter';
                this.group.add(engravingCutter);

                // Update the scene
                this.updateScene();
github cncjs / cncjs / src / web / components / widgets / visualizer / Visualizer.jsx View on Github external
createRenderer(width, height) {
        let renderer = new THREE.WebGLRenderer({
            autoClearColor: true
        });
        renderer.setClearColor(new THREE.Color(colornames('white'), 1.0));
        renderer.setSize(width, height);
        renderer.clear();

        return renderer;
    }
    createPerspectiveCamera(width, height) {
github cncjs / cncjs / src / web / widgets / GCode / GCodeTable.jsx View on Github external
color: (() => {
                                        const color = {};
                                        color[GCODE_STATUS_ERROR] = colornames('indian red');
                                        color[GCODE_STATUS_NOT_STARTED] = colornames('gray 80');
                                        color[GCODE_STATUS_IN_PROGRESS] = colornames('gray 80');
                                        color[GCODE_STATUS_COMPLETED] = colornames('gray 20');
                                        return color[value] || colornames('gray 80');
                                    })()
                                }
github nitin42 / Animated-Timeline / examples / AnimatedBasic.js View on Github external
import React from "react";

import hx from "colornames";

import { Basic, helpers } from "../src";

const AnimationAttributes = {
  translateX: helpers.start({ from: 10, to: 400 }),
  speed: 0.4,
  opacity: helpers.start({
    from: 0.9,
    to: 0.4
  }),
  backgroundColor: helpers.start({
    from: hx("pink"),
    to: hx("orange")
  }),
  elasticity: 900,
  rotate: {
    value: 132,
    direction: "alternate"
  }
};

export class AnimatedBasic extends React.Component {
  render() {
    return (
      <div>
        
          <div style="{{"></div></div>
github ibmtjbot / tjbotlib / lib / tjbot.js View on Github external
TJBot.prototype.shineColors = function() {
    this._assertCapability('shine');

    return colorToHex.all().map(function(elt, i, array) {
        return elt['name'];
    });
};
github silentrob / superscript-websocket-demo / plugins / color.js View on Github external
facts.get({ object: color, predicate:'color'}, function(err, list) {
    if (!_.isEmpty(list) || toHex.get(color) !== undefined) {
      var colorHex = toHex(color);
      that.message.props['color'] = colorHex;
      userPlugin.save.call(that, "currentColor", colorHex, function(){
        cb(null, color + " is a great. This shade?");
      });
    } else {
      cb(null, "That isn't a color");
    }
  });
};

colornames

Map color names to HEX color values.

MIT
Latest version published 8 years ago

Package Health Score

62 / 100
Full package analysis

Popular colornames functions