Repository
https://github.com/joticajulian/steemexplorer/
Website
https://joticajulian.github.io/steemexplorer/#/witnesses/map
Witnesses Status Monitor
The last task for the EFTG project of the European Commission relates to develop a live witnesses status monitor map in the block explorer web interface. The current work shows a solution for this task. The principal idea is to display in a world map the witnesses and their status, changing to green the last witness that validated a block.
Location
There are two ways to get the location:
If we know the IP addresses of the nodes we can search their location in services like ipstack.com. The list of status.steemnodes.com (developed by
) is a good choice to start, or searching one by one in the posts of each witness. The advantage of this method is that we know where is located the server (but not necessarily the real person). The disadvantage is that this information is difficult to get. Apart from
's website, there are no more sites to contrast the nodes.
Looking at the metadata stored in the user profile. There are good services like nominatim or google maps that can be used to get the latitude and longitude given the city or country. The advantage of this method is that the metadata can be easily obtained. However, some witnesses have not filled this information, or have undesirable locations like "Worldwide".
In the current work, we first look at the metadata to get the location, and if the response is not good then the point is taken from a predefined json that contains the seed nodes. If the witness is not on the list either, then the witness is tagged as 'unknown location'.
Status with colors
The status of a witness is represented by 3 colors:
- Green - for the last witness that validated the block
- Blue - for witnesses that are online
- Red - for witnesses that are offline
In the beginning, all witnesses are represented by red circles, and as time passes and they produce blocks they become blue, and the current witness is colored with green.
Installation
This page has been added to the steemexplorer as a new component called Map.vue. The json to modify the default seed nodes is located at src/assets/seednodes.json.
Open the file src/config.js to define the following constants:
const MAP = {
TOP_WITNESSES: 20,
INI_POS : [30, 0], //latitude, longitude
INI_ZOOM : 1,
}
Install dependencies
npm install
Option 1: Serve with hot reload at localhost:8080
npm run dev
Option 2: Build for production with minification
npm run build
Technology Stack
- vue.js: Steem Explorer Website.
- steem-js: API to access the blockchain.
- leaflet.js: Open-source JavaScript library for interactive maps
Relevant commits
How to contribute?
Any type of contribution is very welcome. You can make pull requests to the Github repository, or contact me on Discord (jga#0699), steem.chat (jga), or steem ().