mirror of
https://github.com/elastic/kibana.git
synced 2025-04-25 02:09:32 -04:00
All this dashboard usability work as sparked some ideas to make better work flows in Maps ### Adding layer Enhance "Add layer" work flow by allowing users to exit wizard after layer is added instead of forcing users to continue wizard even if they do not have any additional configuration changes to make. Old <img width="300" alt="Screen Shot 2023-03-30 at 2 56 56 PM" src="https://user-images.githubusercontent.com/373691/228962788-397e77fe-81b5-438a-a45c-3210101be336.png"> New <img width="300" alt="Screen Shot 2023-03-30 at 2 22 44 PM" src="https://user-images.githubusercontent.com/373691/228962403-ed18f8dc-c518-473d-8dd1-f889f7e51684.png"> ### Editing layer "Save" language in layer editor is poor choice since layer changes are not persisted until user clicks "Save" button in top chrome to save entire map. Updated copy to better reflect action. Old <img width="300" alt="Screen Shot 2023-03-30 at 2 57 16 PM" src="https://user-images.githubusercontent.com/373691/228962822-d923978f-71c4-4c7f-96f9-b003ededfbbe.png"> New <img width="300" alt="Screen Shot 2023-03-30 at 2 49 57 PM" src="https://user-images.githubusercontent.com/373691/228962420-4bd9d554-97ae-4c37-b677-84cd762e3f39.png"> ### Other changes "Map settings" => "Settings" --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
136 lines
4.9 KiB
Text
136 lines
4.9 KiB
Text
[role="xpack"]
|
|
[[indexing-geojson-data-tutorial]]
|
|
=== Tutorial: Index GeoJSON data
|
|
|
|
In this tutorial, you'll build a customized map that shows the flight path between
|
|
two airports, and the lightning hot spots on that route. You'll learn to:
|
|
|
|
* Import GeoJSON files into Kibana
|
|
* Index the files in {es}
|
|
* Display the data in a multi-layer map
|
|
|
|
[float]
|
|
=== Before you begin
|
|
|
|
This tutorial requires you to download the following GeoJSON sample data files.
|
|
These files are good examples of the types
|
|
of vector data that you can upload to Kibana and index in
|
|
Elasticsearch for display in Maps.
|
|
|
|
* https://raw.githubusercontent.com/elastic/examples/master/Maps/Getting%20Started%20Examples/geojson_upload_and_styling/logan_international_airport.geojson[Logan International Airport]
|
|
* https://raw.githubusercontent.com/elastic/examples/master/Maps/Getting%20Started%20Examples/geojson_upload_and_styling/bangor_international_airport.geojson[Bangor International Airport]
|
|
* https://raw.githubusercontent.com/elastic/examples/master/Maps/Getting%20Started%20Examples/geojson_upload_and_styling/lightning_detected.geojson[Lightning detected]
|
|
* https://raw.githubusercontent.com/elastic/examples/master/Maps/Getting%20Started%20Examples/geojson_upload_and_styling/original_flight_path.geojson[Original flight path]
|
|
* https://raw.githubusercontent.com/elastic/examples/master/Maps/Getting%20Started%20Examples/geojson_upload_and_styling/modified_flight_path.geojson[Modified flight path]
|
|
|
|
The data represents two real airports, two fictitious flight routes, and
|
|
fictitious lightning reports. You don't need to use all of
|
|
these files. Feel free to work with as many files as you'd like, or use valid GeoJSON
|
|
files of your own.
|
|
|
|
[float]
|
|
[role="xpack"]
|
|
=== Create and set up a map
|
|
|
|
. <<maps-create, Create a new map>>.
|
|
. Zoom in on the New England area in the northeast United States.
|
|
+
|
|
You're adding flight paths to this area, and this
|
|
sets up the map for a good view of the data.
|
|
+
|
|
[role="screenshot"]
|
|
image::maps/images/fu_gs_new_england_map.png[]
|
|
|
|
[float]
|
|
[[upload-and-index-geojson-file]]
|
|
=== Upload and index GeoJSON files
|
|
For each GeoJSON file you downloaded, complete the following steps:
|
|
|
|
. Click *Add layer*.
|
|
. From the list of layer types, click *Upload file*.
|
|
. Using the File Picker, upload the GeoJSON file.
|
|
+
|
|
Depending on the geometry type of your features, this will
|
|
auto-populate *Index type* with either {ref}/geo-point.html[geo_point] or
|
|
{ref}/geo-shape.html[geo_shape] and *Index name* with
|
|
`<file name>`.
|
|
|
|
. Click *Import file*.
|
|
+
|
|
You'll see activity as the GeoJSON Upload utility creates a new index
|
|
and data view for the data set. When the process is complete, you should
|
|
receive messages that the creation of the new index and data view
|
|
were successful.
|
|
|
|
. Click *Add layer*.
|
|
|
|
. In *Layer settings*, adjust settings and <<maps-vector-style-properties, properties>> as needed.
|
|
. Click *Keep changes*.
|
|
. Once you've added all of the sample files,
|
|
<<maps-save, save your map>>.
|
|
+
|
|
At this point, you could consider the map complete,
|
|
but there are a few additions and tweaks that you can make to tell a
|
|
better story with your data.
|
|
+
|
|
[role="screenshot"]
|
|
image::maps/images/fu_gs_flight_paths.png[]
|
|
|
|
[float]
|
|
=== Add a heatmap aggregation layer
|
|
|
|
Looking at the `Lightning detected` layer, it's clear where lightning has
|
|
struck. What's less clear, is if there have been more lightning
|
|
strikes in some areas than others, in other words, where the lightning
|
|
hot spots are. An advantage of having indexed
|
|
{ref}/geo-point.html[geo_point] data for the
|
|
lightning strikes is that you can perform aggregations on the data.
|
|
|
|
. Click *Add layer*.
|
|
. From the list of layer types, click *Heat map*.
|
|
+
|
|
Because you indexed `lightning_detected.geojson` using the index name and
|
|
pattern `lightning_detected`, that data is available as a {ref}/geo-point.html[geo_point]
|
|
aggregation.
|
|
|
|
. Select `lightning_detected`.
|
|
. Click *Add layer* to add the heat map layer
|
|
"Lightning intensity".
|
|
+
|
|
The remaining default settings are good, but there are a couple of
|
|
settings that you might want to change.
|
|
|
|
. Play around with the *Layer Style* >
|
|
*Color range* setting.
|
|
+
|
|
Again the default looks good, but feel free to choose a
|
|
different color range.
|
|
|
|
. When you're finished modifying settings, click *Keep changes*.
|
|
+
|
|
With your new lightning heat map layer, your map should look
|
|
like this:
|
|
+
|
|
[role="screenshot"]
|
|
image::maps/images/fu_gs_lightning_intensity.png[]
|
|
|
|
|
|
[float]
|
|
=== Organize the layers
|
|
|
|
Consider ways you might improve the appearance of the final map.
|
|
Small changes in how and when layers are shown can help tell a
|
|
better story with your data. Here are a few final tweaks
|
|
you might make:
|
|
|
|
* Update layer names
|
|
* Adjust styles for each layer
|
|
* Adjust the layer order
|
|
* Decide which layers to show at different zoom levels
|
|
|
|
When you've finished, again be sure to <<maps-save, save your work >>.
|
|
|
|
Your final map might look like this:
|
|
|
|
[role="screenshot"]
|
|
image::maps/images/fu_gs_final_map.png[]
|