# Use maps inside plugin **URL:** \ **Category:** Kibana\ **Tags:** kibana-plugin-development\ **Created:** [September 21, 2023, 5:39am UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503 "2023-09-21T05:39:19Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Sheereen](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sheereen/32/122005_2.png) [@Sheereen](https://discuss.elastic.co/u/Sheereen)\ **Post date:** [September 21, 2023, 5:39am UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/1 "2023-09-21T05:39:19Z")
Hi, I am creating an external custom plugin inside **Kibana 8.8.1** using **React**. I want to have a map visualization inside the plugin. I was referring to the example process [https://github.com/elastic/kibana/tree/main/x-pack/examples/third\_party\_maps\_source\_example](https://github.com/elastic/kibana/tree/main/x-pack/examples/third_party_maps_source_example). But here, the code just navigates to Analytics\>Maps. How can I have the map visualization alone inside the plugin. Meaning I do not want the user to create the map, rather, given the inputs, a map should be created. Just like creating charts using Elastic Charts ([Storybook](https://elastic.github.io/elastic-charts/)). ![image](https://us1.discourse-cdn.com/elastic/original/3X/9/8/9803a1710454bb6f66370d9e2723b5c67c872333.png) Thanks ---
**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\ **Post date:** [September 21, 2023, 1:29pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/2 "2023-09-21T13:29:11Z")
Embeddables are re-usable widgets that can be rendered on dashboard, but also in other apps. Developers can embed them directly in their plugin. For more information, see embeddable [README](https://github.com/elastic/kibana/blob/8.10/src/plugins/embeddable/README.md). You can also run example plugins by starting kibana with run-examples flag `yarn start --run-examples`. Then checkout "Embedded Lens" and "Embeddables" examples. Here is an example of where [ml uses map embeddable to render a map](https://github.com/elastic/kibana/blob/main/x-pack/plugins/ml/public/application/components/ml_embedded_map/ml_embedded_map.tsx#L92) ![Screen Shot 2023-09-21 at 7.28.12 AM](https://us1.discourse-cdn.com/elastic/original/3X/9/8/9849536668aada2cfd2ac6fefc7c8fa8245e9a4c.jpeg) ---
**Author:** ![Sheereen](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sheereen/32/122005_2.png) [@Sheereen](https://discuss.elastic.co/u/Sheereen)\ **Post date:** [September 21, 2023, 2:03pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/3 "2023-09-21T14:03:08Z")
Hi, Thanks for the reply The data that I want to show is stored in my local database. Can use the same when creating maps as embeddable? And how do I convert the location property to **geo\_point**? In Kibana Maps, I found that the location field should be of the type geo\_point. Thanks ---
**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\ **Post date:** [September 21, 2023, 2:17pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/4 "2023-09-21T14:17:32Z")
you will have to index your location field as [geo\_point](https://www.elastic.co/guide/en/elasticsearch/reference/current/geo-point.html). Or you could create a geo point [runtime field](https://discuss.elastic.co/t/how-to-a-emit-a-value-for-a-runtime-field-of-type-geo-point/271889). ---
**Author:** ![Sheereen](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sheereen/32/122005_2.png) [@Sheereen](https://discuss.elastic.co/u/Sheereen)\ **Post date:** [September 21, 2023, 2:58pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/5 "2023-09-21T14:58:11Z")
Hi, The data is not in elasticsearch and I donot plan to bring it jn ES either... it is in local sequel DB. When data is in ES, I tried with geo\_point and it works perfectly. But what about when the data is in another DB. How do I create a geo\_point field with the latitude and longitude values? Thanks ---
**Author:** ![Nathan\_Reese](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nathan_reese/32/84829_2.png) [@Nathan\_Reese](https://discuss.elastic.co/u/Nathan_Reese)\ **Post date:** [September 22, 2023, 3:12pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/6 "2023-09-22T15:12:16Z")
you would have to create a custom map source to fetch data from your local sequel DB. ---
**Author:** ![Sheereen](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/sheereen/32/122005_2.png) [@Sheereen](https://discuss.elastic.co/u/Sheereen)\ **Post date:** [October 9, 2023, 7:46am UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/7 "2023-10-09T07:46:22Z")
Hi, Thanks for the response I was able to have the maps inside my custom plugin using **maps-embeddable** , as you had suggested. I created a **dummy index in ES with geo-point field for location** , and was able to locate the same on maps. Now, to get the data from custom source, I was looking into the classes folder of maps-plugin and found the following types of sources (inside maps/public/classes/sources): 1. ems\_file\_source 2. ems\_tms\_source 3. es\_agg\_source 4. es\_geo\_grid\_source 5. es\_geo\_line\_source 6. es\_pew\_pew\_source 7. es\_search\_source 8. es\_source 9. es\_term\_source 10. geojson\_file\_source 11. kibana\_tilemap\_source 12. mvt\_single\_layer\_vector\_source 13. raster\_source 14. table\_source 15. term\_join\_source 16. tms\_source 17. vector\_source 18. wms\_source 19. xyz\_tms\_source So I believe, according to what you said, I have to create a source myself (which will fetch the data from provided db). If that's the case. do you have any references or examples on how to do the same? Thanks ---
**Author:** ![nickpeihl](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/nickpeihl/32/112622_2.png) [@nickpeihl](https://discuss.elastic.co/u/nickpeihl)\ **Post date:** [October 9, 2023, 1:13pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/8 "2023-10-09T13:13:32Z")
Hi Sheereen. The [Third Party Maps Source example](https://github.com/elastic/kibana/tree/main/x-pack/examples/third_party_maps_source_example) is the best example to use. Please note that any sources are limited to the client (browser). So your local database will also likely need to serve a backend API that the Maps source connects to via the [`Fetch` browser API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API). ---
**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\ **Post date:** [November 6, 2023, 1:13pm UTC](https://discuss.elastic.co/t/use-maps-inside-plugin/343503/9 "2023-11-06T13:13:37Z")
This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.