All files / src/app/map/drawing utils.ts

100% Statements 25/25
100% Branches 6/6
100% Functions 3/3
100% Lines 24/24

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111                1x 1x 1x 1x           1x 1x 1x 1x 1x 1x           1x 1x 1x 1x 1x                     4x     4x           1x       1x       1x           1x                             1x   1x                   1x                                  
import { loadModules } from 'esri-loader';
 
import { linesImgUrl, dotImgUrl } from '../../../config/urls';
 
 
/**
 * The available modes for drawing in the application.
 */
export enum DrawingMode {
  DRAWING = 'drawing',
  EDITING = 'editing',
  ERASING = 'erasing'
}
 
/**
 * The shapes available for drawing in the application.
 */
export enum DrawingShape {
  CIRCLE = 'circle',
  POLYGON = 'polygon',
  LINE = 'line',
  STRIPES = 'stripes',
  MARKER = 'marker'
}
 
/**
 * The textures available for drawing in the application.
 */
export enum DrawingTexture {
  DOTS = 'dots',
  LINES = 'lines',
  BLACK = 'black',
  WHITE = 'white'
}
 
/**
 * Get the Esri Symbol for a given texture.
 *
 * @param texture The DrawingTexture for which the symbol must be retrieved.
 *
 * @returns The Esri Symbol for the input texture.
 */
export async function getDrawingSymbol(texture: DrawingTexture): Promise<__esri.Symbol> {
  const [
    SimpleFillSymbol,
    PictureFillSymbol
  ] = await loadModules([
    'esri/symbols/SimpleFillSymbol',
    'esri/symbols/PictureFillSymbol'
  ]);
 
  if (texture === DrawingTexture.BLACK) {
    return new SimpleFillSymbol({
      color: '#000000'
    });
  } else if (texture === DrawingTexture.WHITE) {
    return new SimpleFillSymbol({
      color: '#ffffff'
    });
  } else if (texture === DrawingTexture.DOTS) {
    return new PictureFillSymbol({
      url: dotImgUrl,
      height: '16px',
      width: '16px'
    });
  } else {
    return new PictureFillSymbol({
      url: linesImgUrl,
      height: '16px',
      width: '16px'
    });
  }
}
 
/**
 * Get a default outline for drawings.
 *
 * @returns A SimpleLineSymbol with a default style for the outline of shapes
 * being drawn on a map.
 */
export async function getDefaultOutline(): Promise<__esri.SimpleLineSymbol> {
  const [SimpleLineSymbol] = await loadModules(['esri/symbols/SimpleLineSymbol']);
 
  return new SimpleLineSymbol({
    color: '#ff0000',
    width: 2,
    style: 'solid'
  });
}
 
/**
 * The default width for stripes (pedestrian passages) drawings on maps.
 */
export const stripesWidth = 7;
 
/**
 * The interface for events triggered when a shape is being drawn in the application.
 */
export interface DrawActionEvent {
  type: string;
  vertices: number[][];
}
 
/**
 * The interface for events triggered when a marker is being drawn in the application.
 */
export interface MarkerDrawActionEvent {
  type: string;
  coordinates: number[];
}