diff --git a/README.md b/README.md
index 6d9c350..4041457 100644
--- a/README.md
+++ b/README.md
@@ -209,7 +209,7 @@ sets the placement of the axis. Defaults to bottom.
### .colors(callback)
-sets the d3 color scale the data series in the timeline. Defaults to `d3.scale.category20()`.
+sets the d3 color scale the data series in the timeline. Defaults to `d3.scaleOrdinal(d3.schemeCategory10)`.
### .colorProperty(propertyName)
diff --git a/dist/d3-timelines.js b/dist/d3-timelines.js
index 7505efa..9777c08 100644
--- a/dist/d3-timelines.js
+++ b/dist/d3-timelines.js
@@ -2,7 +2,7 @@
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('d3-axis'), require('d3-array'), require('d3-time-format'), require('d3-time'), require('d3-scale'), require('d3-selection'), require('d3-zoom')) :
typeof define === 'function' && define.amd ? define(['exports', 'd3-axis', 'd3-array', 'd3-time-format', 'd3-time', 'd3-scale', 'd3-selection', 'd3-zoom'], factory) :
(factory((global.d3 = global.d3 || {}),global.d3,global.d3,global.d3,global.d3,global.d3,global.d3,global.d3));
-}(this, function (exports,d3Axis,d3Array,d3TimeFormat,d3Time,d3Scale,d3Selection,d3Zoom) { 'use strict';
+}(this, (function (exports,d3Axis,d3Array,d3TimeFormat,d3Time,d3Scale,d3Selection,d3Zoom) { 'use strict';
var timelines = function() {
var DISPLAY_TYPES = ["circle", "rect"];
@@ -31,7 +31,7 @@
allowZoom = true,
axisBgColor = "white",
chartData = {},
- colorCycle = d3Scale.scaleOrdinal(d3Scale.schemeCategory20),
+ colorCycle = d3Scale.scaleOrdinal(d3Scale.schemeCategory10),
colorPropertyName = null,
display = "rect",
beginning = 0,
@@ -59,7 +59,9 @@
showAxisHeaderBackground = false,
showAxisNav = false,
showAxisCalendarYear = false,
- xAxisClass = 'timeline-xAxis'
+ xAxisClass = 'timeline-xAxis',
+ xScale = null,
+ xAxis = null
;
var appendTimeAxis = function(g, xAxis, yPosition) {
@@ -272,10 +274,7 @@
output = days + 'd ' + output;
}
return output;
- };
-
- var xScale;
- var xAxis;
+ }
if (orient == "bottom") {
xAxis = d3Axis.axisBottom();
} else if (orient == "top") {
@@ -314,7 +313,7 @@
chartData = d;
d.forEach( function(datum, index){
var data = datum.times;
- data.forEach(function(d) { d.name = datum.name });
+ data.forEach(function(d) { d.name = datum.name; });
var hasLabel = (typeof(datum.label) != "undefined");
@@ -492,18 +491,16 @@
var xpos = -d3Selection.event.transform.x;
scroll(xpos, xScale);
};
- };
-
- var zoom = d3Zoom.zoom()
- .scaleExtent([0, maxZoom]) // max zoom defaults to 5
- .translateExtent([[0, 0], [width, 0]]) // [x0, y0], [x1, y1] don't allow translating y-axis
- .on("zoom", move);
-
- gParent
- .classed("scrollable", true)
- .call(zoom);
-
- if (! allowZoom) {
+ }
+ if (allowZoom) {
+ var zoom = d3Zoom.zoom()
+ .scaleExtent([0, maxZoom]) // max zoom defaults to 5
+ .translateExtent([[0, 0], [width, 0]]) // [x0, y0], [x1, y1] don't allow translating y-axis
+ .on("zoom", move);
+
+ gParent.classed("scrollable", true)
+ .call(zoom);
+
g.on("wheel", function() {
d3Selection.event.preventDefault();
d3Selection.event.stopImmediatePropagation();
@@ -603,7 +600,7 @@
function setWidth() {
if (!width && !gParentSize.width) {
try {
- width = gParentItem.node().attr("width");
+ width = gParentItem.node().getAttribute("width");
if (!width) {
throw "width of the timeline is not set. As of Firefox 27, timeline().with(x) needs to be explicitly set in order to render";
}
@@ -900,4 +897,4 @@
Object.defineProperty(exports, '__esModule', { value: true });
-}));
\ No newline at end of file
+})));
diff --git a/examples/days.html b/examples/days.html
index d532ea9..a7097df 100644
--- a/examples/days.html
+++ b/examples/days.html
@@ -2,7 +2,7 @@
-
+