From d6f0a37ac49ca2128b11913fc8cc4cc7f05688b0 Mon Sep 17 00:00:00 2001
From: Rhys Howell <rhysh@live.com>
Date: Tue, 24 Apr 2018 14:18:33 -0400
Subject: [PATCH 1/4] Add error handling callback function
---
README.md | 1 +
.../custom-map-data-error-handling.html | 24 +++++++++++++++++++
src/index.d.ts | 1 +
src/js/datamaps.js | 6 ++++-
4 files changed, 31 insertions(+), 1 deletion(-)
create mode 100644 src/examples/custom-map-data-error-handling.html
diff --git a/README.md b/README.md
index 39b034ac..8da83700 100644
--- a/README.md
+++ b/README.md
@@ -599,6 +599,7 @@ If the aspect ratio of your custom map is not the default `16:9` (`0.5625`), you
width: null, // If not null, datamaps will grab the width of 'element',
responsive: false, // If true, call `resize()` on the map object when it should adjust it's size
done: function() {}, // Callback when the map is done drawing
+ error: function() {}, // Callback when the map cannot fetch the dataUrl
fills: {
defaultFill: '#ABDDA4' // The keys in this object map to the "fillKey" of [data] or [bubbles]
},
diff --git a/src/examples/custom-map-data-error-handling.html b/src/examples/custom-map-data-error-handling.html
new file mode 100644
index 00000000..8caef419
--- /dev/null
+++ b/src/examples/custom-map-data-error-handling.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<body>
+ <script src="http://d3js.org/d3.v3.min.js"></script>
+ <script src="http://d3js.org/topojson.v1.min.js"></script>
+ <!-- I recommend you host this file on your own, since this will change without warning -->
+ <script src="/src/rel/datamaps.world.js"></script>
+ <h2>Custom Map Data Error Handling</h2>
+ <div id="errorContainer" style="color: green; padding: 10px; font-size: 16px;" />
+ <div id="container1" style="position: relative; width: 500px; height: 450px;"></div>
+ <script>
+ //basic map config with custom fills, mercator projection
+ var map = new Datamap({
+ element: document.getElementById('container1'),
+ geographyConfig: {
+ dataUrl: 'NON_EXISTANT.json'
+ },
+ error: function(e) {
+ const domEl = document.getElementById('errorContainer');
+ domEl.innerText = `Caught error when fetching data: ${e}`;
+ }
+ });
+ </script>
+</body>
\ No newline at end of file
diff --git a/src/index.d.ts b/src/index.d.ts
index 1700fb09..9376060b 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -14,6 +14,7 @@ declare interface DataMapOptions {
path: d3.geo.Path;
projection: d3.geo.Projection;
}) => void;
+ error?: (error: any) => void;
responsive?: boolean;
projection?: string;
height?: null | number;
diff --git a/src/js/datamaps.js b/src/js/datamaps.js
index 121e2711..bcf8cc22 100644
--- a/src/js/datamaps.js
+++ b/src/js/datamaps.js
@@ -13,6 +13,7 @@
dataType: 'json',
data: {},
done: function() {},
+ error: function() {},
fills: {
defaultFill: '#ABDDA4'
},
@@ -765,7 +766,10 @@
// If custom URL for topojson data, retrieve it and render
if ( options.geographyConfig.dataUrl ) {
d3.json( options.geographyConfig.dataUrl, function(error, results) {
- if ( error ) throw new Error(error);
+ if ( error ) {
+ self.options.error(error);
+ return;
+ }
self.customTopo = results;
draw( results );
});
From 57e94f4ec307acbcc592e537ed4e127e025a94f9 Mon Sep 17 00:00:00 2001
From: Rhys Howell <rhysh@live.com>
Date: Tue, 24 Apr 2018 14:22:57 -0400
Subject: [PATCH 2/4] Update test html file
---
.../custom-map-data-error-handling.html | 22 +++++++++----------
1 file changed, 10 insertions(+), 12 deletions(-)
diff --git a/src/examples/custom-map-data-error-handling.html b/src/examples/custom-map-data-error-handling.html
index 8caef419..3df85680 100644
--- a/src/examples/custom-map-data-error-handling.html
+++ b/src/examples/custom-map-data-error-handling.html
@@ -3,22 +3,20 @@
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://d3js.org/topojson.v1.min.js"></script>
- <!-- I recommend you host this file on your own, since this will change without warning -->
<script src="/src/rel/datamaps.world.js"></script>
<h2>Custom Map Data Error Handling</h2>
<div id="errorContainer" style="color: green; padding: 10px; font-size: 16px;" />
<div id="container1" style="position: relative; width: 500px; height: 450px;"></div>
<script>
- //basic map config with custom fills, mercator projection
- var map = new Datamap({
- element: document.getElementById('container1'),
- geographyConfig: {
- dataUrl: 'NON_EXISTANT.json'
- },
- error: function(e) {
- const domEl = document.getElementById('errorContainer');
- domEl.innerText = `Caught error when fetching data: ${e}`;
- }
- });
+ var map = new Datamap({
+ element: document.getElementById('container1'),
+ geographyConfig: {
+ dataUrl: 'NON_EXISTANT.json'
+ },
+ error: function(e) {
+ const domEl = document.getElementById('errorContainer');
+ domEl.innerText = `Caught error when fetching data: ${e}`;
+ }
+ });
</script>
</body>
\ No newline at end of file
From 4d907d7cd17ed8644ffb6880831ac88ec784df8f Mon Sep 17 00:00:00 2001
From: Rhys Howell <rhysh@live.com>
Date: Thu, 3 May 2018 14:22:48 -0400
Subject: [PATCH 3/4] Update error to optional
---
README.md | 2 +-
src/js/datamaps.js | 10 +++++++---
2 files changed, 8 insertions(+), 4 deletions(-)
diff --git a/README.md b/README.md
index 8da83700..655ee8d8 100644
--- a/README.md
+++ b/README.md
@@ -599,7 +599,7 @@ If the aspect ratio of your custom map is not the default `16:9` (`0.5625`), you
width: null, // If not null, datamaps will grab the width of 'element',
responsive: false, // If true, call `resize()` on the map object when it should adjust it's size
done: function() {}, // Callback when the map is done drawing
- error: function() {}, // Callback when the map cannot fetch the dataUrl
+ error: null, // If not null, callback when the map cannot fetch the dataUrl
fills: {
defaultFill: '#ABDDA4' // The keys in this object map to the "fillKey" of [data] or [bubbles]
},
diff --git a/src/js/datamaps.js b/src/js/datamaps.js
index bcf8cc22..c7147f59 100644
--- a/src/js/datamaps.js
+++ b/src/js/datamaps.js
@@ -13,7 +13,7 @@
dataType: 'json',
data: {},
done: function() {},
- error: function() {},
+ error: null,
fills: {
defaultFill: '#ABDDA4'
},
@@ -767,8 +767,12 @@
if ( options.geographyConfig.dataUrl ) {
d3.json( options.geographyConfig.dataUrl, function(error, results) {
if ( error ) {
- self.options.error(error);
- return;
+ if (self.options.error ) {
+ self.options.error(error);
+ return;
+ }
+
+ throw new Error(error);
}
self.customTopo = results;
draw( results );
From 65dd252f6611345e29d9201ab828b36a46503eca Mon Sep 17 00:00:00 2001
From: Rhys Howell <rhysh@live.com>
Date: Thu, 3 May 2018 14:24:05 -0400
Subject: [PATCH 4/4] Style tweak
---
src/js/datamaps.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/js/datamaps.js b/src/js/datamaps.js
index c7147f59..65bad681 100644
--- a/src/js/datamaps.js
+++ b/src/js/datamaps.js
@@ -767,7 +767,7 @@
if ( options.geographyConfig.dataUrl ) {
d3.json( options.geographyConfig.dataUrl, function(error, results) {
if ( error ) {
- if (self.options.error ) {
+ if ( self.options.error ) {
self.options.error(error);
return;
}