IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Geomap: Add Property and values to GeoJSON style rule (#41845)

Browse Source 
Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
This commit is contained in:
nikki-kiga
2021-11-18 00:29:40 -08:00
committed by GitHub
parent 0c280319af
commit 7a3b52783c
7 changed files with 262 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
public/app/plugins/panel/geomap/layers/data/geojsonLayer.ts
View File

@@ -1,4 +1,10 @@
import { MapLayerRegistryItem, MapLayerOptions, PanelData, GrafanaTheme2, PluginState } from '@grafana/data';
import {
MapLayerRegistryItem,
MapLayerOptions,
PanelData,
GrafanaTheme2,
PluginState,
} from '@grafana/data';
import Map from 'ol/Map';
import VectorLayer from 'ol/layer/Vector';
import VectorSource from 'ol/source/Vector';
@@ -13,6 +19,10 @@ import { defaultStyleConfig, StyleConfig } from '../../style/types';
import { getStyleConfigState } from '../../style/utils';
import { polyStyle } from '../../style/markers';
import { StyleEditor } from './StyleEditor';
import { ReplaySubject } from 'rxjs';
import { map as rxjsmap, first } from 'rxjs/operators';
import { getLayerPropertyInfo } from '../../utils/getFeatures';
export interface GeoJSONMapperConfig {
// URL for a geojson file
src?: string;
@@ -64,16 +74,13 @@ export const geojsonLayer: MapLayerRegistryItem<GeoJSONMapperConfig> = {
format: new GeoJSON(),
});
const features = new ReplaySubject<FeatureLike[]>();
const key = source.on('change', () => {
//one geojson loads
if (source.getState() == 'ready') {
unByKey(key);
// var olFeatures = source.getFeatures(); // olFeatures.length === 1
// window.setTimeout(function () {
// var olFeatures = source.getFeatures(); // olFeatures.length > 1
// // Only after using setTimeout can I search the feature list... :(
// }, 100)
console.log('SOURCE READY!!!', source.getFeatures().length);
features.next(source.getFeatures());
}
});
@@ -117,17 +124,13 @@ export const geojsonLayer: MapLayerRegistryItem<GeoJSONMapperConfig> = {
init: () => vectorLayer,
update: (data: PanelData) => {
console.log('todo... find values matching the ID and update');
// // Update each feature
// source.getFeatures().forEach((f) => {
// console.log('Find: ', f.getId(), f.getProperties());
// });
},
// Geojson source url
registerOptionsUI: (builder) => {
const features = source.getFeatures();
console.log('FEATURES', source.getState(), features.length, options);
// get properties for first feature to use as ui options
const layerInfo = features.pipe(
first(),
rxjsmap((v) => getLayerPropertyInfo(v)),
);
builder
.addSelect({
@@ -149,7 +152,10 @@ export const geojsonLayer: MapLayerRegistryItem<GeoJSONMapperConfig> = {
name: 'Style Rules',
description: 'Apply styles based on feature properties',
editor: GeomapStyleRulesEditor,
settings: {},
settings: {
features: features,
layerInfo: layerInfo,
},
defaultValue: [],
})
.addCustomEditor({