Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

d3plus-viz

Package Overview
Dependencies
Maintainers
1
Versions
210
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

d3plus-viz - npm Package Compare versions

Comparing version 1.2.5 to 1.3.0

12

es/index.js

@@ -1,6 +0,6 @@

export { default as dataConcat } from "./src/data/concat";
export { default as addToQueue } from "./src/data/addToQueue";
export { default as dataFold } from "./src/data/fold";
export { default as dataLoad } from "./src/data/load";
export { default as isData } from "./src/data/isData";
export { default as Viz } from "./src/Viz";
export { default as dataConcat } from "./src/data/concat.js";
export { default as addToQueue } from "./src/data/addToQueue.js";
export { default as dataFold } from "./src/data/fold.js";
export { default as dataLoad } from "./src/data/load.js";
export { default as isData } from "./src/data/isData.js";
export { default as Viz } from "./src/Viz.js";

2

es/src/_drawAttribution.js
import { select } from "d3-selection";
import { stylize } from "d3plus-common";
/**

@@ -8,3 +9,2 @@ @name _drawAttribution

*/
export default function () {

@@ -11,0 +11,0 @@ var attr = select(this._select.node().parentNode).selectAll("div.d3plus-attribution").data(this._attribution ? [0] : []);

4

es/src/_drawBack.js
import { elem } from "d3plus-common";
/**

@@ -7,3 +8,2 @@ @function _drawBack

*/
export default function () {

@@ -18,3 +18,2 @@ var visible = this._history.length;

}).node();
this._backClass.data(visible ? [{

@@ -25,4 +24,3 @@ text: "\u2190 ".concat(this._translate("Back")),

}] : []).select(backGroup).config(this._backConfig).render();
this._margin.top += visible ? this._backClass.fontSize()() + this._backClass.padding()() * 2 : 0;
}

10

es/src/_drawColorScale.js
import { min } from "d3-array";
import { elem } from "d3plus-common";
/**

@@ -8,10 +9,6 @@ @function _drawColorScale

*/
export default function () {
var _this = this;
var data = this._data;
var position = this._colorScalePosition.bind(this)(this.config());
if (![false, "top", "bottom", "left", "right"].includes(position)) position = "bottom";

@@ -41,10 +38,7 @@ var wide = ["top", "bottom"].includes(position);

}).node();
if (showColorScale) {
var scaleData = data.filter(function (d, i) {
var c = _this._colorScale(d, i);
return c !== undefined && c !== null;
});
this._colorScaleClass.align({

@@ -56,5 +50,3 @@ bottom: "end",

}[position] || "bottom").duration(this._duration).data(scaleData).height(height).locale(this._locale).orient(position).select(scaleGroup).value(this._colorScale).width(width).config(this._colorScaleConfig).render();
var scaleBounds = this._colorScaleClass.outerBounds();
if (position && !this._colorScaleConfig.select && scaleBounds.height) {

@@ -61,0 +53,0 @@ if (wide) this._margin[position] += scaleBounds.height + this._legendClass.padding() * 2;else this._margin[position] += scaleBounds.width + this._legendClass.padding() * 2;

25

es/src/_drawLegend.js
import { rollup } from "d3-array";
import { configPrep, elem, merge } from "d3plus-common";
/**

@@ -8,6 +9,6 @@ @function legendLabel

*/
export function legendLabel(d, i) {
return this._drawLabel(d, i, this._legendDepth);
}
/**

@@ -19,12 +20,8 @@ @function _drawLegend

*/
export default function () {
var _this = this;
var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
var legendData = [];
var color = function color(d, i) {
var shape = _this._shape(d, i);
var attr = shape === "Line" ? "stroke" : "fill";

@@ -34,14 +31,10 @@ var value = _this._shapeConfig[shape] && _this._shapeConfig[shape][attr] ? _this._shapeConfig[shape][attr] : _this._shapeConfig[attr];

};
var opacity = function opacity(d, i) {
var shape = _this._shape(d, i);
var value = _this._shapeConfig[shape] && _this._shapeConfig[shape].opacity ? _this._shapeConfig[shape].opacity : _this._shapeConfig.opacity;
return typeof value === "function" ? value.bind(_this)(d, i) : value;
};
var fill = function fill(d, i) {
return "".concat(color(d, i), "_").concat(opacity(d, i));
};
var rollupData = this._colorScale ? data.filter(function (d, i) {

@@ -58,3 +51,2 @@ return _this._colorScale(d, i) === undefined;

this._legendDepth = 0;
var _loop = function _loop(x) {

@@ -64,3 +56,2 @@ var values = labels.map(function (l) {

});
if (!values.some(function (v) {

@@ -73,22 +64,14 @@ return v instanceof Array;

};
for (var x = 0; x <= this._drawDepth; x++) {
var _ret = _loop(x);
if (_ret === "break") break;
}
var hidden = function hidden(d, i) {
var id = _this._id(d, i);
if (id instanceof Array) id = id[0];
return _this._hidden.includes(id) || _this._solo.length && !_this._solo.includes(id);
};
var legendBounds = this._legendClass.outerBounds();
var config = this.config();
var position = this._legendPosition.bind(this)(config);
if (![false, "top", "bottom", "left", "right"].includes(position)) position = "bottom";

@@ -105,5 +88,3 @@ var wide = ["top", "bottom"].includes(position);

};
var visible = this._legend.bind(this)(config, legendData);
var legendGroup = elem("g.d3plus-viz-legend", {

@@ -116,3 +97,2 @@ condition: visible && !this._legendConfig.select,

}).node();
this._legendClass.id(fill).align(wide ? "center" : position).direction(wide ? "row" : "column").duration(this._duration).data(visible ? legendData : []).height(wide ? this._height - (this._margin.bottom + this._margin.top) : this._height - (this._margin.bottom + this._margin.top + padding.bottom + padding.top)).locale(this._locale).parent(this).select(legendGroup).verticalAlign(!wide ? "middle" : position).width(wide ? this._width - (this._margin.left + this._margin.right + padding.left + padding.right) : this._width - (this._margin.left + this._margin.right)).shapeConfig(configPrep.bind(this)(this._shapeConfig, "legend")).shapeConfig({

@@ -129,3 +109,2 @@ fill: function fill(d, i) {

}).config(this._legendConfig).render();
if (!this._legendConfig.select && legendBounds.height) {

@@ -132,0 +111,0 @@ if (wide) this._margin[position] += legendBounds.height + this._legendClass.padding() * 2;else this._margin[position] += legendBounds.width + this._legendClass.padding() * 2;

15

es/src/_drawTimeline.js
import { extent } from "d3-array";
import { date } from "d3plus-axis";
import { elem, unique } from "d3plus-common";
/**

@@ -10,8 +11,5 @@ @function setTimeFilter

*/
function setTimeFilter(s) {
var _this = this;
if (!(s instanceof Array)) s = [s, s];
if (JSON.stringify(s) !== JSON.stringify(this._timelineSelection)) {

@@ -26,2 +24,3 @@ this._timelineSelection = s;

}
/**

@@ -33,7 +32,4 @@ @function _drawTimeline

*/
export default function () {
var _this2 = this;
var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];

@@ -59,3 +55,2 @@ var timelinePossible = this._time && this._timeline;

}).node();
if (timelinePossible) {

@@ -65,5 +60,3 @@ var timeline = this._timelineClass.domain(extent(ticks)).duration(this._duration).height(this._height - this._margin.bottom).locale(this._locale).select(timelineGroup).ticks(ticks.sort(function (a, b) {

})).width(this._width - (this._margin.left + this._margin.right + padding.left + padding.right));
var dataExtent = extent(data.map(this._time).map(date));
if (!this._timelineSelection) {

@@ -75,6 +68,6 @@ this._timelineSelection = dataExtent;

}
timeline.selection(this._timelineSelection);
var config = this._timelineConfig;
timeline.config(config) // .on("brush", s => {
timeline.config(config)
// .on("brush", s => {
// setTimeFilter.bind(this)(s);

@@ -81,0 +74,0 @@ // if (config.on && config.on.brush) config.on.brush(s);

4

es/src/_drawTitle.js
import { elem } from "d3plus-common";
/**

@@ -8,3 +9,2 @@ @function _drawTitle

*/
export default function () {

@@ -28,8 +28,6 @@ var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];

}).node();
this._titleClass.data(text ? [{
text: text
}] : []).locale(this._locale).select(group).width(this._width - (this._margin.left + this._margin.right + padding.left + padding.right)).config(this._titleConfig).render();
this._margin.top += text ? group.getBBox().height + this._titleConfig.padding * 2 : 0;
}

4

es/src/_drawTotal.js
import { sum } from "d3-array";
import { elem } from "d3plus-common";
/**

@@ -9,3 +10,2 @@ @function _drawTotal

*/
export default function () {

@@ -29,8 +29,6 @@ var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];

}).node();
this._totalClass.data(total ? [{
text: this._totalFormat(total)
}] : []).locale(this._locale).select(group).width(this._width - (this._margin.left + this._margin.right + padding.left + padding.right)).config(this._totalConfig).render();
this._margin.top += total ? group.getBBox().height + this._totalConfig.padding * 2 : 0;
}

9

es/src/_getSize.js
import { select } from "d3-selection";
/**

@@ -6,10 +7,7 @@ @desc Given an HTMLElement and a "width" or "height" string, this function returns the current calculated size for the DOM element.

*/
function _elementSize(element, s) {
if (!element) return undefined;
if (element.tagName === undefined || ["BODY", "HTML"].indexOf(element.tagName) >= 0) {
var val = window["inner".concat(s.charAt(0).toUpperCase() + s.slice(1))];
var elem = select(element);
if (s === "width") {

@@ -26,10 +24,9 @@ val -= parseFloat(elem.style("margin-left"), 10);

}
return val;
} else {
var _val = parseFloat(select(element).style(s), 10);
if (typeof _val === "number" && _val > 0) return _val;else return _elementSize(element.parentNode, s);
}
}
/**

@@ -41,6 +38,4 @@ @function getSize

*/
export default function (elem) {
return [_elementSize(elem, "width"), _elementSize(elem, "height")];
}

6

es/src/_inViewport.js

@@ -13,6 +13,6 @@ /**

var height = bounds.height,
left = bounds.left + pageX,
top = bounds.top + pageY,
width = bounds.width;
left = bounds.left + pageX,
top = bounds.top + pageY,
width = bounds.width;
return pageY + window.innerHeight > top + buffer && pageY + buffer < top + height && pageX + window.innerWidth > left + buffer && pageX + buffer < left + width;
}

80

es/src/_zoomControls.js
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { select } from "d3-selection";

@@ -17,2 +11,3 @@ import { zoomTransform } from "d3-zoom";

var brushing = false;
/**

@@ -23,15 +18,11 @@ @name zoomControls

*/
export default function () {
var _this = this;
if (!this._container || !this._zoomGroup) return;
var height = this._zoomHeight || this._height - this._margin.top - this._margin.bottom,
that = this,
width = this._zoomWidth || this._width - this._margin.left - this._margin.right;
that = this,
width = this._zoomWidth || this._width - this._margin.left - this._margin.right;
this._zoomBehavior.extent([[0, 0], [width, height]]).scaleExtent([1, this._zoomMax]).translateExtent([[0, 0], [width, height]]).on("zoom", function (event) {
return zoomed.bind(_this)(event.transform);
});
this._zoomToBounds = zoomToBounds.bind(this);

@@ -58,9 +49,6 @@ var control = select(this._select.node().parentNode).selectAll("div.d3plus-zoom-control").data(this._zoom ? [0] : []);

});
this._zoomBrush.extent([[0, 0], [width, height]]).filter(function (event) {
return !event.button && event.detail < 2;
}).handleSize(this._zoomBrushHandleSize).on("start", brushStart.bind(this)).on("brush", brushBrush.bind(this)).on("end", brushEnd.bind(this));
var brushGroup = this._container.selectAll("g.brush").data([0]);
this._brushGroup = brushGroup.enter().append("g").attr("class", "brush").merge(brushGroup).call(this._zoomBrush);

@@ -70,2 +58,3 @@ zoomEvents.bind(this)();

}
/**

@@ -76,3 +65,2 @@ @name zoomEvents

*/
function zoomEvents() {

@@ -82,10 +70,7 @@ var brush = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;

if (brushing) this._brushGroup.style("display", "inline");else this._brushGroup.style("display", "none");
if (!brushing && this._zoom) {
this._container.call(this._zoomBehavior);
if (!this._zoomScroll) {
this._container.on("wheel.zoom", null);
}
if (!this._zoomPan) {

@@ -98,2 +83,3 @@ this._container.on("mousedown.zoom mousemove.zoom", null).on("touchstart.zoom touchmove.zoom touchend.zoom touchcancel.zoom", null);

}
/**

@@ -106,14 +92,11 @@ @name zoomed

*/
function zoomed() {
var transform = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
if (this._zoomGroup) {
if (!duration) this._zoomGroup.attr("transform", transform);else this._zoomGroup.transition().duration(duration).attr("transform", transform);
}
if (this._renderTiles) this._renderTiles(zoomTransform(this._container.node()), duration);
}
/**

@@ -125,14 +108,10 @@ @name zoomMath

*/
function zoomMath() {
var factor = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
if (!this._container) return;
var center = this._zoomBehavior.extent().bind(document)()[1].map(function (d) {
return d / 2;
}),
scaleExtent = this._zoomBehavior.scaleExtent(),
t = zoomTransform(this._container.node());
return d / 2;
}),
scaleExtent = this._zoomBehavior.scaleExtent(),
t = zoomTransform(this._container.node());
if (!factor) {

@@ -145,3 +124,2 @@ t.k = scaleExtent[0];

t.k = Math.min(scaleExtent[1], t.k * factor);
if (t.k <= scaleExtent[0]) {

@@ -156,5 +134,5 @@ t.k = scaleExtent[0];

}
zoomed.bind(this)(t, this._duration);
}
/**

@@ -167,20 +145,14 @@ @name zoomToBounds

*/
function zoomToBounds(bounds) {
var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this._duration;
var scaleExtent = this._zoomBehavior.scaleExtent(),
t = zoomTransform(this._container.node());
t = zoomTransform(this._container.node());
if (bounds) {
var _this$_zoomBehavior$t = _slicedToArray(this._zoomBehavior.translateExtent()[1], 2),
width = _this$_zoomBehavior$t[0],
height = _this$_zoomBehavior$t[1],
dx = bounds[1][0] - bounds[0][0],
dy = bounds[1][1] - bounds[0][1];
width = _this$_zoomBehavior$t[0],
height = _this$_zoomBehavior$t[1],
dx = bounds[1][0] - bounds[0][0],
dy = bounds[1][1] - bounds[0][1];
var k = Math.min(scaleExtent[1], 1 / Math.max(dx / width, dy / height));
var xMod, yMod;
if (dx / dy < width / height) {

@@ -195,3 +167,2 @@ k *= (height - this._zoomPadding * 2) / height;

}
t.x = (t.x - bounds[0][0] + xMod) * (t.k * k / t.k);

@@ -207,5 +178,5 @@ t.y = (t.y - bounds[0][1] + yMod) * (t.k * k / t.k);

}
zoomed.bind(this)(t, duration);
}
/**

@@ -215,7 +186,6 @@ @desc Triggered on brush "brush".

*/
function brushBrush() {
brushStyle.bind(this)();
}
/**

@@ -225,4 +195,2 @@ @desc Triggered on brush "end".

*/
function brushEnd(event) {

@@ -232,5 +200,5 @@ if (!event.selection) return; // Only transition after input.

this._brushGroup.call(this._zoomBrush.move, null);
zoomToBounds.bind(this)(event.selection);
}
/**

@@ -240,7 +208,6 @@ @desc Triggered on brush "start".

*/
function brushStart() {
brushStyle.bind(this)();
}
/**

@@ -250,8 +217,5 @@ @desc Overrides the default brush styles.

*/
function brushStyle() {
this._brushGroup.selectAll(".selection").call(attrize, this._zoomBrushSelectionStyle || {});
this._brushGroup.selectAll(".handle").call(attrize, this._zoomBrushHandleStyle || {});
}

5

es/src/data/addToQueue.js
import isData from "./isData.js";
import load from "./load.js";
/**

@@ -10,8 +11,5 @@ @function isData

*/
export default function (_, f, key) {
if (!(_ instanceof Array)) _ = [_];
var needToLoad = _.find(isData);
if (needToLoad) {

@@ -21,3 +19,2 @@ var prev = this._queue.find(function (q) {

});
var d = [load.bind(this), _, f, key];

@@ -24,0 +21,0 @@ if (prev) this._queue[this._queue.indexOf(prev)] = d;else this._queue.push(d);

2

es/src/data/concat.js

@@ -11,3 +11,2 @@ /**

var dataArray = [];
if (Array.isArray(item)) {

@@ -22,5 +21,4 @@ dataArray = item;

}
return acc.concat(dataArray);
}, []);
});

1

es/src/data/isData.js
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
/**

@@ -4,0 +3,0 @@ @function isData

52

es/src/data/load.js
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
import { csv, json, text, tsv } from "d3-request";
import fold from "./fold";
import concat from "./concat";
import fold from "./fold.js";
import concat from "./concat.js";
import isData from "./isData.js";
import { isObject } from "d3plus-common";
/**

@@ -16,21 +16,14 @@ @function dataLoad

*/
export default function (path, formatter, key, callback) {
var _this = this;
var parser;
var getParser = function getParser(path) {
var ext = path.slice(path.length - 4);
switch (ext) {
case ".csv":
return csv;
case ".tsv":
return tsv;
case ".txt":
return text;
default:

@@ -40,3 +33,2 @@ return json;

};
var validateData = function validateData(err, parser, data) {

@@ -50,6 +42,4 @@ if (parser !== json && !err && data && data instanceof Array) {

}
return data;
};
var loadedLength = function loadedLength(loadedArray) {

@@ -60,13 +50,13 @@ return loadedArray.reduce(function (prev, current) {

};
var getPathIndex = function getPathIndex(url, array) {
return array.indexOf(url);
}; // If path param is a not an Array then convert path to a 1 element Array to re-use logic
};
// If path param is a not an Array then convert path to a 1 element Array to re-use logic
if (!(path instanceof Array)) path = [path];
var needToLoad = path.find(isData);
var loaded = new Array(path.length);
var toLoad = []; // If there is a string I'm assuming is a Array to merge, urls or data
var toLoad = [];
// If there is a string I'm assuming is a Array to merge, urls or data
if (needToLoad) {

@@ -76,13 +66,13 @@ path.forEach(function (dataItem, ix) {

});
} // Data array itself
}
// Data array itself
else {
loaded[0] = path;
} // Load all urls an combine them with data arrays
}
// Load all urls an combine them with data arrays
var alreadyLoaded = loadedLength(loaded);
toLoad.forEach(function (dataItem) {
var headers = {},
url = dataItem;
url = dataItem;
if (_typeof(dataItem) === "object") {

@@ -92,6 +82,4 @@ url = dataItem.url;

}
parser = getParser(url);
var request = parser(url);
for (var _key in headers) {

@@ -102,3 +90,2 @@ if ({}.hasOwnProperty.call(headers, _key)) {

}
request.get(function (err, data) {

@@ -109,16 +96,13 @@ data = err ? [] : data;

loaded[getPathIndex(url, path)] = data;
if (loadedLength(loaded) - alreadyLoaded === toLoad.length) {
// All urls loaded
// Format data
data = loadedLength(loaded) === 1 ? loaded[0] : loaded;
if (_this._cache) _this._lrucache.set("".concat(key, "_").concat(url), data);
if (formatter) {
var formatterResponse = formatter(loadedLength(loaded) === 1 ? loaded[0] : loaded);
if (key === "data" && isObject(formatterResponse)) {
data = formatterResponse.data || [];
delete formatterResponse.data;
_this.config(formatterResponse);

@@ -129,3 +113,2 @@ } else data = formatterResponse || [];

}
if (key && "_".concat(key) in _this) _this["_".concat(key)] = data;

@@ -135,4 +118,5 @@ if (callback) callback(err, data);

});
}); // If there is no data to Load response is immediately
});
// If there is no data to Load response is immediately
if (toLoad.length === 0) {

@@ -142,9 +126,8 @@ loaded = loaded.map(function (data) {

return data;
}); // Format data
});
// Format data
var data = loadedLength(loaded) === 1 ? loaded[0] : loaded;
if (formatter) {
var formatterResponse = formatter(loadedLength(loaded) === 1 ? loaded[0] : loaded);
if (key === "data" && isObject(formatterResponse)) {

@@ -158,3 +141,2 @@ data = formatterResponse.data || [];

}
if (key && "_".concat(key) in this) this["_".concat(key)] = data;

@@ -161,0 +143,0 @@ if (callback) callback(null, data);

50

es/src/Message.js

@@ -0,9 +1,10 @@

function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
import { select } from "d3-selection";
import { stylize } from "d3plus-common";
/**

@@ -14,3 +15,2 @@ @class Message

*/
var Message = /*#__PURE__*/function () {

@@ -24,5 +24,5 @@ /**

_classCallCheck(this, Message);
this._isVisible = false;
}
/**

@@ -33,4 +33,2 @@ @memberof Message

*/
_createClass(Message, [{

@@ -42,2 +40,3 @@ key: "exit",

}
/**

@@ -48,3 +47,2 @@ @memberof Message

*/
}, {

@@ -54,6 +52,5 @@ key: "hide",

var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref$duration = _ref.duration,
duration = _ref$duration === void 0 ? 600 : _ref$duration,
callback = _ref.callback;
_ref$duration = _ref.duration,
duration = _ref$duration === void 0 ? 600 : _ref$duration,
callback = _ref.callback;
this.mask.call(this.exit.bind(this), duration);

@@ -65,2 +62,3 @@ this.elem.call(this.exit.bind(this), duration);

}
/**

@@ -72,3 +70,2 @@ @memberof Message

*/
}, {

@@ -78,14 +75,13 @@ key: "render",

var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
callback = _ref2.callback,
_ref2$container = _ref2.container,
container = _ref2$container === void 0 ? "body" : _ref2$container,
_ref2$duration = _ref2.duration,
duration = _ref2$duration === void 0 ? 600 : _ref2$duration,
_ref2$html = _ref2.html,
html = _ref2$html === void 0 ? "Please Wait" : _ref2$html,
_ref2$mask = _ref2.mask,
mask = _ref2$mask === void 0 ? "rgba(0, 0, 0, 0.05)" : _ref2$mask,
_ref2$style = _ref2.style,
style = _ref2$style === void 0 ? {} : _ref2$style;
callback = _ref2.callback,
_ref2$container = _ref2.container,
container = _ref2$container === void 0 ? "body" : _ref2$container,
_ref2$duration = _ref2.duration,
duration = _ref2$duration === void 0 ? 600 : _ref2$duration,
_ref2$html = _ref2.html,
html = _ref2$html === void 0 ? "Please Wait" : _ref2$html,
_ref2$mask = _ref2.mask,
mask = _ref2$mask === void 0 ? "rgba(0, 0, 0, 0.05)" : _ref2$mask,
_ref2$style = _ref2.style,
style = _ref2$style === void 0 ? {} : _ref2$style;
var parent = select(container);

@@ -111,6 +107,4 @@ this.mask = parent.selectAll("div.d3plus-Mask").data(mask ? [mask] : []);

}]);
return Message;
}();
export { Message as default };

14

es/src/on/click.legend.js
import { merge } from "d3-array";
/**

@@ -8,27 +9,16 @@ @desc On click event for all legend shapes in a Viz.

*/
export default function (d, i, x, event) {
var _this = this;
this._select.style("cursor", "auto");
if (this._tooltip(d, i)) this._tooltipClass.data([]).render();
var id = this._id(d, i);
if (!(id instanceof Array)) id = [id];
var hiddenIndex = this._hidden.indexOf(id[0]);
var soloIndex = this._solo.indexOf(id[0]);
var dataLength = merge(this._legendClass.data().map(function (d, i) {
var id = _this._id(d, i);
if (!(id instanceof Array)) id = [id];
return id;
})).length;
var inverted = this._legendFilterInvert.bind(this)();
if (inverted) {

@@ -54,3 +44,2 @@ if (event.shiftKey) {

}
this.render();

@@ -76,3 +65,2 @@ }

}
this.render();

@@ -79,0 +67,0 @@ }

6

es/src/on/click.shape.js

@@ -9,12 +9,9 @@ /**

event.stopPropagation();
if (this._drawDepth < this._groupBy.length - 1) {
this._select.style("cursor", "auto");
var filterGroup = this._groupBy[this._drawDepth],
filterId = filterGroup(d, i);
filterId = filterGroup(d, i);
this.hover(false);
if (this._tooltip(d, i)) this._tooltipClass.data([]).render();
var oldFilter = this._filter;
this._history.push({

@@ -24,3 +21,2 @@ depth: this._depth,

});
this.config({

@@ -27,0 +23,0 @@ depth: this._drawDepth + 1,

5

es/src/on/mouseenter.js

@@ -22,6 +22,6 @@ var flattenIds = function flattenIds(levels) {

}
return arr;
}, []);
};
/**

@@ -33,7 +33,4 @@ @desc On mouseenter event for all shapes in a Viz.

*/
export default function (d, i) {
var _this = this;
if (this._shapeConfig.hoverOpacity !== 1) {

@@ -40,0 +37,0 @@ var filterIds = flattenIds(this._ids(d, i));

10

es/src/on/mouseleave.js

@@ -9,3 +9,2 @@ /**

var _this = this;
setTimeout(function () {

@@ -15,17 +14,10 @@ if (_this._shapeConfig.hoverOpacity !== 1 && _this._hover ? _this._hover(d, i) : true) {

}
var tooltipData = _this._tooltipClass.data();
if (tooltipData.length && _this._tooltip(d, i)) {
var tooltipDatum = tooltipData[0];
while (tooltipDatum.__d3plus__ && tooltipDatum.data) {
tooltipDatum = tooltipDatum.data;
}
while (tooltipDatum.__d3plus__ && tooltipDatum.data) tooltipDatum = tooltipDatum.data;
if (_this._id(tooltipDatum) === _this._id(d)) _this._tooltipClass.data([]).render();
}
}, 50);
this._select.style("cursor", "auto");
}

35

es/src/on/mousemove.legend.js
import { merge } from "d3-array";
import { configPrep } from "d3plus-common";
import clickLegend from "./click.legend";
import { legendLabel } from "../_drawLegend";
import clickLegend from "./click.legend.js";
import { legendLabel } from "../_drawLegend.js";
/**

@@ -12,40 +13,40 @@ @desc Tooltip logic for a specified data point.

*/
export default function (d, i, x, event) {
var _this = this;
var position = event.touches ? [event.touches[0].clientX, event.touches[0].clientY] : [event.clientX, event.clientY];
var dataLength = merge(this._legendClass.data().map(function (d, i) {
var id = _this._id(d, i);
if (!(id instanceof Array)) id = [id];
return id;
})).length;
if (d && this._tooltip(d, i)) {
var id = this._id(d, i);
if (id instanceof Array) id = id[0];
var t = this._translate;
var defaultClick = clickLegend.bind(this).toString(); // does the legend have any user-defined click events?
var defaultClick = clickLegend.bind(this).toString();
// does the legend have any user-defined click events?
var hasUserClick = Object.keys(this._on).some(function (e) {
return (// all valid click event keys,
["click", "click.legend"].includes(e) && // truthy values (no nulls),
_this._on[e] && // and it is not our default click.legend function
return (
// all valid click event keys,
["click", "click.legend"].includes(e) &&
// truthy values (no nulls),
_this._on[e] &&
// and it is not our default click.legend function
_this._on[e].toString() !== defaultClick
);
}); // does the legend still have our default "click.legend" event?
});
// does the legend still have our default "click.legend" event?
// (if the user only sets "click", both functions will fire)
var hasDefaultClick = this._on["click.legend"] && this._on["click.legend"].toString() === defaultClick;
var hasDefaultClick = this._on["click.legend"] && this._on["click.legend"].toString() === defaultClick; // can the viz show deeper data?
// can the viz show deeper data?
var hasDeeperLevel = this._drawDepth < this._groupBy.length - 1;
var hasDeeperLevel = this._drawDepth < this._groupBy.length - 1; // only show the hand cursor when the shape has a click event
// only show the hand cursor when the shape has a click event
this._select.style("cursor", hasUserClick || hasDefaultClick && hasDeeperLevel ? "pointer" : "auto");
var invertedBehavior = this._legendFilterInvert.bind(this)();
this._tooltipClass.data([x || d]).footer(hasDefaultClick ? invertedBehavior ? this._solo.length && !this._solo.includes(id) || this._hidden.includes(id) ? t("Click to Highlight") : this._solo.length === 1 && this._solo.includes(id) || this._hidden.length === dataLength - 1 ? t("Click to Show All") : "".concat(t("Click to Highlight"), "<br />").concat(t("Shift+Click to Hide")) : this._solo.length && !this._solo.includes(id) || this._hidden.includes(id) ? "".concat(t("Click to Show"), "<br />").concat(t("Shift+Click to Highlight")) : this._solo.length === 1 && this._solo.includes(id) || this._hidden.length === dataLength - 1 ? t("Click to Show All") : "".concat(t("Click to Hide"), "<br />").concat(t("Shift+Click to Highlight")) : false).title(this._legendConfig.label ? this._legendClass.label() : legendLabel.bind(this)).position(position).config(configPrep.bind(this)(this._tooltipConfig)).config(configPrep.bind(this)(this._legendTooltip)).render();
}
}

30

es/src/on/mousemove.shape.js
import { configPrep } from "d3plus-common";
import clickShape from "./click.shape";
import clickShape from "./click.shape.js";
/**

@@ -10,28 +11,31 @@ @desc Tooltip logic for a specified data point.

*/
export default function (d, i, x, event) {
var _this = this;
if (d && this._tooltip(d, i)) {
var defaultClick = clickShape.bind(this).toString(); // does the shape have any user-defined click events?
var defaultClick = clickShape.bind(this).toString();
// does the shape have any user-defined click events?
var hasUserClick = Object.keys(this._on).some(function (e) {
return (// all valid click event keys,
["click", "click.shape"].includes(e) && // truthy values (no nulls),
_this._on[e] && // and it is not our default click.shape function
return (
// all valid click event keys,
["click", "click.shape"].includes(e) &&
// truthy values (no nulls),
_this._on[e] &&
// and it is not our default click.shape function
_this._on[e].toString() !== defaultClick
);
}); // does the shape still have our default "click.shape" event?
});
// does the shape still have our default "click.shape" event?
// (if the user only sets "click", both functions will fire)
var hasDefaultClick = this._on["click.shape"] && this._on["click.shape"].toString() === defaultClick;
var hasDefaultClick = this._on["click.shape"] && this._on["click.shape"].toString() === defaultClick; // can the viz show deeper data?
// can the viz show deeper data?
var hasDeeperLevel = this._drawDepth < this._groupBy.length - 1;
var hasDeeperLevel = this._drawDepth < this._groupBy.length - 1; // only show the hand cursor when the shape has a click event
// only show the hand cursor when the shape has a click event
this._select.style("cursor", hasUserClick || hasDefaultClick && hasDeeperLevel ? "pointer" : "auto");
var position = event.touches ? [event.touches[0].clientX, event.touches[0].clientY] : [event.clientX, event.clientY];
this._tooltipClass.data([x || d]).footer(hasDefaultClick && hasDeeperLevel ? this._translate("Click to Expand") : false).title(this._drawLabel).position(position).config(configPrep.bind(this)(this._tooltipConfig)).render();
}
}

43

package.json
{
"name": "d3plus-viz",
"version": "1.2.5",
"version": "1.3.0",
"description": "Abstract ES6 class that drives d3plus visualizations.",
"main": "build/d3plus-viz.full.js",
"main": "es/index.js",
"jsnext:main": "es/index",

@@ -26,17 +26,17 @@ "license": "MIT",

"dependencies": {
"d3-array": "^2.12.1",
"d3-brush": "^2.1.0",
"d3-color": "^2.0.0",
"d3-array": "^3.2.2",
"d3-brush": "^3.0.0",
"d3-color": "^3.1.0",
"d3-queue": "^3.0.7",
"d3-request": "^1.0.6",
"d3-selection": "^2.0.0",
"d3-zoom": "^2.0.0",
"d3plus-axis": "^1.1.3",
"d3plus-color": "^1.0.0",
"d3plus-common": "^1.1.2",
"d3plus-format": "^1.1.1",
"d3plus-legend": "^1.1.1",
"d3plus-text": "^1.0.3",
"d3plus-timeline": "^1.0.2",
"d3plus-tooltip": "^1.0.1",
"d3-selection": "^3.0.0",
"d3-zoom": "^3.0.0",
"d3plus-axis": "^1.2.1",
"d3plus-color": "^1.1.2",
"d3plus-common": "^1.2.4",
"d3plus-format": "^1.2.2",
"d3plus-legend": "^1.2.0",
"d3plus-text": "^1.2.1",
"d3plus-timeline": "^1.1.0",
"d3plus-tooltip": "^1.1.0",
"lrucache": "^1.0.3"

@@ -50,9 +50,9 @@ },

"release": "d3plus-release",
"test": "d3plus-test"
"test": "eslint src test && mocha 'test/**/*-test.js'"
},
"devDependencies": {
"d3plus-dev": "^1.1.0",
"d3plus-shape": "^1.0.7"
"d3plus-dev": "^1.2.9",
"d3plus-shape": "^1.1.0"
},
"module": "es/index",
"module": "es/index.js",
"sideEffects": false,

@@ -65,3 +65,6 @@ "files": [

"es"
]
],
"jsdelivr": "build/d3plus-viz.full.min.js",
"unpkg": "build/d3plus-viz.full.min.js",
"type": "module"
}

16

README.md
# d3plus-viz
[![NPM Release](http://img.shields.io/npm/v/d3plus-viz.svg?style=flat)](https://www.npmjs.org/package/d3plus-viz) [![Build Status](https://travis-ci.org/d3plus/d3plus-viz.svg?branch=master)](https://travis-ci.org/d3plus/d3plus-viz) [![Dependency Status](http://img.shields.io/david/d3plus/d3plus-viz.svg?style=flat)](https://david-dm.org/d3plus/d3plus-viz) [![Gitter](https://img.shields.io/badge/-chat_on_gitter-brightgreen.svg?style=flat&logo=gitter-white)](https://gitter.im/d3plus/)
Abstract ES6 class that drives d3plus visualizations.

@@ -9,4 +7,10 @@

If you use NPM, `npm install d3plus-viz`. Otherwise, download the [latest release](https://github.com/d3plus/d3plus-viz/releases/latest). You can also load d3plus-viz as a standalone library or as part of [D3plus](https://github.com/d3plus/d3plus). ES modules, AMD, CommonJS, and vanilla environments are supported. In vanilla, a `d3plus` global is exported:
If using npm, `npm install d3plus-viz`. Otherwise, you can download the [latest release from GitHub](https://github.com/d3plus/d3plus-viz/releases/latest) or load from a [CDN](https://cdn.jsdelivr.net/npm/d3plus-viz@1).
```js
import modules from "d3plus-viz";
```
d3plus-viz can be loaded as a standalone library or bundled as part of [D3plus](https://github.com/d3plus/d3plus). ES modules, AMD, CommonJS, and vanilla environments are supported. In vanilla, a `d3plus` global is exported:
```html

@@ -19,2 +23,6 @@ <script src="https://cdn.jsdelivr.net/npm/d3plus-viz@1"></script>

## Examples
Live examples can be found on [d3plus.org](https://d3plus.org/), which includes a collection of example visualizations using [d3plus-react](https://github.com/d3plus/d3plus-react/). These examples are powered by the [d3plus-storybook](https://github.com/d3plus/d3plus-storybook/) repo, and PRs are always welcome. :beers:
## API Reference

@@ -935,2 +943,2 @@

###### <sub>Documentation generated on Tue, 30 Aug 2022 13:53:44 GMT</sub>
###### <sub>Documentation generated on Wed, 25 Jan 2023 17:09:45 GMT</sub>
build/d3plus-viz.full.js
build/d3plus-viz.js

Sorry, the diff of this file is too big to display

build/d3plus-viz.js.map

Sorry, the diff of this file is not supported yet

build/d3plus-viz.min.js

Sorry, the diff of this file is too big to display

es/src/Viz.js

Sorry, the diff of this file is too big to display

LICENSE

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc