https://ncdportal.org/script/map-new.js

1let currSearchCnt;
2let dotnetRef;
3let ncd = ["#EE5940", "#7A99D0", "#F39B7D", "#A03024", "#25273E", "#314560"]
4let cancer = ["#26989c", "#c0aaaa", "#eb75ad", "#1ff0b0", "#c6e2ff", "#7a8888"]
5let cvd = ["#ed8a8a", "#ffdbac", "#4d4c48", "#027ffc", "#e388a4", "#8a2173"]
6let crd = ["#03989e", "#00ffff", "#4a8bad", "#66cdaa", "#bfb39f", "#a3ffb4"]
7let diabeties = ["#c7ab59", "#b0bf1a", "#7fffd4", "#ff91af", "#ffebcd", "#a2a2d0"]
8let alchol = ["#1dacd6", "#d891ef", "#fb607f", "#deb887", "#e97451", "#53868b"]
9let insuff = ["#00cc99", "#ace1af", "#6d9bc3", "#f7e7ce", "#e4d00a", "#f88379"]
10let obesity = ["#8b8878", "#f56fa1", "#ffb90f", "#caff70", "#ee7600", "#c1ffc1"]
11let tobaco = ["#c154c1", "#4a646c", "#86608e", "#e49b0f", "#a8e4a0", "#787878"]
12let greyOut = "gray";
13
14
15const Regionval = [
16    { id: 1, lat: 7.01, lag: 12.97 },
17    { id: 3, lat: 16.972, lag: 89.24 },
18    { id: 2, lat: 56.053, lag: -109.708 },
19    { id: 4, lat: 61.47236575345293, lag: 70.26809875083131 },
20    { id: 5, lat: 25.98964703904916, lag: 30.898284298179465 },
21    { id: 6, lat: 34.249042349471495, lag: 106.47426739925221 }
22];
23
24let RegionColorIndex = ["#x00205C", "#xF26829", "#xA6228C", "#x80BC00", "#x009ADE", "#x5B2C86"]
25
26let AfricaRegion = ["ZWE", "ZMB", "ZAF", "UGA", "TZA", "TGO", "TCD", "SYC", "SWZ", "STP", "SSD", "SLE", "SEN", "RWA", "NGA", "NER", "NAM", "MWI", "MUS", "MRT", "MOZ", "MLI", "MDG", "LSO", "LBR", "KEN", "GNQ", "GNB", "GMB", "GIN", "GHA", "GAB", "ETH", "ERI", "DZA", "CPV", "COM", "COG", "COD", "CMR", "CIV", "CAF", "BWA", "BFA", "BEN", "BDI", "AGO"];
27
28let America = ["VEN", "VCT", "USA", "URY", "TTO", "SUR", "SLV", "PRY", "PER", "PAN", "NIC", "MEX", "LCA", "JAM", "HTI", "HND", "GUY", "GTM", "GRD", "ECU", "DOM", "CUB", "CRI", "COL", "CHL", "CAN", "BRB", "BRA", "BOL", "BLZ", "BHS", "ATG", "ARG"];
29
30let Europe = ["UZB", "UKR", "TUR", "TKM", "TJK", "SWE", "SVN", "SVK", "SRB", "RUS", "ROU", "PRT", "POL", "NOR", "NLD", "MNE", "MLT", "MKD", "MDA", "LVA", "LUX", "LTU", "KGZ", "KAZ", "ITA", "ISR", "ISL", "IRL", "HUN", "HRV", "GRC", "GEO", "GBR", "FRA", "FIN", "EST", "ESP", "DNK", "DEU", "CZE", "CYP", "CHE", "BLR", "BIH", "BGR", "BEL", "AZE", "AUT", "ARM", "ALB"];
31
32let Assian = ["TLS", "THA", "PRK", "NPL", "MMR", "MDV", "LKA", "IND", "IDN", "BTN", "BGD"];
33
34let EasternMediterranean = ["YEM", "TUN", "SYR", "SOM", "SDN", "SAU", "QAT", "PAK", "OMN", "MAR", "LBY", "LBN", "KWT", "JOR", "IRQ", "IRN", "EGY", "DJI", "BHR", "ARE", "AFG"];
35
36let WesterPasific = ["WSM", "VUT", "VNM", "TON", "SLB", "SGP", "PNG", "PHL", "NZL", "MYS", "MNG", "LAO", "KOR", "KIR", "KHM", "JPN", "FSM", "FJI", "CHN", "BRN", "AUS"];
37let serviceUrl = 'https://tiles.arcgis.com/tiles/5T5nSi527N4F7luB/arcgis/rest/services/WHO_Polygon_Raster_Basemap/MapServer/tile/{z}/{y}/{x}';
38let x = 0;
39var map = "";
40let selectedCountryData = null;
41let specficCountryLayer = null;
42let selectedCountry = null;
43function BindDotNetRef(dotNet) {
44    dotnetRef = dotNet;
45}
46function AddIndChnPattern() {
47    let gradientString = `<pattern id="stripes" x="0" y="0" width="8" height="8" patternUnits="userSpaceOnUse" patternContentUnits="userSpaceOnUse" patternTransform="rotate(-45)">
48        <path stroke = "#d3d3d3" stroke-opacity="1" stroke-width="4" stroke-linecap="round" stroke-linejoin="round" fill="none" pointer-events="none" d = "M0 2 H 8"></path>
49        <path stroke="#FFFFFF" stroke-opacity="0" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" fill="none" pointer-events="none" d="M0 4.5 H 8"></path></pattern>`;
50
51    let svgDefs = document.createElementNS("http://www.w3.org/2000/svg", 'defs');
52    svgDefs.insertAdjacentHTML('afterbegin', gradientString);
53
54    let svg = document.getElementsByTagName('svg')[0];
55    svg.appendChild(svgDefs);
56}
57function ClearCountry() {
58    if ($(".blazored-typeahead__clear").length > 0)
59        $(".blazored-typeahead__clear").remove();
60    if (document.getElementsByClassName('leaflet-control-attribution').length > 0)
61        document.getElementsByClassName('leaflet-control-attribution')[0].style.display = 'none';
62
63}
64
65function legendBind(GlobalMortalityResponse, indcatorList, SelectedIndicatorkey, definition) {
66    let legend = L.control({ position: 'bottomright' })
67    legend.onAdd = function (map) {
68        let div = L.DomUtil.create('div', 'info legend')
69        let labels = []
70
71        let units = definition[3];
72        if (units != "" && units != " ")
73            units = " (" + units + ")";
74
75
76        div.innerhtml += labels.push('<div class="population-color-block grid-container"><div class="legend-explanation-wrapper">' +
77            '<div class="legend-title tool"><strong>' + GlobalMortalityResponse.indicatorName + units + '</strong><i class="material-icons icon-error tool">error_outline</i>' +
78            '<span class="tool_tip toolhome _w-auto"><span class="source-block">' + definition[0] + '</span>' +
79            '<div class="tool_definition">' + GlobalMortalityResponse.indicatorDefinition + '</div> </span></div></div>')
80
81        let curr = indcatorList[SelectedIndicatorkey]
82
83        for (let i = 0; i < curr.length; i++) {
84
85            div.innerHTML +=
86                labels.push(
87                    '<div class="color-block grid-item">' +
88                    '<div class="color-box" style="background-color:' + curr[i].item2 + '"></div>' +
89                    '<div class="color-label"><p>' + curr[i].item1 + '</p></div>' +
90                    '</div>');
91        }
92
93
94        div.innerHTML +=
95            labels.push('<div class="color-block grid-item"><div class="color-box" style="background-color:#f5f5f5;"></div><div class="color-label"><p>' + definition[1] + '</p></div></div>');
96        div.innerHTML +=
97            labels.push('<div class="color-block grid-item"><div class="color-box" style="background-color:#d3d3d3;"></div><div class="color-label"><p>' + definition[2] + '</p></div ></div>');
98        div.innerHTML = labels.join('');
99        return div
100    }
101    legend.addTo(map)
102    if (document.getElementsByClassName('leaflet-control-zoom-in').length > 0) {
103        document.getElementsByClassName('leaflet-control-zoom-in')[0].title = definition[4];
104    }
105    if (document.getElementsByClassName('leaflet-control-zoom-out').length > 0) {
106        document.getElementsByClassName('leaflet-control-zoom-out')[0].title = definition[5];
107    }
108}
109
110function leafletMap(countrycollection, GlobalMortalityResponse, SelectedIndicatorkey, indcatorList, diseaseId, list1, list2, isBack = false, iszoom = false, countryid = "", definition) {
111    if (!countryid) {
112        if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
113            document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
114            if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
115                document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
116        }
117    }
118
119
120    let val = Object.values(countrycollection);
121
122

123    let copiedJson = Object.create(COUNTRIES);
124
125    copiedJson.features.some((obj) => {
126        if (obj.properties.density != null) {
127            delete obj.properties.density;
128        }
129    });
130
131
132    for (let i = 0; i < val.length; i++) {
133        let countryCode = val[i].countryCode;
134        let name = val[i].countryName;
135        let population = val[i].numeric;
136
137        copiedJson.features.some((obj) => {
138            if (obj.id == countryCode) {
139                obj.properties.density = population;
140                return obj.properties.name = name;
141            }
142
143        });
144    }
145    if (isBack) {
146
147        geojson.clearLayers();
148        globalLayer = L.tileLayer(serviceUrl, {
149            maxZoom: 6,
150            crossOrigin: true,
151            minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
152            boundary: null,
153            noWrap: true
154        }).addTo(map);
155        specficCountryLayer.remove();
156        map.addLayer(globalLayer);
157        let geojson = L.geoJson(copiedJson, {
158            style: style,
159            onEachFeature: onEachFeature,
160        }).addTo(map);
161        geojson.eachLayer(layer => {
162            if (layer.feature?.dis_class === 'disputed-area') {
163                layer.bringToFront();
164            }
165        });

166        map.setView([40, 0], (window.innerWidth < 1440 ? 1.4 : 2));
167
168        document.getElementById('country-data').style.display = 'none';
169        document.getElementById('global-data').style.display = 'block';
170        let myElement = document.getElementById('BackContainer');
171        myElement.click();
172    }
173    else {
174        selectedCountryData = copiedJson;
175        if (map) {
176            map.remove();
177        }
178        if (selectedCountry != countryid) {
179            selectedCountry = null;
180        }
181        if (!!selectedCountry) {
182            map = L.map('chart-div').setView([0, 0], 2);
183        }
184        else if (!!countryid) {
185            map = L.map('chart-div').setView([0, 0], 2);
186        }
187        else {
188            map = L.map('chart-div').setView([0, 0], (window.innerWidth < 1440 ? 1.4 : 2));
189        }
190
191        globalLayer = L.tileLayer(serviceUrl, {
192            maxZoom: 6,
193            crossOrigin: true,
194            minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
195            boundary: null,
196            noWrap: true
197        }).addTo(map);
198
199        geojson = L.geoJson(copiedJson, {
200            style: style,
201            onEachFeature: onEachFeature,
202        }).addTo(map);
203        geojson.eachLayer(layer => {
204            if (layer.feature?.dis_class === 'disputed-area') {
205                layer.bringToFront();
206            }
207        });
208        document.getElementById('country-data').style.display = 'none';
209        document.getElementById('chart-div').style.backgroundImage = "";
210        document.getElementById('global-data').style.display = 'block';
211
212        geojson.eachLayer(function (layer) {
213            layer._path.id = layer.feature.id;
214            $(layer._path).addClass(layer.feature.dis_class);
215            $(layer._path).addClass(layer.feature.data_attr);
216            $(layer._path).addClass(layer.feature.zoom_data);
217            $(layer._path).addClass(layer.feature.data_class);
218        });
219    }
220    if (iszoom) {
221        let searchcountr = COUNTRIES.features.find(function (el) {
222            return el.id == countryid
223        });
224        currSearchCnt = searchcountr;
225        let legaltext = "M";
226        let test = countrycollection.filter(function (item) {
227            if (item.countryCode == searchcountr?.id)
228                return legaltext = item.legalStatus;
229        });
230        if (!!searchcountr && (legaltext != "M")) {
231            {
232                $(".countryProfileBtn").css('display', 'none');
233                $(".disabledCntProBtn").css('display', 'block');
234            }
235        }
236        else {
237            $(".countryProfileBtn").css('display', 'block');
238            $(".disabledCntProBtn").css('display', 'none');
239        }
240        if (legaltext != 'M') {
241            $(".countryProfileBtn").css('display', 'none');
242            $(".disabledCntProBtn").css('display', 'block');
243        }
244        specficCountryLayer = new L.TileLayer.BoundaryCanvas(serviceUrl, {
245            boundary: searchcountr,
246            crossOrigin: true,
247            noWrap: true,
248            maxZoom: 6,
249            minZoom: (window.innerWidth < 1440 ? 1.4 : 2)
250        });
251
252        map.addLayer(specficCountryLayer);
253
254
255        if (!!countryid) {
256            geojson.eachLayer(function (layer) {
257                if (layer.feature.dis_class != "disputed-area" && layer.feature.id != "AksaiChin")
258                    layer.setStyle({ fillColor: greyOut });
259                if (layer.feature.id == searchcountr.id) {
260                    $(layer._path).addClass("selectedCountry");
261                    layer.setStyle({ fillColor: getColor(layer.feature.properties.density, layer.feature.id) });
262                    map.fitBounds(layer.getBounds());
263
264                    if ("MDV" == $(".selectedCountry").attr('id')) {
265                        $("path#MDV").css("stroke-width", "2");
266                    }
267                    if ($(layer._path).hasClass('max-zoom-level')) {
268                        let currentZoom = map.getZoom();

269                        map.setMaxZoom(currentZoom + 8);
270                    }
271                    if ("FJI" == $(".selectedCountry").attr('id')) {
272                        map.setView([-18, 175], (window.innerWidth < 1440 ? 5 : 6));
273                    }
274                    else if ("NZL" == $(".selectedCountry").attr('id')) {
275                        if (map._animateToZoom == 4)
276                            map.setView([-45, 175], (window.innerWidth < 1440 ? 5 : 4.5))
277                        else if (map._animateToZoom == 3)
278                            map.setView([-45, 175], (window.innerWidth < 1440 ? 4 : 5))
279                        else
280                            map.setView([-45, 175], (window.innerWidth < 1440 ? 3 : 4))
281                    }
282                    else if ("RUS" == $(".selectedCountry").attr('id')) {
283                        map.setView([60, 75], (window.innerWidth < 1440 ? 2 : 3))
284                    }
285                    else if ("USA" == $(".selectedCountry").attr('id')) {

286                        map.setView([55, -90], (window.innerWidth < 1440 ? 2 : 3))
287                    }
288                    else if ("KIR" == $(".selectedCountry").attr('id')) {
289                        let currentZoom = map.getZoom();
290                        map.setMaxZoom(currentZoom + 6);
291                        map.setView([-2, 175], (window.innerWidth < 1440 ? 6 : 7));
292                        map.setMinZoom(7);
293
294                    }
295                    else if ("MHL" == $(".selectedCountry").attr('id')) {
296                        map.setView([7.5, 172], 7);
297                    }
298
299                    else if ("AND" == $(".selectedCountry").attr('id')) {
300                        map.setView([42.5, 2], 9);
301                        if (window.innerWidth > 1440) {
302                            map.setMaxZoom(12);
303                            map.setZoom(10);
304                        }
305                    }
306                    else if ("CAN" == $(".selectedCountry").attr('id')) {
307                        map.setVie

307w([65, -90], (window.innerWidth < 1440 ? 2 : 3))
308                    }
309                    else if ("VCT" == $(".selectedCountry").attr('id')) {
310                        map.setView([13.3, -61], 9);
311                        if (window.innerWidth > 1440) {
312                            map.setMaxZoom(12);
313                            map.setZoom(10);
314                        }
315                    }
316                    else if ("LCA" == $(".selectedCountry").attr('id')) {
317                        map.setView([13.8, -61], 9);
318                        if (window.innerWidth > 1440) {
319                            map.setMaxZoom(12);
320                            map.setZoom(10);
321                        }
322                    }
323                    else if ("KNA" == $(".selectedCountry").attr('id')) {
324                        map.setView([17.2, -63], 9);
325                        if (window.innerWidth > 1440) {
326                            map.setMaxZoom(12);
327                            map.setZoom(10);
328                        }
329                    }
330
331                }
332
333            });
334        }
335
336
337        if (!!searchcountr) {
338            if (!searchcountr.properties.name)
339                document.getElementById('CountryName').textContent = searchcountr.name;
340            else
341                document.getElementById('CountryName').textContent = searchcountr.properties.name;
342
343            let myElement = document.getElementById('CountryCode');
344            myElement.value = searchcountr.id;
345
346            let event = new Event('change');
347            myElement.dispatchEvent(event);
348
349            document.getElementById('country-data').style.display = 'none';
350            document.getElementById('global-data').style.display = 'block';
351
352            let myElement1 = document.getElementById('CountryActivate');
353            myElement1.click();
354        }
355
356        geojson.eachLayer(function (layer) {
357            layer._path.id = layer.feature.id;
358            $(layer._path).addClass(layer.feature.dis_class);
359            $(layer._path).addClass(layer.feature.data_attr);
360            $(layer._path).addClass(layer.feature.zoom_data);
361            $(layer._path).addClass(layer.feature.data_class);
362        });
363    }
364    AddIndChnPattern();
365    d3.select(".leaflet-pane svg").append("g").attr("id", "above-countries");
366
367    legendBind(GlobalMortalityResponse, indcatorList, SelectedIndicatorkey, definition);
368
369    map.on('click', function (e) {
370
371        let legaltext = "M";
372        countrycollection.filter(function (item) {
373            if (item.countryCode == selectedCountryData?.id)
374                return legaltext = item.legalStatus;
375        });
376
377        if (!!selectedCountryData && (legaltext != "M")) {
378            {
379                $(".countryProfileBtn").css('display', 'none');
380                $(".disabledCntProBtn").css('display', 'block');
381            }
382        }
383        else {
384            $(".countryProfileBtn").css('display', 'block');
385            $(".disabledCntProBtn").css('display', 'none');
386        }
387        if ((legaltext != "M")) {
388
389            $(".countryProfileBtn").css('display', 'none');
390            $(".disabledCntProBtn").css('display', 'block');
391        }
392
393
394        if (!selectedCountryData?.id) {
395            if (window.innerWidth < 1440) {
396                map.setMinZoom(1.4);
397                map.setZoom(1.4);
398            } else { map.setMinZoom(2); map.setZoom(2); }
399        }
400        if (!!countryid) {
401            if (countryid != selectedCountryData?.id) {
402                if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
403                    $('.blazored-typeahead__input-mask').text('');
404                    if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
405                        document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
406                }
407            }
408        }
409
410        let isCountrySelected = !!(selectedCountryData?.id) ? true : false;
411        if (!selectedCountryData || (!!currSearchCnt && selectedCountryData?.id != currSearchCnt?.id)) {
412            dotnetRef.invokeMethodAsync('ClearCountry', isCountrySelected);
413        }
414        if (selectedCountryData?.id) {
415
416            if (specficCountryLayer && countryid && !iszoom)
417                if (specficCountryLayer._events.tileunload.length == 1) {
418                    let myElement = document.getElementById('BackContainer');
419                    myElement.click();
420                    document.getElementById('country-data').style.display = 'none';
421                    document.getElementById('global-data').style.display = 'block';
422                    if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
423                        document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
424                        if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
425                            document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
426                    }
427                }
428
429
430            specficCountryLayer = new L.TileLayer.BoundaryCanvas(serviceUrl, {
431                boundary: selectedCountryData,
432                crossOrigin: true,
433                noWrap: true
434            });
435
436
437            geojson.eachLayer(function (layer) {
438                if ((($(".selectedCountry").length > 0 && selectedCountryData?.id != layer.feature.id) || (layer.feature.dis_class != "disputed-area")) && layer.feature.id != "AksaiChin") {
439                    layer.setStyle({ fillColor: greyOut });
440                }
441                if (selectedCountryData?.id == layer.feature.id) {
442                    layer.setStyle({ fillColor: getColor(layer.feature.properties.density, layer.feature.id) });
443
444                    if ("MDV" == $(".selectedCountry").attr('id')) {
445                        $("path#MDV").css("stroke-width", "2");
446                    }
447
448                    if ($(layer._path).hasClass('max-zoom-level')) {
449                        let currentZoom = map.getZoom();

450                        map.setMaxZoom(currentZoom + 8);
451                    }
452                    if ("FJI" == $(".selectedCountry").attr('id')) {
453                        map.setView([-18, 175], (window.innerWidth < 1440 ? 5 : 6));
454                    }
455                    else if ("NZL" == $(".selectedCountry").attr('id')) {
456                        if (map._animateToZoom == 4)
457                            map.setView([-45, 175], (window.innerWidth < 1440 ? 5 : 4.5))
458                        else if (map._animateToZoom == 3)
459                            map.setView([-45, 175], (window.innerWidth < 1440 ? 4 : 5))
460                        else
461                            map.setView([-45, 175], (window.innerWidth < 1440 ? 3 : 4))
462                    }
463                    else if ("RUS" == $(".selectedCountry").attr('id')) {
464                        map.setView([60, 75], (window.innerWidth < 1440 ? 2 : 3))
465                    }
466                    else if ("USA" == $(".selectedCountry").attr('id')) {

467                        map.setView([55, -90], (window.innerWidth < 1440 ? 2 : 3));
468
469                    }
470                    else if ("KIR" == $(".selectedCountry").attr('id')) {
471                        let currentZoom = map.getZoom();
472                        map.setMaxZoom(currentZoom + 6);
473                        map.setView([-2, 175], (window.innerWidth < 1440 ? 6 : 7));
474                    }
475                    else if ("MHL" == $(".selectedCountry").attr('id')) {
476                        map.setView([7.5, 172], 7);
477                    }
478                    else if ("AND" == $(".selectedCountry").attr('id')) {
479                        map.setView([42.5, 2], 9);
480                        if (window.innerWidth > 1440) {
481                            map.setMaxZoom(12);
482                            map.setZoom(10);
483                        }
484                    }
485                    else if ("CAN" == $(".selectedCountry").attr('id')) {
486                        map.setView([65, -90], (window.innerWidth < 1440 ? 2 : 3))
487                    }
488                    else if ("VCT" == $(".selectedCountry").attr('id')) {

489                        map.setView([13.3, -61], 9);
490                        if (window.innerWidth > 1440) {
491                            map.setMaxZoom(12);
492                            map.setZoom(10);
493                        }
494                    }
495                    else if ("LCA" == $(".selectedCountry").attr('id')) {
496                        map.setView([13.8, -61], 9);
497                        if (window.innerWidth > 1440) {
498                            map.setMaxZoom(12);
499                            map.setZoom(10);
500                        }
501                    }
502                    else if ("KNA" == $(".selectedCountry").attr('id')) {
503                        map.setView([17.2, -63], 9);
504                        if (window.innerWidth > 1440) {
505                            map.setMaxZoom(12);
506                            map.setZoom(10);
507                        }
508                    }
509
510                }
511            });
512
513
514            selectedCountry = selectedCountryData?.id;
515            selectedCountryData = null;
516        }
517        else {
518            geojson.remove();
519            globalLayer.remove();
520            globalLayer = L.tileLayer(serviceUrl, {
521                maxZoom: 6,
522                crossOrigin: true,
523                minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
524                boundary: null,
525                noWrap: true
526            }).addTo(map);
527            specficCountryLayer && specficCountryLayer.remove();
528
529            map.setMaxZoom(6);
530            map.setMinZoom((window.innerWidth < 1440 ? 1.4 : 2));
531
532
533            geojson = L.geoJson(copiedJson, {
534                style: style,
535                onEachFeature: onEachFeature,
536            }).addTo(map);
537            geojson.eachLayer(layer => {
538                if (layer.feature?.dis_class === 'disputed-area') {
539                    layer.bringToFront();
540                }
541            });

542            map.setView([40, 0], (window.innerWidth < 1440 ? 1.4 : 2));
543
544            document.getElementById('country-data').style.display = 'none';
545            document.getElementById('chart-div').style.backgroundImage = "";
546            document.getElementById('global-data').style.display = 'block';
547
548            let myElement = document.getElementById('Genderlegend');
549            myElement.click();
550            let myElement1 = document.getElementById('BackContainer');
551            myElement1.click();
552            selectedCountryData = null;
553            if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
554                document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
555                if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
556                    document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
557            }
558
559        }
560        geojson.eachLayer(function (layer) {
561            layer._path.id = layer.feature.id;
562            $(layer._path).addClass(layer.feature.dis_class);
563            $(layer._path).addClass(layer.feature.data_attr);
564            $(layer._path).addClass(layer.feature.zoom_data);
565            $(layer._path).addClass(layer.feature.data_class);
566        });
567    });
568
569    function getColor(value, id) {
570        let colorcode = null;
571        if ($(".selectedCountry").length > 0 && $(".selectedCountry").attr('id') != id) {
572            let colorcode = greyOut;
573            return colorcode;
574        }
575        if (value == "DNA") {
576            let RegionColor = "#f5f5f5";
577            return RegionColor;
578        }
579        if (value == "NA" || value == null) {
580            let colorcode = "#d3d3d3";
581            return colorcode;
582        }
583
584        if (list1.length == 0) {
585            switch (true) {
586
587                case value == null:
588                    colorcode = "#f5f5f5";
589                    break;
590                case value < 100000:
591                    colorcode = ncd[0];
592                    break;
593
594                case value < 500000:
595                    colorcode = ncd[1];
596                    break;
597                case value < 1000000:
598                    colorcode = ncd[2];
599                    break;
600                case value < 10000000:
601                    colorcode = ncd[3];
602                    break;
603                case value < 20000000:
604                    colorcode = ncd[4];
605                    break;
606
607                default:
608                    break;
609
610            }
611        } else {
612            for (let i = 0; i < list1.length; i++) {
613                if (i == list1.length - 1) {
614                    if (value >= list1[i])
615                        colorcode = list2[i];
616                    break;
617                }
618                if (value < list1[i]) {
619                    colorcode = list2[i];
620                    break;
621                }
622            }
623        }
624        return colorcode;
625    }
626
627    function style(feature) {
628        if (feature.id == "AksaiChin") {
629            return {
630                fillColor: 'url(#stripes)'
631            };
632        }
633        return {
634            fillColor: getColor(feature.properties.density, feature.id)
635        };
636    }
637    if (!!countryid) {
638        document.getElementById('country-data').style.display = 'block';
639        document.getElementById('global-data').style.display = 'none';
640    }
641    document.getElementsByClassName('leaflet-control-attribution')[0].style.display = 'none';
642    if (!countryid) {
643        map.panTo(new L.LatLng(40, 0));
644    }
645
646    $(document).on('click', '.search-icon', function () {
647        if ($(".blazored-typeahead__results div").length == 1) {
648            let srchVal = $(".blazored-typeahead__input").val().trim().toLowerCase().split(" ");
649            let rstVal = $($(".blazored-typeahead__results div")[0]).text().trim().toLowerCase().split(" ");
650            let arr = [];
651            let hasMatch = false;
652
653            for (let i = 0; i < srchVal.length; i++) {
654                hasMatch = false;
655                if (rstVal.includes(srchVal[i])) {
656                    arr.push(srchVal[i]);
657                    if (srchVal.length == 1) {
658                        hasMatch = true;
659                    }
660                    else if (arr.length > 0 && rstVal.join(" ").includes(arr.join(" "))) {
661                        hasMatch = true;
662                    }
663                }
664            }
665            if (hasMatch) $(".blazored-typeahead__results div").click();
666        }
667    });

668
669    $(document).on('click', 'body', function () {
670        if ($(".search-icon").length > 0) {
671            $(".blazored-typeahead__clear").remove();
672        }
673    });
674
675
676}
677
678function zoomToFeature(e) {
679    map.fitBounds(e.target.getBounds());
680    let currentTargetData = e.target;
681    selectedCountryData = COUNTRIES.features.find(function (el) {
682        return el.id == currentTargetData.feature.id
683    });
684    let layer = e.target;
685
686    $(".leaflet-interactive").removeClass("selectedCountry")
687    $(layer._path).addClass("selectedCountry");
688
689    if (!selectedCountryData.properties.name)
690        document.getElementById('CountryName').textContent = selectedCountryData.name;
691    else
692        document.getElementById('CountryName').textContent = selectedCountryData.properties.name;
693
694    let myElement = document.getElementById('CountryCode');
695    myElement.value = currentTargetData.feature.id;
696
697    let event = new Event('change');
698    myElement.dispatchEvent(event);
699
700    document.getElementById('country-data').style.display = 'block';
701    document.getElementById('global-data').style.display = 'none';
702
703    let myElement1 = document.getElementById('CountryActivate');
704    myElement1.click();
705}
706
707
708function onEachFeature(feature, layer) {
709    let whiteSpaceIds = ["Lakes1", "Lakes2", "Lakes3", "Lakes4", "Lakes5", "Lakes6", "Lakes7", "Lakes8", "Lakes9"]
710
711    if (feature?.dis_class != "disputed-area" && layer.feature.id != "AksaiChin" && whiteSpaceIds.indexOf(feature?.id) <= -1) {
712        layer.on({
713            click: zoomToFeature,
714            mouseover: highlightFeature,
715            mouseout: resetHighlight,
716        });
717    }
718
719}
720function CheckLists(val) {
721    switch (val) {
722        case 1:
723            return ncd;
724        case 2:
725            return cancer;
726        case 3:
727            return cvd;
728        case 4:
729            return crd;
730        case 5:
731            return diabeties;
732        case 6:
733            return alchol;
734        case 7:
735            return insuff;
736        case 8:
737            return obesity;
738        case 9:
739            return tobaco;
740    }
741}
742
743
744function resetHighlight(e) {
745    geojson.resetStyle(e.target);
746    d3.selectAll(".leaflet-interactive.selected").classed("selected", false);
747    e.target.unbindTooltip();
748}
749
750function highlightFeature(e) {
751    let layer = e.target;
752
753    let disputed_areas = ["triangle-disputed-border", "Bline_kosovo", "Bline-sudan", "Gaza", "Fline",
754        "Abyeiborder", "Abyeiborder1", "Abyei", "South-sud", "Jammu_and_Kashmir", "AksaiChin", "Cont_ja_ka", "Wline1", "Wline2", "Wline3", "Wline4", "Wline5",
755        "Lakes1", "Lakes2", "Lakes3", "Lakes4", "Lakes5", "Lakes6", "Lakes7", "Lakes8", "Lakes9"];
756   
757    let c = document.getElementById(layer.feature.id);
758    if (!c) return;
759    d3.selectAll(".leaflet-interactive").classed("selected", false);
760    d3.select(c).classed("selected", true);
761    layer.bringToFront();
762
763    let tooltipText = layer.feature.properties.name || layer.feature.name || layer.feature.id;
764
765    if (tooltipText) {
766        layer.bindTooltip(tooltipText, {  
767            sticky: true,
768            permanent: false,
769            interactive: false,
770            direction: 'top',
771            className: 'countryToolTip'
772        });
773    }
774}
775
776function RegionMapChange(RegionID, RegionCollection, GlobalMortalityResponse, SelectedIndicatorkey, indcatorList, diseaseId, list1, list2, isback = false, iszoom = false, countryid = "", definition) {
777
778    if (!countryid) {
779        if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
780            document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
781            if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
782                document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
783        }
784        document.getElementById('chart-div').style.backgroundImage = "";
785    }
786    if ($(".leaflet-control-zoom-in").length > 0) {
787        document.getElementsByClassName('leaflet-control-zoom-in')[0].title = definition[4];
788    }
789    if ($(".leaflet-control-zoom-out").length > 0) {
790        document.getElementsByClassName('leaflet-control-zoom-out')[0].title = definition[5];
791    }
792    let lst = Regionval.find(function (el) {
793        return el.id == RegionID
794    });

795    let latitude = lst.lat;
796    let lang = lst.lag;
797
798    let val = Object.values(RegionCollection);
799
800    let copiedJson = Object.assign({}, COUNTRIES);
801
802    copiedJson.features.some((obj) => {
803        if (obj.properties.density != null) {
804            obj.properties.density = null;
805        }
806    });
807
808    if (RegionCollection.length != 0) {
809        for (i = 0; i < val.length; i++) {
810            let countryCode = val[i].countryCode;
811            let name = val[i].countryName;
812            let population = val[i].numeric;
813            if (val[i].legalStatus != "M") {
814                population = "NO";
815            }
816            copiedJson.features.some((obj) => {
817                if (obj.id == countryCode) {
818                    obj.properties.density = population;
819                    return obj.properties.name = name;
820                }
821            });
822        }
823    }
824
825
826    if (isback) {
827        geojson.clearLayers();
828        globalLayer = L.tileLayer(serviceUrl, {
829            maxZoom: 6,
830            crossOrigin: true,
831            minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
832            boundary: null,
833            noWrap: true
834        }).addTo(map);
835        specficCountryLayer.remove();
836        map.addLayer(globalLayer);
837        geojson = L.geoJson(copiedJson, {
838            style: style,
839            onEachFeature: onEachFeature,
840        }).addTo(map);
841        geojson.eachLayer(layer => {
842            if (layer.feature?.dis_class === 'disputed-area') {
843                layer.bringToFront();
844            }
845        });

846        map.setView([40, 0], (window.innerWidth < 1440 ? 1.4 : 2));
847
848        document.getElementById('country-data').style.display = 'none';
849        document.getElementById('chart-div').style.backgroundImage = "";
850        document.getElementById('global-data').style.display = 'block';
851        let myElement = document.getElementById('BackContainer');
852        myElement.click();
853
854    } else {
855        selectedCountryData = copiedJson;
856        if (map) { map.remove(); }
857        map = L.map('chart-div').setView([latitude, lang], window.innerWidth < 1440 ? 2 : 3);
858        globalLayer = L.tileLayer(serviceUrl, {
859            maxZoom: 6,
860            crossOrigin: true,
861            minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
862            boundary: null,
863            noWrap: true
864        }).addTo(map);
865
866        geojson = L.geoJson(copiedJson, {
867            style: style,
868            onEachFeature: onEachFeature,
869        }).addTo(map);
870        geojson.eachLayer(layer => {
871            if (layer.feature?.dis_class === 'disputed-area') {
872                layer.bringToFront();
873            }
874        });
875        document.getElementById('country-data').style.display = 'none';
876        document.getElementById('global-data').style.display = 'block';
877    }
878
879    geojson.eachLayer(function (layer) {
880        layer._path.id = layer.feature.id;
881        $(layer._path).addClass(layer.feature.dis_class);
882        $(layer._path).addClass(layer.feature.data_attr);
883        $(layer._path).addClass(layer.feature.zoom_data);
884        $(layer._path).addClass(layer.feature.data_class);
885    });
886    if (document.getElementsByClassName('leaflet-control-attribution').length > 0)
887        document.getElementsByClassName('leaflet-control-attribution')[0].style.display = 'none';
888
889    AddIndChnPattern();
890    d3.select(".leaflet-pane svg").append("g").attr("id", "above-countries");
891    legendBind(GlobalMortalityResponse, indcatorList, SelectedIndicatorkey, definition);
892
893    map.on('click', function (e) {
894        let legaltext = "";
895        let isregion = false;
896        RegionCollection.filter(function (item) {
897            if (item.countryCode == selectedCountryData?.id) {
898                isregion = true;
899                return legaltext = item.legalStatus;
900            }
901
902        });
903
904
905        if (!!selectedCountryData && (legaltext != "M")) {
906            {
907                $(".countryProfileBtn").css('display', 'none');
908                $(".disabledCntProBtn").css('display', 'block');
909            }
910        }
911        else {
912            $(".countryProfileBtn").css('display', 'block');
913            $(".disabledCntProBtn").css('display', 'none');
914        }
915        if ((legaltext != "M") && ((legaltext != "M") || !isregion)) {
916
917            $(".countryProfileBtn").css('display', 'none');
918            $(".disabledCntProBtn").css('display', 'block');
919        }
920        if (!selectedCountryData?.id) {
921            if (window.innerWidth < 1440) {
922                map.setMinZoom(1.4);
923                map.setZoom(1.4);
924            } else { map.setMinZoom(2); map.setZoom(2); }
925        }
926        if (!!countryid) {
927            if (countryid != selectedCountryData?.id) {
928                if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
929                    $('.blazored-typeahead__input-mask').text('');
930                    if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
931                        document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
932                }
933            }
934        }
935        let isCountrySelected = !!(selectedCountryData?.id) ? true : false;
936        if (!selectedCountryData || (!!currSearchCnt && selectedCountryData?.id != currSearchCnt?.id)) {
937            dotnetRef.invokeMethodAsync('ClearCountry', isCountrySelected);
938        }
939        if (selectedCountryData?.id) {
940            if (specficCountryLayer && countryid && !iszoom)
941                if (specficCountryLayer._events.tileunload.length == 1) {
942                    let myElement = document.getElementById('BackContainer');
943                    myElement.click();
944                    document.getElementById('country-data').style.display = 'none';
945                    document.getElementById('global-data').style.display = 'block';
946                    if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
947                        document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
948                        if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
949                            document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
950                    }
951                }
952            specficCountryLayer = new L.TileLayer.BoundaryCanvas(serviceUrl, {
953                boundary: selectedCountryData,
954                noWrap: true,
955                crossOrigin: true,
956                maxZoom: 6,
957                minZoom: (window.innerWidth < 1440 ? 1.4 : 2)
958            });
959            geojson.eachLayer(function (layer) {
960                if ((($(".selectedCountry").length > 0 && selectedCountryData?.id != layer.feature.id) || (layer.feature.dis_class != "disputed-area")) && layer.feature.id != "AksaiChin") {
961                    layer.setStyle({
962                        fillColor: "#d3d3d3"
963                    });
964                }
965                if (selectedCountryData?.id == layer.feature.id) {
966                    layer.setStyle({ fillColor: RegiongetColor(layer.feature.properties.density, layer.feature.id, RegionID, diseaseId) });
967
968                    if ("MDV" == $(".selectedCountry").attr('id')) {
969                        $("path#MDV").css("stroke-width", "2");
970                    }
971
972
973                    if ($(layer._path).hasClass('max-zoom-level')) {
974                        let currentZoom = map.getZoom();

975                        map.setMaxZoom(currentZoom + 8);
976                    }
977                    if ("FJI" == $(".selectedCountry").attr('id')) {
978                        map.setView([-18, 175], (window.innerWidth < 1440 ? 5 : 6));
979                    }
980                    else if ("NZL" == $(".selectedCountry").attr('id')) {
981                        if (map._animateToZoom == 4)
982                            map.setView([-45, 175], (window.innerWidth < 1440 ? 5 : 4.5))
983                        else if (map._animateToZoom == 3)
984                            map.setView([-45, 175], (window.innerWidth < 1440 ? 4 : 5))
985                        else
986                            map.setView([-45, 175], (window.innerWidth < 1440 ? 3 : 4))
987                    }
988                    else if ("RUS" == $(".selectedCountry").attr('id')) {
989                        map.setView([60, 75], (window.innerWidth < 1440 ? 2 : 3));
990                    }
991                    else if ("USA" == $(".selectedCountry").attr('id')) {
992

993                        map.setView([55, -90], (window.innerWidth < 1440 ? 2 : 3));
994                    }
995                    else if ("KIR" == $(".selectedCountry").attr('id')) {
996                        let currentZoom = map.getZoom();
997                        map.setMaxZoom(currentZoom + 6);
998                        map.setView([-2, 175], (window.innerWidth < 1440 ? 6 : 7));
999                    }
1000                    else if ("MHL" == $(".selectedCountry").attr('id')) {
1001                        map.setView([7.5, 172], 7);
1002                    }
1003                    else if ("AND" == $(".selectedCountry").attr('id')) {
1004                        map.setView([42.5, 2], 9);
1005                        if (window.innerWidth > 1440) {
1006                            map.setMaxZoom(12);
1007                            map.setZoom(10);
1008                        }
1009                    }
1010                    else if ("CAN" == $(".selectedCountry").attr('id')) {
1011                        map.setView([65, -90], (window.innerWidth < 1440 ? 2 : 3))
1012                    }
1013                    else if ("VCT" == $(".selectedCountry").attr('id')) {

1014                        map.setView([13.3, -61], 9);
1015                        if (window.innerWidth > 1440) {
1016                            map.setMaxZoom(12);
1017                            map.setZoom(10);
1018                        }
1019                    }
1020                    else if ("LCA" == $(".selectedCountry").attr('id')) {
1021                        map.setView([13.8, -61], 9);
1022                        if (window.innerWidth > 1440) {
1023                            map.setMaxZoom(12);
1024                            map.setZoom(10);
1025                        }
1026                    }
1027                    else if ("KNA" == $(".selectedCountry").attr('id')) {
1028                        map.setView([17.2, -63], 9);
1029                        if (window.innerWidth > 1440) {
1030                            map.setMaxZoom(12);
1031                            map.setZoom(10);
1032                        }
1033                    }
1034
1035                }
1036            });
1037            selectedCountryData = null;
1038        } else {
1039            geojson.remove();
1040            globalLayer.remove();
1041            globalLayer = L.tileLayer(serviceUrl, {
1042                maxZoom: 6,
1043                crossOrigin: true,
1044                minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
1045                boundary: null,
1046                noWrap: true
1047            }).addTo(map);
1048            specficCountryLayer && specficCountryLayer.remove();
1049
1050            map.setMaxZoom(6);
1051            map.setMinZoom((window.innerWidth < 1440 ? 1.4 : 2));
1052
1053
1054            geojson = L.geoJson(copiedJson, {
1055                style: style,
1056                onEachFeature: onEachFeature,
1057            }).addTo(map);
1058            geojson.eachLayer(layer => {
1059                if (layer.feature?.dis_class === 'disputed-area') {
1060                    layer.bringToFront();
1061                }
1062            });
1063            if (RegionID == 2) {

1064                map.setView([15, -50], 1);
1065            }
1066            else if (RegionID == 6) {
1067                map.setView([5, 105], window.innerWidth < 1440 ? 1.4 : 22);
1068            }
1069            else if (RegionID == 4) {
1070                map.setView([60, 50], window.innerWidth < 1440 ? 1.4 : 2);
1071            }
1072            else {
1073
1074                if (map._animateToZoom == 2 || map._animateToZoom == 3)
1075                    map.setView([latitude, lang], window.innerWidth < 1440 ? 2 : 3)
1076
1077                else if (map._animateToZoom == 4) {
1078                    map.setView([latitude, lang], 2)
1079                }
1080                else map.setView([latitude, lang], 3);
1081
1082            }
1083
1084
1085            document.getElementById('country-data').style.display = 'none';
1086            document.getElementById('chart-div').style.backgroundImage = "";
1087            document.getElementById('global-data').style.display = 'block';
1088
1089            let myElement = document.getElementById('Genderlegend');
1090            myElement.click();
1091
1092            let myElement1 = document.getElementById('BackContainer');
1093            myElement1.click();
1094
1095            selectedCountryData = null;
1096            if (document.getElementsByClassName("blazored-typeahead__input-mask").length > 0) {
1097                document.getElementsByClassName("blazored-typeahead__input-mask")[0].textContent = "";
1098                if (!!document.getElementsByClassName("blazored-typeahead__clear")[0])
1099                    document.getElementsByClassName("blazored-typeahead__clear")[0].textContent = "";
1100            }
1101            geojson.eachLayer(function (layer) {
1102                layer._path.id = layer.feature.id;
1103                $(layer._path).addClass(layer.feature.dis_class);
1104                $(layer._path).addClass(layer.feature.data_attr);
1105                $(layer._path).addClass(layer.feature.zoom_data);
1106                $(layer._path).addClass(layer.feature.data_class);
1107            });
1108        }
1109
1110    });
1111
1112    if (iszoom) {
1113
1114
1115        var searchcountr = COUNTRIES.features.find(function (el) {
1116            return el.id == countryid
1117        });
1118        currSearchCnt = searchcountr;
1119
1120        let isCountrySelected = !!(currSearchCnt?.id) ? true : false;
1121        switch (RegionID) {
1122            case 1:
1123                if (!AfricaRegion.includes(currSearchCnt?.id))
1124                    break;
1125            case 2:
1126                if (!America.includes(currSearchCnt?.id))
1127                    break;
1128            case 3:
1129                if (!Assian.includes(currSearchCnt?.id))
1130                    break;
1131            case 4:
1132                if (!Europe.includes(currSearchCnt?.id))
1133                    break;
1134            case 5:
1135                if (!EasternMediterranean.includes(currSearchCnt?.id))
1136                    break;
1137            case 6:
1138                if (!WesterPasific.includes(selectedCountryData?.id))
1139                    break;
1140            default:
1141                break;
1142        }
1143
1144        if (!isCountrySelected) {
1145            $(".blazored-typeahead__clear").click();
1146        }
1147        let legaltext = "M";
1148        let isregion = false;
1149        RegionCollection.filter(function (item) {
1150            if (item.countryCode == searchcountr?.id) {
1151                isregion = true;
1152                return legaltext = item.legalStatus;
1153            }
1154
1155        });
1156        if (!!searchcountr && ((legaltext != "M") || !isregion || !searchcountr?.properties?.density)) {
1157            {
1158                $(".countryProfileBtn").css('display', 'none');
1159                $(".disabledCntProBtn").css('display', 'block');
1160            }
1161        }
1162        else {
1163            $(".countryProfileBtn").css('display', 'block');
1164            $(".disabledCntProBtn").css('display', 'none');
1165        }
1166        if ((!isregion && legaltext != 'M')) {
1167            $(".countryProfileBtn").css('display', 'none');
1168            $(".disabledCntProBtn").css('display', 'block');
1169        }
1170        specficCountryLayer = new L.TileLayer.BoundaryCanvas(serviceUrl, {
1171            maxZoom: 6,
1172            crossOrigin: true,
1173            minZoom: (window.innerWidth < 1440 ? 1.4 : 2),
1174            boundary: searchcountr,
1175            noWrap: true
1176        });
1177        map.addLayer(specficCountryLayer);
1178        var isloaded = false;
1179        if (!!countryid) {
1180            geojson.eachLayer(function (layer) {
1181                if (layer.feature.dis_class != "disputed-area" && layer.feature.id != "AksaiChin")
1182                    layer.setStyle({ fillColor: "#d3d3d3" });
1183                if (layer.feature.id == searchcountr.id) {
1184                    $(layer._path).addClass("selectedCountry");
1185                    layer.setStyle({ fillColor: RegiongetColor(layer.feature.properties.density, layer.feature.id, RegionID, diseaseId) });
1186                    map.fitBounds(layer.getBounds());
1187                }
1188                if ("MDV" == $(".selectedCountry").attr('id')) {
1189                    $("path#MDV").css("stroke-width", "2");
1190                }
1191
1192                if ($(layer._path).hasClass('max-zoom-level')) {
1193                    let currentZoom = map.getZoom();

1194                    map.setMaxZoom(currentZoom + 8);
1195                }
1196
1197
1198                if (isloaded == false) {
1199                    switch ($(".selectedCountry").attr('id')) {
1200                        case "FJI":
1201                            map.setView([-18, 175], (window.innerWidth < 1440 ? 5 : 6));
1202                            isloaded = true;
1203                            break;
1204                        case "NZL":
1205                            if (map._animateToZoom == 4)
1206                                map.setView([-45, 175], (window.innerWidth < 1440 ? 5 : 4.5))
1207                            else if (map._animateToZoom == 3)
1208                                map.setView([-45, 175], (window.innerWidth < 1440 ? 4 : 5))
1209                            else
1210                                map.setView([-45, 175], (window.innerWidth < 1440 ? 3 : 4))
1211                            isloaded = true;
1212                            break;
1213                        case "RUS":
1214                            map.setView([60, 75], (window.innerWidth < 1440 ? 2 : 3))
1215                            isloaded = true;
1216                            break;
1217                        case "USA":

1218                            map.setView([55, -90], (window.innerWidth < 1440 ? 2 : 3))
1219                            isloaded = true;
1220                            break;
1221                        case "KIR":
1222                            let currentZoom = map.getZoom();
1223                            map.setMaxZoom(currentZoom + 6);
1224                            map.setView([-2, 175], (window.innerWidth < 1440 ? 4 : 5));
1225                            isloaded = true;
1226                            break;
1227                        case "MHL":
1228                            map.setView([7.5, 172], 7);
1229                            isloaded = true;
1230                            break;
1231                        case "AND":
1232                            map.setView([42.5, 2], 9);
1233                            if (window.innerWidth > 1440) {
1234                                map.setMaxZoom(12);
1235                                map.setZoom(10);
1236                            }
1237                            isloaded = true;
1238                            break;
1239                        case "CAN":

1240                            map.setView([65, -90], (window.innerWidth < 1440 ? 2 : 3))
1241                            isloaded = true;
1242                            break;
1243                        case "VCT":
1244                            map.setView([13.3, -61], 9);
1245                            if (window.innerWidth > 1440) {
1246                                map.setMaxZoom(12);
1247                                map.setZoom(10);
1248                            }
1249                            isloaded = true;
1250                            break;
1251                        case "LCA":
1252                            map.setView([13.8, -61], 9);
1253                            if (window.innerWidth > 1440) {
1254                                map.setMaxZoom(12);
1255                                map.setZoom(10);
1256                            }
1257                            isloaded = true;
1258                            break;
1259                        case "KNA":
1260                            map.setView([17.2, -63], 9);
1261                            if (window.innerWidth > 1440) {
1262                                map.setMaxZoom(12);
1263                                map.setZoom(10);
1264                            }
1265                            isloaded = true;
1266                            break;
1267                        default:
1268                            isloaded = true;
1269                            break;
1270                    }
1271                }
1272            });
1273
1274        }
1275
1276        if (!!searchcountr.id) {
1277            if (!searchcountr.properties.name)
1278                document.getElementById('CountryName').textContent = searchcountr.properties.name;
1279
1280            if (document.getElementById('CountryName').textContent != searchcountr.properties.name)
1281                document.getElementById('CountryName').textContent = searchcountr.properties.name
1282
1283            let myElement = document.getElementById('CountryCode');
1284            myElement.value = searchcountr.id;
1285
1286            let event = new Event('change');
1287            myElement.dispatchEvent(event);
1288
1289            document.getElementById('country-data').style.display = 'block';
1290            document.getElementById('global-data').style.display = 'none';
1291
1292            let myElement1 = document.getElementById('CountryActivate');
1293            myElement1.click();
1294        }
1295
1296        geojson.eachLayer(function (layer) {
1297            layer._path.id = layer.feature.id;
1298            $(layer._path).addClass(layer.feature.dis_class);
1299            $(layer._path).addClass(layer.feature.data_attr);
1300            $(layer._path).addClass(layer.feature.zoom_data);
1301            $(layer._path).addClass(layer.feature.data_class);
1302        });
1303
1304    }
1305    function style(feature) {
1306        if (feature.id == "AksaiChin") {
1307            return {
1308                fillColor: 'url(#stripes)'
1309            };
1310        }
1311        return {
1312            fillColor: RegiongetColor(feature.properties.density, feature.id, RegionID, diseaseId)
1313        };
1314    }
1315
1316
1317    function RegiongetColor(value, Country, RegionID, id) {
1318        let RegionColor = null;
1319        if ($(".selectedCountry").length > 0 && $(".selectedCountry").attr('id') != Country) {
1320            let colorcode = "#d3d3d3";
1321            return colorcode;
1322        }
1323        else {
1324            RegionColor = "#f5f5f5";
1325
1326            if (list1.length == 0) {
1327                switch (true) {
1328                    case value == "NA":
1329                        RegionColor = "#d3d3d3";
1330                        break;
1331                    case value == null:
1332                        RegionColor = "#f5f5f5";
1333                        break;
1334                    case value < 100000:
1335                        RegionColor = ncd[0];
1336                        break;
1337
1338                    case value < 500000:
1339                        RegionColor = ncd[1];
1340                        break;
1341                    case value < 1000000:
1342                        RegionColor = ncd[2];
1343                        break;
1344                    case value < 10000000:
1345                        RegionColor = ncd[3];
1346                        break;
1347                    case value < 20000000:
1348                        RegionColor = ncd[4];
1349                        break;
1350                    default:
1351                        break;
1352
1353                }
1354            } else {
1355                if (value == "DNA") {
1356                    RegionColor = "#f5f5f5";
1357                    return RegionColor;
1358                }
1359                if (value == "NA" || value == null) {
1360                    RegionColor = "#d3d3d3";
1361                    return RegionColor;
1362                }
1363                for (i = 0; i < list1.length; i++) {
1364                    if (i == list1.length - 1) {
1365                        if (value >= list1[i])
1366                            RegionColor = list2[i]
1367                        else
1368                            RegionColor = "#d3d3d3"
1369                        break;
1370                    }
1371                    if (value < list1[i]) {
1372                        RegionColor = list2[i];
1373                        break;
1374                    }
1375                }
1376            }
1377            return RegionColor;
1378        }
1379    }
1380
1381    if (!!countryid) {
1382        document.getElementById('country-data').style.display = 'block';
1383        document.getElementById('global-data').style.display = 'none';
1384    }
1385    else {
1386        document.getElementById('country-data').style.display = 'none';
1387        document.getElementById('global-data').style.display = 'block';
1388        $(".RegionalprofileBtn").css('display', 'block');
1389    }
1390    if (document.getElementsByClassName('leaflet-control-attribution').length > 0)
1391        document.getElementsByClassName('leaflet-control-attribution')[0].style.display = 'none';
1392    if (!countryid) {
1393        map.panTo(new L.LatLng(40, 0));
1394    }
1395    if (!countryid)
1396        map.setZoom(2.6);
1397
1398    if (!countryid) {
1399        if (RegionID == 2) {

1400            map.setView([15, -50], 1);
1401        }
1402        if (RegionID == 4) {
1403            map.setView([60, 50], window.innerWidth < 1440 ? 1.4 : 2);
1404        }
1405        if (RegionID == 6) {
1406            map.setView([5, 105], window.innerWidth < 1440 ? 1.4 : 2);
1407        }
1408
1409
1410    }
1411
1412    if (document.getElementsByClassName('leaflet-control-attribution').length > 0)
1413        document.getElementsByClassName('leaflet-control-attribution')[0].style.display = 'none';
1414
1415}
1416
1417