Config
📦 Installation
Step 1
Download the resource from your FiveM Keymaster
Step 2
Unzip the frvgs_rpWebMap folder
Step 3
Copy the webmap folder to a static webserver
Step 4
Your webmap is live !
📐 Customisation
🗺️ Modify the Map Blips
To modify or add a Map Blips you can edit the blips.js file.
There is an example with Public Services.
/////////////////////////////////////////////////////////////////////////////
///////// BLIPS /////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////
///////// 🏛 Public Services /////////////////////////////////////////////////
/////////////////////////////////////////////////////////////////////////////
///////// 🏛 Los Santos ////////////////////////////////////////////////////
// PUBLIC - LS GOV - Los Santos Government
var X = -112;
var Y = 24;
L.marker([Y, X], {
icon: customIcon("lsgov", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/lsgov.png' /><h2 style='text-align:center;'> LS GOV</h2><p>Los Santos Government</p>");
// PUBLIC - LSPD - Mission Row - Los Santos Police Department
var X = -100;
var Y = 18;
L.marker([Y, X], {
icon: customIcon("lspd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/lspd.png' /><h2 style='text-align:center;'> LSPD </h2><p>Mission Row - Los Santos Police Department</p>");
// PUBLIC - LSPD - Vespucci - Los Santos Police Department
var X = -128.7;
var Y = 20.6;
L.marker([Y, X], {
icon: customIcon("lspd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/lspd.png' /><h2 style='text-align:center;'> LSPD </h2><p>Vespucci - Los Santos Police Department</p>");
// PUBLIC - LSFD - Los Santos Fire Department
var X = -87.5;
var Y = 9.6;
L.marker([Y, X], {
icon: customIcon("lsfd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/lspd.png' /><h2 style='text-align:center;'> LSFD</h2><p>Los Santos Fire Department </p>");
// PUBLIC - LSMC - Los Santos Medical Center
var X = -103.8;
var Y = 24.5;
L.marker([Y, X], {
icon: customIcon("lsmc", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/lsmc.png' /><h2 style='text-align:center;'>LSMC</h2><p>Los Santos Medical Center</p>");
///////// 🏛 BLAINE COUNTY ////////////////////////////////////////////////////
// PUBLIC - BC GOV - Blaine County Government
var X = -78.4;
var Y = 76;
L.marker([Y, X], {
icon: customIcon("bcgov", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bcgov.png' /><h2 style='text-align:center;'>BC GOV</h2><p>Blaine County Government</p>");
// PUBLIC - BCSD - Sandy Shore - Blaine County Sheriff Department
var X = -75.8;
var Y = 70.7;
L.marker([Y, X], {
icon: customIcon("bcsd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bcsd.png' /><h2 style='text-align:center;'>BCSD</h2><p>Sandy Shore - Blaine County Sherrif Department</p>");
// PUBLIC - BCSD - Paleto - Blaine County Sheriff Department
var X = -116.67;
var Y = 80.66;
L.marker([Y, X], {
icon: customIcon("bcsd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bcsd.png' /><h2 style='text-align:center;'>BCSD</h2><p>Paleto - Blaine County Sherrif Department</p>");
// PUBLIC - BCFD - Blaine County Fire Department
var X = -62.8;
var Y = 75.6;
L.marker([Y, X], {
icon: customIcon("bcfd", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bcfd.png' /><h2 style='text-align:center;'>BCFD</h2><p>Blaine County Fire Department</p>");
// PUBLIC - BCMC - Blaine County Medical Center
var X = -76.2;
var Y = 70.6;
L.marker([Y, X], {
icon: customIcon("bcmc", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bcmc.png' /><h2 style='text-align:center;'>BCMC</h2><p>Blaine County Medical Center </p>");
///////// 🏛 SAN ANDREAS ////////////////////////////////////////////////////
// PUBLIC - SA Gov - San Andreas Government
var X = -118.4;
var Y = 30;
L.marker([Y, X], {
icon: customIcon("sagov", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/sagov.png' /><h2 style='text-align:center;'>SA GOV</h2><p>San Andreas Government</p>");
// PUBLIC - SA DOJ - San Andreas Department of Justice
var X = -102.9;
var Y = 6.3;
L.marker([Y, X], {
icon: customIcon("doj", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/doj.png' /><h2 style='text-align:center;'>DOJ</h2><p>San Andreas Departement of Justice</p>");
// PUBLIC - IAA -
var X = -72.5;
var Y = 65.8;
L.marker([Y, X], {
icon: customIcon("iaa", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/iaa.png' /><h2 style='text-align:center;'>IAA</h2><p>International Affairs Agency</p>");
// PUBLIC - SAFD - San Andreas Defense Force
var X = -153.17;
var Y = 68;
L.marker([Y, X], {
icon: customIcon("sadf", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/sadf.png' /><h2 style='text-align:center;'> SADF </h2><p>San Andreas Defense Force</p>");
// PUBLIC - NOOSE
var X = -62.4;
var Y = 29.5;
L.marker([Y, X], {
icon: customIcon("noose", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/noose.png' /><h2 style='text-align:center;'> NOOSE </h2><p>National Office of Security Enforcement</p>");
// PUBLIC - FIB
var X = -107.6;
var Y = 22.4;
L.marker([Y, X], {
icon: customIcon("fib", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/fib.png' /><h2 style='text-align:center;'> FIB </h2><p>Federal Investigation Bureau</p>");
// PUBLIC - BBSP - BOLINGBROKE PENITENTIARY
var X = -76;
var Y = 63.2;
L.marker([Y, X], {
icon: customIcon("bbsp", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/bbsp.png' /><h2 style='text-align:center;'> SABP </h2><p>San Andreas Bolingbroke Penitentiary</p>");
// PUBLIC - SAPR - San Andreas Parks Rangers
var X = -102.2;
var Y = 44.6;
L.marker([Y, X], {
icon: customIcon("sapr", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/sapr.png' /><h2 style='text-align:center;'> SASP </h2><p>San Andreas State Patrol</p>");
// PUBLIC - SA UNI - San Andreas University
var X = -138.8;
var Y = 36.7;
L.marker([Y, X], {
icon: customIcon("university", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/university.png' /><h2 style='text-align:center;'> SA UNI </h2><p>San Andreas University</p>");
// PUBLIC - San Andreas Weazel News
var X = -119.8;
var Y = 18.7;
L.marker([Y, X], {
icon: customIcon("weazel", "city")
}).addTo(Icons["🏛 Public Services"]).bindPopup("<img src='/IconsLore/city/weazel.png' /><h2 style='text-align:center;'> Weazel </h2><p>News & Entertainment</p>");
🛟 Additional Support
If you need help configuring your RP Website, feel free to join our discord for personalized support.