diff --git a/README.md b/README.md index 9607a9a..3048cad 100755 --- a/README.md +++ b/README.md @@ -63,7 +63,7 @@ Here is a brief explanation of the template folder structure and some of its mai │ │ │ └── sidebar # Sidebar JS code. │ │ │ └── skycons # Animated icons plugin init. │ │ │ └── utils # Basic utils used for proper rendering. -│ │ │ └── vectorMaps # Vector maps plugin init. +│ │ │ └── MapboxGLMaps # Mapbox GL Maps plugin init. │ │ │ └── index.js # Indicator file. │ │ │ │ │ └── static # Contains the non-code files. @@ -134,7 +134,7 @@ Used to create a local dev server in order to preview the final output of build - [Fullcalendar](https://fullcalendar.io/) - [Jquery](https://jquery.com/) - [Jquery Sparkline](https://omnipotent.net/jquery.sparkline/) -- [Jvectormap](http://jvectormap.com/) +- [Mapbox](https://www.mapbox.com/) - [Load Google Maps API](https://github.com/yuanqing/load-google-maps-api) - [Lodash](https://lodash.com/) - [Masonry](https://masonry.desandro.com/) diff --git a/forms.php b/forms.php index c47ffdf..e441bfe 100644 --- a/forms.php +++ b/forms.php @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/package.json b/package.json index 018ac9f..eff03d8 100755 --- a/package.json +++ b/package.json @@ -46,23 +46,25 @@ "webpack-dev-server": "^2.9.3" }, "dependencies": { - "babel-polyfill": "^6.26.0", - "bootstrap": "^4.0.0", - "bootstrap-datepicker": "^1.7.1", - "brand-colors": "^2.0.1", - "chart.js": "^2.9.2", - "datatables": "^1.10.13", + "@babel/polyfill": "^7.10.1", + "@popperjs/core": "^2.4.2", + "bootstrap": "^4.5.0", + "bootstrap-datepicker": "^1.9.0", + "brand-colors": "^2.1.1", + "chart.js": "^2.9.3", + "datatables": "^1.10.18", "easy-pie-chart": "^2.1.7", "file-loader": "^1.1.5", - "fullcalendar": "^3.6.2", - "jquery": "^3.2.1", + "fullcalendar": "3.10.0", + "jquery": "^3.5.1", "jquery-sparkline": "^2.4.0", "jvectormap": "^2.0.4", - "load-google-maps-api": "^1.0.0", - "lodash": "^4.17.4", - "masonry-layout": "^4.2.0", - "moment": "^2.19.1", - "perfect-scrollbar": "^1.1.0", + "load-google-maps-api": "^2.0.2", + "lodash": "^4.17.15", + "mapbox-gl": "^1.11.0", + "masonry-layout": "^4.2.2", + "moment": "^2.27.0", + "perfect-scrollbar": "^1.5.0", "popper.js": "^1.12.6", "skycons": "^1.0.0" } diff --git a/src/assets/scripts/vectorMaps/index.js b/src/assets/scripts/vectorMaps/index.js index f8d4426..38f94ed 100755 --- a/src/assets/scripts/vectorMaps/index.js +++ b/src/assets/scripts/vectorMaps/index.js @@ -1,94 +1,110 @@ import * as $ from 'jquery'; import 'jvectormap'; +import mapboxgl from "mapbox-gl"; import 'jvectormap/jquery-jvectormap.css'; import './jquery-jvectormap-world-mill.js'; import { debounce } from 'lodash'; -export default (function () { - const vectorMapInit = () => { - if ($('#world-map-marker').length > 0) { - // This is a hack, as the .empty() did not do the work - $('#vmap').remove(); +// export default (function () { +// const vectorMapInit = () => { +// if ($('#world-map-marker').length > 0) { +// // This is a hack, as the .empty() did not do the work +// $('#vmap').remove(); - // we recreate (after removing it) the container div, to reset all the data of the map - $('#world-map-marker').append(` -
    -
    - `); +// // we recreate (after removing it) the container div, to reset all the data of the map +// $('#world-map-marker').append(` +//
    +//
    +// `); - $('#vmap').vectorMap({ - map: 'world_mill', - backgroundColor: '#fff', - borderColor: '#fff', - borderOpacity: 0.25, - borderWidth: 0, - color: '#e6e6e6', - regionStyle : { - initial : { - fill : '#e4ecef', - }, - }, +// $('#vmap').vectorMap({ +// map: 'world_mill', +// backgroundColor: '#fff', +// borderColor: '#fff', +// borderOpacity: 0.25, +// borderWidth: 0, +// color: '#e6e6e6', +// regionStyle : { +// initial : { +// fill : '#e4ecef', +// }, +// }, - markerStyle: { - initial: { - r: 7, - 'fill': '#fff', - 'fill-opacity':1, - 'stroke': '#000', - 'stroke-width' : 2, - 'stroke-opacity': 0.4, - }, - }, +// markerStyle: { +// initial: { +// r: 7, +// 'fill': '#fff', +// 'fill-opacity':1, +// 'stroke': '#000', +// 'stroke-width' : 2, +// 'stroke-opacity': 0.4, +// }, +// }, - markers : [{ - latLng : [21.00, 78.00], - name : 'INDIA : 350', - }, { - latLng : [-33.00, 151.00], - name : 'Australia : 250', - }, { - latLng : [36.77, -119.41], - name : 'USA : 250', - }, { - latLng : [55.37, -3.41], - name : 'UK : 250', - }, { - latLng : [25.20, 55.27], - name : 'UAE : 250', - }], - series: { - regions: [{ - values: { - 'US': 298, - 'SA': 200, - 'AU': 760, - 'IN': 200, - 'GB': 120, - }, - scale: ['#03a9f3', '#02a7f1'], - normalizeFunction: 'polynomial', - }], - }, - hoverOpacity: null, - normalizeFunction: 'linear', - zoomOnScroll: false, - scaleColors: ['#b6d6ff', '#005ace'], - selectedColor: '#c9dfaf', - selectedRegions: [], - enableZoom: false, - hoverColor: '#fff', - }); - } - }; +// markers : [{ +// latLng : [21.00, 78.00], +// name : 'INDIA : 350', +// }, { +// latLng : [-33.00, 151.00], +// name : 'Australia : 250', +// }, { +// latLng : [36.77, -119.41], +// name : 'USA : 250', +// }, { +// latLng : [55.37, -3.41], +// name : 'UK : 250', +// }, { +// latLng : [25.20, 55.27], +// name : 'UAE : 250', +// }], +// series: { +// regions: [{ +// values: { +// 'US': 298, +// 'SA': 200, +// 'AU': 760, +// 'IN': 200, +// 'GB': 120, +// }, +// scale: ['#03a9f3', '#02a7f1'], +// normalizeFunction: 'polynomial', +// }], +// }, +// hoverOpacity: null, +// normalizeFunction: 'linear', +// zoomOnScroll: false, +// scaleColors: ['#b6d6ff', '#005ace'], +// selectedColor: '#c9dfaf', +// selectedRegions: [], +// enableZoom: false, +// hoverColor: '#fff', +// }); +// } +// }; - vectorMapInit(); - $(window).resize(debounce(vectorMapInit, 150)); -})(); +// vectorMapInit(); +// $(window).resize(debounce(vectorMapInit, 150)); +// })(); + +$(document).ready(() => { + //MapBox-GL + + if (document.getElementById("world-map-marker")) { + mapboxgl.accessToken = 'pk.eyJ1IjoiZGFzaGJvYXJlZHBhY2siLCJhIjoiY2s5bWlhZHRqMDAxazNsbnlpbXhhdDcwMSJ9.YU6cxTiRujREOAIVO6iLmA'; + var coordinates = document.getElementById('coordinates'); + var map = new mapboxgl.Map({ + container: 'world-map-marker', + style: 'mapbox://styles/mapbox/streets-v11', + center: [0, 0], + zoom: 1 + }); + } +}); diff --git a/src/basic-table.html b/src/basic-table.html index 09e21cc..c343a83 100755 --- a/src/basic-table.html +++ b/src/basic-table.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/blank.html b/src/blank.html index 617fbdb..1d243cf 100755 --- a/src/blank.html +++ b/src/blank.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/buttons.html b/src/buttons.html index 64213e1..c7c7b3b 100755 --- a/src/buttons.html +++ b/src/buttons.html @@ -168,7 +168,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/calendar.html b/src/calendar.html index e0d4cc5..786b257 100755 --- a/src/calendar.html +++ b/src/calendar.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/charts.html b/src/charts.html index 06bbdb1..9541dd1 100755 --- a/src/charts.html +++ b/src/charts.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/chat.html b/src/chat.html index d99fb88..c68e8f9 100755 --- a/src/chat.html +++ b/src/chat.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/compose.html b/src/compose.html index 6566b7f..71ee344 100755 --- a/src/compose.html +++ b/src/compose.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/datatable.html b/src/datatable.html index 9fa78df..9b7f9d7 100755 --- a/src/datatable.html +++ b/src/datatable.html @@ -219,7 +219,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/email.html b/src/email.html index f00c105..09116d7 100755 --- a/src/email.html +++ b/src/email.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/forms.html b/src/forms.html index ec75d71..8a9a1d7 100755 --- a/src/forms.html +++ b/src/forms.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/google-maps.html b/src/google-maps.html index a677cc2..926fea9 100755 --- a/src/google-maps.html +++ b/src/google-maps.html @@ -218,7 +218,7 @@ Google Map
  • - Vector Map + Mapbox GL Map
  • diff --git a/src/index.html b/src/index.html index 7c305f9..1839f2e 100755 --- a/src/index.html +++ b/src/index.html @@ -6,6 +6,16 @@ Dashboard