Geomap: rename "circles" layer to "markers" layer (grafana#36727)

kevinjm39 · Jul 13, 2021 · cbda218 · cbda218
1 parent 19f18bc
commit cbda218
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 40 deletions.
diff --git a/public/app/plugins/panel/geomap/layers/data/index.ts b/public/app/plugins/panel/geomap/layers/data/index.ts
@@ -1,12 +1,12 @@
-import { circlesLayer } from './circlesOverlay';
+import { markersLayer } from './markersLayer';
 import { geojsonMapper } from './geojsonMapper';
 import { lastPointTracker } from './lastPointTracker';
 
 /**
  * Registry for layer handlers
  */
 export const dataLayers = [
-    circlesLayer,
+    markersLayer,
     lastPointTracker,
     geojsonMapper, // dummy for now
 ];
diff --git a/...anel/geomap/layers/data/circlesOverlay.ts → .../panel/geomap/layers/data/markersLayer.ts b/...anel/geomap/layers/data/circlesOverlay.ts → .../panel/geomap/layers/data/markersLayer.ts
@@ -9,15 +9,15 @@ import * as style from 'ol/style';
 import tinycolor from 'tinycolor2';
 
 // Configuration options for Circle overlays
-export interface CircleConfig {
+export interface MarkersConfig {
   queryFormat: QueryFormat,
   fieldMapping: FieldMappingOptions,
   minSize: number,
   maxSize: number,
   opacity: number,
 }
 
-const defaultOptions: CircleConfig = {
+const defaultOptions: MarkersConfig = {
   queryFormat: {
     locationType: 'coordinates',
   },
@@ -32,20 +32,22 @@ const defaultOptions: CircleConfig = {
   opacity: 0.4,
 };
 
+export const MARKERS_LAYER_ID = "markers";
+
 /**
  * Map layer configuration for circle overlay
  */
-export const circlesLayer: MapLayerRegistryItem<CircleConfig> = {
-  id: 'circles',
-  name: 'Circles',
-  description: 'creates circle overlays for data values',
+export const markersLayer: MapLayerRegistryItem<MarkersConfig> = {
+  id: MARKERS_LAYER_ID,
+  name: 'Markers',
+  description: 'use markers to render each data point',
   isBaseMap: false,
 
   /**
    * Function that configures transformation and returns a transformer
    * @param options
    */
-  create: (map: Map, options: MapLayerConfig<CircleConfig>, theme: GrafanaTheme2): MapLayerHandler => {
+  create: (map: Map, options: MapLayerConfig<MarkersConfig>, theme: GrafanaTheme2): MapLayerHandler => {
     const config = { ...defaultOptions, ...options.config };
 
     const vectorLayer = new layer.Vector({});
@@ -114,51 +116,23 @@ export const circlesLayer: MapLayerRegistryItem<CircleConfig> = {
   // Circle overlay options
   registerOptionsUI: (builder) => {
     builder
-      .addNumberInput({
-        path: 'minSize',
-        description: 'configures the min circle size',
-        name: 'Min Size',
-        defaultValue: defaultOptions.minSize,
-      })
-      .addNumberInput({
-        path: 'maxSize',
-        description: 'configures the max circle size',
-        name: 'Max Size',
-        defaultValue: defaultOptions.maxSize,
-      })
-      .addSliderInput({
-        path: 'opacity',
-        description: 'configures the amount of transparency',
-        name: 'Opacity',
-        defaultValue: defaultOptions.opacity,
-        settings: {
-          min: 0,
-          max: 1,
-          step: 0.1,
-        },
-      })
       .addSelect({
         path: 'queryFormat.locationType',
-        name: 'Query Format',
+        name: 'Location source',
         defaultValue: defaultOptions.queryFormat.locationType,
         settings: {
           options: [
             {
               value: 'coordinates',
-              label: 'Coordinates',
+              label: 'Latitude/Longitude fields',
             },
             {
               value: 'geohash',
-              label: 'Geohash',
+              label: 'Geohash field',
             },
           ],
         },
       })
-      .addTextInput({
-        path: 'fieldMapping.metricField',
-        name: 'Metric Field',
-        defaultValue: defaultOptions.fieldMapping.metricField,
-      })
       .addTextInput({
         path: 'fieldMapping.latitudeField',
         name: 'Latitude Field',
@@ -179,6 +153,34 @@ export const circlesLayer: MapLayerRegistryItem<CircleConfig> = {
         defaultValue: defaultOptions.fieldMapping.geohashField,
         showIf: (config) =>
           config.queryFormat.locationType === 'geohash',
+      })
+      .addTextInput({
+        path: 'fieldMapping.metricField',
+        name: 'Metric Field',
+        defaultValue: defaultOptions.fieldMapping.metricField,
+      })
+      .addNumberInput({
+        path: 'minSize',
+        description: 'configures the min circle size',
+        name: 'Min Size',
+        defaultValue: defaultOptions.minSize,
+      })
+      .addNumberInput({
+        path: 'maxSize',
+        description: 'configures the max circle size',
+        name: 'Max Size',
+        defaultValue: defaultOptions.maxSize,
+      })
+      .addSliderInput({
+        path: 'opacity',
+        description: 'configures the amount of transparency',
+        name: 'Opacity',
+        defaultValue: defaultOptions.opacity,
+        settings: {
+          min: 0,
+          max: 1,
+          step: 0.1,
+        },
       });
   },
   // fill in the default values