diff --git a/examples/js/Examples.js b/examples/js/Examples.js
index 6558e394..9b3cb376 100644
--- a/examples/js/Examples.js
+++ b/examples/js/Examples.js
@@ -71,6 +71,7 @@ Examples.prototype = {
"basic-bars-horizontal",
"basic-bars-stacked",
"basic-stacked-horizontal",
+ "basic-bars-custom-colors",
"basic-pie",
"basic-radar",
"basic-bubble",
diff --git a/examples/js/examples/basic-bars-custom-colors.js b/examples/js/examples/basic-bars-custom-colors.js
new file mode 100644
index 00000000..225e37f5
--- /dev/null
+++ b/examples/js/examples/basic-bars-custom-colors.js
@@ -0,0 +1,45 @@
+(function () {
+
+Flotr.ExampleList.add({
+ key : 'basic-bars-custom-colors',
+ name : 'Basic Bars with Custom Colors',
+ callback : basic_bars_custom_colors
+});
+
+function basic_bars_custom_colors (container) {
+
+ var
+ d1 = [[0, 8], [1, 6], [2, 4], [3, 7]], // Series 1
+ d2 = [[0.1, 5], [1.1, 9], [2.1, 3], [3.1, 8]], // Series 2
+ d3 = [[0.2, 7], [1.2, 4], [2.2, 6], [3.2, 5]], // Series 3
+ d4 = [[0.3, 3], [1.3, 8], [2.3, 9], [3.3, 4]], // Series 4
+ d5 = [[0.4, 6], [1.4, 7], [2.4, 5], [3.4, 9]], // Series 5
+ d6 = [[0.5, 9], [1.5, 3], [2.5, 8], [3.5, 6]], // Series 6
+ d7 = [[0.6, 4], [1.6, 5], [2.6, 7], [3.6, 3]], // Series 7
+ d8 = [[0.7, 8], [1.7, 6], [2.7, 4], [3.7, 7]]; // Series 8
+
+ // Draw the graph with custom colors from issue #322
+ Flotr.draw(
+ container,
+ [d1, d2, d3, d4, d5, d6, d7, {data: d8, color: '#0000FF'}],
+ {
+ colors: ["#89AFD2","#1D1D1D","#DF021D","#0E204B","#D67840","#0E204B","#D67840"],
+ bars : {
+ show : true,
+ horizontal : false,
+ shadowSize : 0,
+ barWidth : 0.1
+ },
+ mouse : {
+ track : true,
+ relative : true
+ },
+ yaxis : {
+ min : 0,
+ autoscaleMargin : 1
+ }
+ }
+ );
+}
+
+})();
\ No newline at end of file
diff --git a/examples/js/includes.dev.js b/examples/js/includes.dev.js
index 74ac97be..a9478465 100644
--- a/examples/js/includes.dev.js
+++ b/examples/js/includes.dev.js
@@ -59,6 +59,7 @@ yepnope([
'js/examples/basic-axis.js',
'js/examples/basic-bars.js',
'js/examples/basic-bars-stacked.js',
+ 'js/examples/basic-bars-custom-colors.js',
'js/examples/basic-pie.js',
'js/examples/basic-radar.js',
'js/examples/basic-bubble.js',
diff --git a/make/examples.json b/make/examples.json
index 98e0d1fe..18eb42dd 100644
--- a/make/examples.json
+++ b/make/examples.json
@@ -14,6 +14,7 @@
"./examples/js/examples/basic-stepped.js",
"./examples/js/examples/basic-axis.js",
"./examples/js/examples/basic-bars.js",
+ "./examples/js/examples/basic-bars-custom-colors.js",
"./examples/js/examples/basic-bars-stacked.js",
"./examples/js/examples/basic-pie.js",
"./examples/js/examples/basic-radar.js",
diff --git a/package.json b/package.json
index 74206eaf..95a2eee3 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,8 @@
"build": "make build",
"test": "npm run build && playwright test",
"test:headed": "npm run build && playwright test --headed",
- "test:debug": "npm run build && playwright test --debug"
+ "test:debug": "npm run build && playwright test --debug",
+ "test:update-snapshots": "npm run build && playwright test --update-snapshots"
},
"devDependencies": {
"@playwright/test": "^1.40.0",
diff --git a/tests/examples.spec.js-snapshots/examples-page-loads-chromium-linux.png b/tests/examples.spec.js-snapshots/examples-page-loads-chromium-linux.png
index 5d7e5d9f..81139ce0 100644
Binary files a/tests/examples.spec.js-snapshots/examples-page-loads-chromium-linux.png and b/tests/examples.spec.js-snapshots/examples-page-loads-chromium-linux.png differ
diff --git a/tests/visual-regression.spec.html b/tests/visual-regression.spec.html
index d47da8b4..bb08e62e 100644
--- a/tests/visual-regression.spec.html
+++ b/tests/visual-regression.spec.html
@@ -24,6 +24,7 @@
+
diff --git a/tests/visual-regression.spec.js b/tests/visual-regression.spec.js
index ec5d008f..4c1d0325 100644
--- a/tests/visual-regression.spec.js
+++ b/tests/visual-regression.spec.js
@@ -19,7 +19,10 @@ test.describe('Visual Regression Tests - Examples', () => {
'basic',
'basic-axis',
'basic-bars',
+ 'basic-bars-custom-colors',
+ 'basic-bars-horizontal',
'basic-bars-stacked',
+ 'basic-stacked-horizontal',
'basic-bubble',
'basic-candle',
'basic-candle-barchart',
diff --git a/tests/visual-regression.spec.js-snapshots/basic-bars-custom-colors-example-chromium-linux.png b/tests/visual-regression.spec.js-snapshots/basic-bars-custom-colors-example-chromium-linux.png
new file mode 100644
index 00000000..d1995c23
Binary files /dev/null and b/tests/visual-regression.spec.js-snapshots/basic-bars-custom-colors-example-chromium-linux.png differ
diff --git a/tests/visual-regression.spec.js-snapshots/basic-bars-horizontal-example-chromium-linux.png b/tests/visual-regression.spec.js-snapshots/basic-bars-horizontal-example-chromium-linux.png
new file mode 100644
index 00000000..d55464af
Binary files /dev/null and b/tests/visual-regression.spec.js-snapshots/basic-bars-horizontal-example-chromium-linux.png differ
diff --git a/tests/visual-regression.spec.js-snapshots/basic-stacked-horizontal-example-chromium-linux.png b/tests/visual-regression.spec.js-snapshots/basic-stacked-horizontal-example-chromium-linux.png
new file mode 100644
index 00000000..6ceb741f
Binary files /dev/null and b/tests/visual-regression.spec.js-snapshots/basic-stacked-horizontal-example-chromium-linux.png differ