Now that you have followed the tutorial to make a Choropleth map using SDG data and QGIS here Now you want to make it interactive and this map online!
Here I will show you how to create a global SDG Choropleth Map using Leaflet. Here I explain how to clean your data in QGIS and then I build and modify code from this leaflet tutorial. See a live working version here

• Convert your shapefile to geojson
• Create a webmap using the Leaflet API
• Reference your geojson file on your webmap

Open your shapefile with the countries and joined data using QGIS.
Open the attribute table.
Please make sure you write down the goal, target, and indicator title year the data were collected and any other relevant info that you might want to include in the text on your website about the map.
The SDG value – if it is more than 2 decimal places, please convert the value to an integer.
To do this – when the attribute table is open and editable –click field calculator.
Toggle “Create New Field” and name it SDG
Then cut and paste this expression and replace SDG_Field with the name of the field with your SDG indicator in it.

To_int(“SDG_Field”)

Then click ok and the new field should generate.
Now we will export and Convert to GeoJSON.
Right-click and the layer Export Save Vector Layer As
Format change to GeoJSON
Name your file and make sure you see where it is being saved.
You only need to keep the attribute with the name of the country and the value – so only toggle the country name and the SDG value field you just created.
Then click okay

##Open the new GeoJSON file in a text editor On line one, before the open brackets Add the following text

var nationData=

Next, Finally File Save As and name it and save it with .js extension

Close this file.

Next open the HTML file found here in your text editor. Find all the places I left UPDATE in the comments. These are the places you need to make changes to reference your documents. You can control f to find those places.
Good luck!