@nivo/voronoi
Advanced tools
Comparing version 0.74.1 to 0.75.0
@@ -1,553 +0,2 @@ | ||
'use strict'; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
var react = require('react'); | ||
var core = require('@nivo/core'); | ||
var d3Scale = require('d3-scale'); | ||
var d3Delaunay = require('d3-delaunay'); | ||
var jsxRuntime = require('react/jsx-runtime'); | ||
function _defineProperty(obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
} | ||
function ownKeys(object, enumerableOnly) { | ||
var keys = Object.keys(object); | ||
if (Object.getOwnPropertySymbols) { | ||
var symbols = Object.getOwnPropertySymbols(object); | ||
if (enumerableOnly) symbols = symbols.filter(function (sym) { | ||
return Object.getOwnPropertyDescriptor(object, sym).enumerable; | ||
}); | ||
keys.push.apply(keys, symbols); | ||
} | ||
return keys; | ||
} | ||
function _objectSpread2(target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i] != null ? arguments[i] : {}; | ||
if (i % 2) { | ||
ownKeys(Object(source), true).forEach(function (key) { | ||
_defineProperty(target, key, source[key]); | ||
}); | ||
} else if (Object.getOwnPropertyDescriptors) { | ||
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); | ||
} else { | ||
ownKeys(Object(source)).forEach(function (key) { | ||
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); | ||
}); | ||
} | ||
} | ||
return target; | ||
} | ||
function _objectWithoutPropertiesLoose(source, excluded) { | ||
if (source == null) return {}; | ||
var target = {}; | ||
var sourceKeys = Object.keys(source); | ||
var key, i; | ||
for (i = 0; i < sourceKeys.length; i++) { | ||
key = sourceKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
target[key] = source[key]; | ||
} | ||
return target; | ||
} | ||
function _objectWithoutProperties(source, excluded) { | ||
if (source == null) return {}; | ||
var target = _objectWithoutPropertiesLoose(source, excluded); | ||
var key, i; | ||
if (Object.getOwnPropertySymbols) { | ||
var sourceSymbolKeys = Object.getOwnPropertySymbols(source); | ||
for (i = 0; i < sourceSymbolKeys.length; i++) { | ||
key = sourceSymbolKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; | ||
target[key] = source[key]; | ||
} | ||
} | ||
return target; | ||
} | ||
var defaultVoronoiProps = { | ||
xDomain: [0, 1], | ||
yDomain: [0, 1], | ||
layers: ['links', 'cells', 'points', 'bounds'], | ||
enableLinks: false, | ||
linkLineWidth: 1, | ||
linkLineColor: '#bbbbbb', | ||
enableCells: true, | ||
cellLineWidth: 2, | ||
cellLineColor: '#000000', | ||
enablePoints: true, | ||
pointSize: 4, | ||
pointColor: '#666666', | ||
role: 'img' | ||
}; | ||
var getAccessor = function getAccessor(directive) { | ||
return typeof directive === 'function' ? directive : function (datum) { | ||
return datum[directive]; | ||
}; | ||
}; | ||
var computeMeshPoints = function computeMeshPoints(_ref) { | ||
var points = _ref.points, | ||
_ref$x = _ref.x, | ||
x = _ref$x === void 0 ? 'x' : _ref$x, | ||
_ref$y = _ref.y, | ||
y = _ref$y === void 0 ? 'y' : _ref$y; | ||
var getX = getAccessor(x); | ||
var getY = getAccessor(y); | ||
return points.map(function (point) { | ||
return [getX(point), getY(point)]; | ||
}); | ||
}; | ||
var computeMesh = function computeMesh(_ref2) { | ||
var points = _ref2.points, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
debug = _ref2.debug; | ||
var delaunay = d3Delaunay.Delaunay.from(points); | ||
var voronoi = debug ? delaunay.voronoi([0, 0, width, height]) : undefined; | ||
return { | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}; | ||
var useVoronoiMesh = function useVoronoiMesh(_ref) { | ||
var points = _ref.points, | ||
x = _ref.x, | ||
y = _ref.y, | ||
width = _ref.width, | ||
height = _ref.height, | ||
debug = _ref.debug; | ||
var points2d = react.useMemo(function () { | ||
return computeMeshPoints({ | ||
points: points, | ||
x: x, | ||
y: y | ||
}); | ||
}, [points, x, y]); | ||
return react.useMemo(function () { | ||
return computeMesh({ | ||
points: points2d, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}); | ||
}, [points2d, width, height, debug]); | ||
}; | ||
var useVoronoi = function useVoronoi(_ref2) { | ||
var data = _ref2.data, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
xDomain = _ref2.xDomain, | ||
yDomain = _ref2.yDomain; | ||
var xScale = react.useMemo(function () { | ||
return d3Scale.scaleLinear().domain(xDomain).range([0, width]); | ||
}, [xDomain, width]); | ||
var yScale = react.useMemo(function () { | ||
return d3Scale.scaleLinear().domain(yDomain).range([0, height]); | ||
}, [yDomain, height]); | ||
var points = react.useMemo(function () { | ||
return data.map(function (d) { | ||
return { | ||
x: xScale(d.x), | ||
y: yScale(d.y), | ||
data: d | ||
}; | ||
}); | ||
}, [data, xScale, yScale]); | ||
return react.useMemo(function () { | ||
var delaunay = d3Delaunay.Delaunay.from(points.map(function (p) { | ||
return [p.x, p.y]; | ||
})); | ||
var voronoi = delaunay.voronoi([0, 0, width, height]); | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, width, height]); | ||
}; | ||
var useVoronoiLayerContext = function useVoronoiLayerContext(_ref3) { | ||
var points = _ref3.points, | ||
delaunay = _ref3.delaunay, | ||
voronoi = _ref3.voronoi; | ||
return react.useMemo(function () { | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, delaunay, voronoi]); | ||
}; | ||
var InnerVoronoi = function InnerVoronoi(_ref) { | ||
var data = _ref.data, | ||
width = _ref.width, | ||
height = _ref.height, | ||
partialMargin = _ref.margin, | ||
_ref$layers = _ref.layers, | ||
layers = _ref$layers === void 0 ? defaultVoronoiProps.layers : _ref$layers, | ||
_ref$xDomain = _ref.xDomain, | ||
xDomain = _ref$xDomain === void 0 ? defaultVoronoiProps.xDomain : _ref$xDomain, | ||
_ref$yDomain = _ref.yDomain, | ||
yDomain = _ref$yDomain === void 0 ? defaultVoronoiProps.yDomain : _ref$yDomain, | ||
_ref$enableLinks = _ref.enableLinks, | ||
enableLinks = _ref$enableLinks === void 0 ? defaultVoronoiProps.enableLinks : _ref$enableLinks, | ||
_ref$linkLineWidth = _ref.linkLineWidth, | ||
linkLineWidth = _ref$linkLineWidth === void 0 ? defaultVoronoiProps.linkLineWidth : _ref$linkLineWidth, | ||
_ref$linkLineColor = _ref.linkLineColor, | ||
linkLineColor = _ref$linkLineColor === void 0 ? defaultVoronoiProps.linkLineColor : _ref$linkLineColor, | ||
_ref$enableCells = _ref.enableCells, | ||
enableCells = _ref$enableCells === void 0 ? defaultVoronoiProps.enableCells : _ref$enableCells, | ||
_ref$cellLineWidth = _ref.cellLineWidth, | ||
cellLineWidth = _ref$cellLineWidth === void 0 ? defaultVoronoiProps.cellLineWidth : _ref$cellLineWidth, | ||
_ref$cellLineColor = _ref.cellLineColor, | ||
cellLineColor = _ref$cellLineColor === void 0 ? defaultVoronoiProps.cellLineColor : _ref$cellLineColor, | ||
_ref$enablePoints = _ref.enablePoints, | ||
enablePoints = _ref$enablePoints === void 0 ? defaultVoronoiProps.enableCells : _ref$enablePoints, | ||
_ref$pointSize = _ref.pointSize, | ||
pointSize = _ref$pointSize === void 0 ? defaultVoronoiProps.pointSize : _ref$pointSize, | ||
_ref$pointColor = _ref.pointColor, | ||
pointColor = _ref$pointColor === void 0 ? defaultVoronoiProps.pointColor : _ref$pointColor, | ||
_ref$role = _ref.role, | ||
role = _ref$role === void 0 ? defaultVoronoiProps.role : _ref$role; | ||
var _useDimensions = core.useDimensions(width, height, partialMargin), | ||
outerWidth = _useDimensions.outerWidth, | ||
outerHeight = _useDimensions.outerHeight, | ||
margin = _useDimensions.margin, | ||
innerWidth = _useDimensions.innerWidth, | ||
innerHeight = _useDimensions.innerHeight; | ||
var _useVoronoi = useVoronoi({ | ||
data: data, | ||
width: innerWidth, | ||
height: innerHeight, | ||
xDomain: xDomain, | ||
yDomain: yDomain | ||
}), | ||
points = _useVoronoi.points, | ||
delaunay = _useVoronoi.delaunay, | ||
voronoi = _useVoronoi.voronoi; | ||
var layerById = { | ||
links: null, | ||
cells: null, | ||
points: null, | ||
bounds: null | ||
}; | ||
if (enableLinks && layers.includes('links')) { | ||
layerById.links = jsxRuntime.jsx("path", { | ||
stroke: linkLineColor, | ||
strokeWidth: linkLineWidth, | ||
fill: "none", | ||
d: delaunay.render() | ||
}, "links"); | ||
} | ||
if (enableCells && layers.includes('cells')) { | ||
layerById.cells = jsxRuntime.jsx("path", { | ||
d: voronoi.render(), | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth | ||
}, "cells"); | ||
} | ||
if (enablePoints && layers.includes('points')) { | ||
layerById.points = jsxRuntime.jsx("path", { | ||
stroke: "none", | ||
fill: pointColor, | ||
d: delaunay.renderPoints(undefined, pointSize / 2) | ||
}, "points"); | ||
} | ||
if (layers.includes('bounds')) { | ||
layerById.bounds = jsxRuntime.jsx("path", { | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth, | ||
d: voronoi.renderBounds() | ||
}, "bounds"); | ||
} | ||
var layerContext = useVoronoiLayerContext({ | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}); | ||
return jsxRuntime.jsx(core.SvgWrapper, { | ||
width: outerWidth, | ||
height: outerHeight, | ||
margin: margin, | ||
role: role, | ||
children: layers.map(function (layer, i) { | ||
if (layerById[layer] !== undefined) { | ||
return layerById[layer]; | ||
} | ||
if (typeof layer === 'function') { | ||
return jsxRuntime.jsx(react.Fragment, { | ||
children: react.createElement(layer, layerContext) | ||
}, i); | ||
} | ||
return null; | ||
}) | ||
}); | ||
}; | ||
var Voronoi = function Voronoi(_ref2) { | ||
var theme = _ref2.theme, | ||
otherProps = _objectWithoutProperties(_ref2, ["theme"]); | ||
return jsxRuntime.jsx(core.Container, { | ||
isInteractive: false, | ||
animate: false, | ||
theme: theme, | ||
children: jsxRuntime.jsx(InnerVoronoi, _objectSpread2({}, otherProps)) | ||
}); | ||
}; | ||
var ResponsiveVoronoi = function ResponsiveVoronoi(props) { | ||
return jsxRuntime.jsx(core.ResponsiveWrapper, { | ||
children: function children(_ref) { | ||
var width = _ref.width, | ||
height = _ref.height; | ||
return jsxRuntime.jsx(Voronoi, _objectSpread2({ | ||
width: width, | ||
height: height | ||
}, props)); | ||
} | ||
}); | ||
}; | ||
function _arrayWithHoles(arr) { | ||
if (Array.isArray(arr)) return arr; | ||
} | ||
function _iterableToArrayLimit(arr, i) { | ||
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; | ||
var _arr = []; | ||
var _n = true; | ||
var _d = false; | ||
var _e = undefined; | ||
try { | ||
for (var _i = arr[Symbol.iterator](), _s; !(_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 _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 _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 _slicedToArray(arr, i) { | ||
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); | ||
} | ||
var Mesh = function Mesh(_ref) { | ||
var nodes = _ref.nodes, | ||
width = _ref.width, | ||
height = _ref.height, | ||
x = _ref.x, | ||
y = _ref.y, | ||
onMouseEnter = _ref.onMouseEnter, | ||
onMouseMove = _ref.onMouseMove, | ||
onMouseLeave = _ref.onMouseLeave, | ||
onClick = _ref.onClick, | ||
debug = _ref.debug; | ||
var elementRef = react.useRef(null); | ||
var _useState = react.useState(null), | ||
_useState2 = _slicedToArray(_useState, 2), | ||
currentIndex = _useState2[0], | ||
setCurrentIndex = _useState2[1]; | ||
var _useVoronoiMesh = useVoronoiMesh({ | ||
points: nodes, | ||
x: x, | ||
y: y, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}), | ||
delaunay = _useVoronoiMesh.delaunay, | ||
voronoi = _useVoronoiMesh.voronoi; | ||
var voronoiPath = react.useMemo(function () { | ||
if (debug && voronoi) { | ||
return voronoi.render(); | ||
} | ||
return undefined; | ||
}, [debug, voronoi]); | ||
var getIndexAndNodeFromEvent = react.useCallback(function (event) { | ||
if (!elementRef.current) { | ||
return [null, null]; | ||
} | ||
var _getRelativeCursor = core.getRelativeCursor(elementRef.current, event), | ||
_getRelativeCursor2 = _slicedToArray(_getRelativeCursor, 2), | ||
x = _getRelativeCursor2[0], | ||
y = _getRelativeCursor2[1]; | ||
var index = delaunay.find(x, y); | ||
return [index, index !== undefined ? nodes[index] : null]; | ||
}, [elementRef, delaunay]); | ||
var handleMouseEnter = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE2 = _slicedToArray(_getIndexAndNodeFromE, 2), | ||
index = _getIndexAndNodeFromE2[0], | ||
node = _getIndexAndNodeFromE2[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseEnter]); | ||
var handleMouseMove = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE3 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE4 = _slicedToArray(_getIndexAndNodeFromE3, 2), | ||
index = _getIndexAndNodeFromE4[0], | ||
node = _getIndexAndNodeFromE4[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseMove]); | ||
var handleMouseLeave = react.useCallback(function (event) { | ||
setCurrentIndex(null); | ||
if (onMouseLeave) { | ||
var previousNode = undefined; | ||
if (currentIndex !== null) { | ||
previousNode = nodes[currentIndex]; | ||
} | ||
previousNode && onMouseLeave(previousNode, event); | ||
} | ||
}, [setCurrentIndex, currentIndex, onMouseLeave, nodes]); | ||
var handleClick = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE5 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE6 = _slicedToArray(_getIndexAndNodeFromE5, 2), | ||
index = _getIndexAndNodeFromE6[0], | ||
node = _getIndexAndNodeFromE6[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onClick === null || onClick === void 0 ? void 0 : onClick(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onClick]); | ||
return jsxRuntime.jsxs("g", { | ||
ref: elementRef, | ||
children: [debug && voronoi && jsxRuntime.jsxs(jsxRuntime.Fragment, { | ||
children: [jsxRuntime.jsx("path", { | ||
d: voronoiPath, | ||
stroke: "red", | ||
strokeWidth: 1, | ||
opacity: 0.75 | ||
}), currentIndex !== null && jsxRuntime.jsx("path", { | ||
fill: "pink", | ||
opacity: 0.35, | ||
d: voronoi.renderCell(currentIndex) | ||
})] | ||
}), jsxRuntime.jsx("rect", { | ||
width: width, | ||
height: height, | ||
fill: "red", | ||
opacity: 0, | ||
style: { | ||
cursor: 'auto' | ||
}, | ||
onMouseEnter: handleMouseEnter, | ||
onMouseMove: handleMouseMove, | ||
onMouseLeave: handleMouseLeave, | ||
onClick: handleClick | ||
})] | ||
}); | ||
}; | ||
var renderVoronoiToCanvas = function renderVoronoiToCanvas(ctx, voronoi) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.75; | ||
ctx.beginPath(); | ||
voronoi.render(ctx); | ||
ctx.strokeStyle = 'red'; | ||
ctx.lineWidth = 1; | ||
ctx.stroke(); | ||
ctx.restore(); | ||
}; | ||
var renderVoronoiCellToCanvas = function renderVoronoiCellToCanvas(ctx, voronoi, index) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.35; | ||
ctx.beginPath(); | ||
voronoi.renderCell(index, ctx); | ||
ctx.fillStyle = 'red'; | ||
ctx.fill(); | ||
ctx.restore(); | ||
}; | ||
exports.Mesh = Mesh; | ||
exports.ResponsiveVoronoi = ResponsiveVoronoi; | ||
exports.Voronoi = Voronoi; | ||
exports.computeMesh = computeMesh; | ||
exports.computeMeshPoints = computeMeshPoints; | ||
exports.defaultVoronoiProps = defaultVoronoiProps; | ||
exports.renderVoronoiCellToCanvas = renderVoronoiCellToCanvas; | ||
exports.renderVoronoiToCanvas = renderVoronoiToCanvas; | ||
exports.useVoronoi = useVoronoi; | ||
exports.useVoronoiLayerContext = useVoronoiLayerContext; | ||
exports.useVoronoiMesh = useVoronoiMesh; | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("@nivo/core"),o=require("d3-scale"),i=require("d3-delaunay"),r=require("react/jsx-runtime");function t(){return t=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var o=arguments[n];for(var i in o)Object.prototype.hasOwnProperty.call(o,i)&&(e[i]=o[i])}return e},t.apply(this,arguments)}var l={xDomain:[0,1],yDomain:[0,1],layers:["links","cells","points","bounds"],enableLinks:!1,linkLineWidth:1,linkLineColor:"#bbbbbb",enableCells:!0,cellLineWidth:2,cellLineColor:"#000000",enablePoints:!0,pointSize:4,pointColor:"#666666",role:"img"},u=function(e){return"function"==typeof e?e:function(n){return n[e]}},s=function(e){var n=e.points,o=e.x,i=void 0===o?"x":o,r=e.y,t=void 0===r?"y":r,l=u(i),s=u(t);return n.map((function(e){return[l(e),s(e)]}))},a=function(e){var n=e.points,o=e.width,r=e.height,t=e.debug,l=i.Delaunay.from(n),u=t?l.voronoi([0,0,o,r]):void 0;return{delaunay:l,voronoi:u}},d=function(n){var o=n.points,i=n.x,r=n.y,t=n.width,l=n.height,u=n.debug,d=e.useMemo((function(){return s({points:o,x:i,y:r})}),[o,i,r]);return e.useMemo((function(){return a({points:d,width:t,height:l,debug:u})}),[d,t,l,u])},c=function(n){var r=n.data,t=n.width,l=n.height,u=n.xDomain,s=n.yDomain,a=e.useMemo((function(){return o.scaleLinear().domain(u).range([0,t])}),[u,t]),d=e.useMemo((function(){return o.scaleLinear().domain(s).range([0,l])}),[s,l]),c=e.useMemo((function(){return r.map((function(e){return{x:a(e.x),y:d(e.y),data:e}}))}),[r,a,d]);return e.useMemo((function(){var e=i.Delaunay.from(c.map((function(e){return[e.x,e.y]}))),n=e.voronoi([0,0,t,l]);return{points:c,delaunay:e,voronoi:n}}),[c,t,l])},h=function(n){var o=n.points,i=n.delaunay,r=n.voronoi;return e.useMemo((function(){return{points:o,delaunay:i,voronoi:r}}),[o,i,r])},p=["theme"],v=function(o){var i=o.data,t=o.width,u=o.height,s=o.margin,a=o.layers,d=void 0===a?l.layers:a,p=o.xDomain,v=void 0===p?l.xDomain:p,f=o.yDomain,x=void 0===f?l.yDomain:f,m=o.enableLinks,y=void 0===m?l.enableLinks:m,b=o.linkLineWidth,g=void 0===b?l.linkLineWidth:b,k=o.linkLineColor,C=void 0===k?l.linkLineColor:k,M=o.enableCells,j=void 0===M?l.enableCells:M,L=o.cellLineWidth,W=void 0===L?l.cellLineWidth:L,w=o.cellLineColor,D=void 0===w?l.cellLineColor:w,P=o.enablePoints,V=void 0===P?l.enableCells:P,S=o.pointSize,O=void 0===S?l.pointSize:S,q=o.pointColor,R=void 0===q?l.pointColor:q,z=o.role,E=void 0===z?l.role:z,A=n.useDimensions(t,u,s),F=A.outerWidth,H=A.outerHeight,T=A.margin,_=A.innerWidth,B=A.innerHeight,I=c({data:i,width:_,height:B,xDomain:v,yDomain:x}),G=I.points,J=I.delaunay,K=I.voronoi,N={links:null,cells:null,points:null,bounds:null};y&&d.includes("links")&&(N.links=r.jsx("path",{stroke:C,strokeWidth:g,fill:"none",d:J.render()},"links")),j&&d.includes("cells")&&(N.cells=r.jsx("path",{d:K.render(),fill:"none",stroke:D,strokeWidth:W},"cells")),V&&d.includes("points")&&(N.points=r.jsx("path",{stroke:"none",fill:R,d:J.renderPoints(void 0,O/2)},"points")),d.includes("bounds")&&(N.bounds=r.jsx("path",{fill:"none",stroke:D,strokeWidth:W,d:K.renderBounds()},"bounds"));var Q=h({points:G,delaunay:J,voronoi:K});return r.jsx(n.SvgWrapper,{width:F,height:H,margin:T,role:E,children:d.map((function(n,o){return void 0!==N[n]?N[n]:"function"==typeof n?r.jsx(e.Fragment,{children:e.createElement(n,Q)},o):null}))})},f=function(e){var o=e.theme,i=function(e,n){if(null==e)return{};var o,i,r={},t=Object.keys(e);for(i=0;i<t.length;i++)o=t[i],n.indexOf(o)>=0||(r[o]=e[o]);return r}(e,p);return r.jsx(n.Container,{isInteractive:!1,animate:!1,theme:o,children:r.jsx(v,t({},i))})};exports.Mesh=function(o){var i=o.nodes,t=o.width,l=o.height,u=o.x,s=o.y,a=o.onMouseEnter,c=o.onMouseMove,h=o.onMouseLeave,p=o.onClick,v=o.debug,f=e.useRef(null),x=e.useState(null),m=x[0],y=x[1],b=d({points:i,x:u,y:s,width:t,height:l,debug:v}),g=b.delaunay,k=b.voronoi,C=e.useMemo((function(){if(v&&k)return k.render()}),[v,k]),M=e.useCallback((function(e){if(!f.current)return[null,null];var o=n.getRelativeCursor(f.current,e),r=o[0],t=o[1],l=g.find(r,t);return[l,void 0!==l?i[l]:null]}),[f,g]),j=e.useCallback((function(e){var n=M(e),o=n[0],i=n[1];y(o),i&&(null==a||a(i,e))}),[M,y,a]),L=e.useCallback((function(e){var n=M(e),o=n[0],i=n[1];y(o),i&&(null==c||c(i,e))}),[M,y,c]),W=e.useCallback((function(e){if(y(null),h){var n=void 0;null!==m&&(n=i[m]),n&&h(n,e)}}),[y,m,h,i]),w=e.useCallback((function(e){var n=M(e),o=n[0],i=n[1];y(o),i&&(null==p||p(i,e))}),[M,y,p]);return r.jsxs("g",{ref:f,children:[v&&k&&r.jsxs(r.Fragment,{children:[r.jsx("path",{d:C,stroke:"red",strokeWidth:1,opacity:.75}),null!==m&&r.jsx("path",{fill:"pink",opacity:.35,d:k.renderCell(m)})]}),r.jsx("rect",{width:t,height:l,fill:"red",opacity:0,style:{cursor:"auto"},onMouseEnter:j,onMouseMove:L,onMouseLeave:W,onClick:w})]})},exports.ResponsiveVoronoi=function(e){return r.jsx(n.ResponsiveWrapper,{children:function(n){var o=n.width,i=n.height;return r.jsx(f,t({width:o,height:i},e))}})},exports.Voronoi=f,exports.computeMesh=a,exports.computeMeshPoints=s,exports.defaultVoronoiProps=l,exports.renderVoronoiCellToCanvas=function(e,n,o){e.save(),e.globalAlpha=.35,e.beginPath(),n.renderCell(o,e),e.fillStyle="red",e.fill(),e.restore()},exports.renderVoronoiToCanvas=function(e,n){e.save(),e.globalAlpha=.75,e.beginPath(),n.render(e),e.strokeStyle="red",e.lineWidth=1,e.stroke(),e.restore()},exports.useVoronoi=c,exports.useVoronoiLayerContext=h,exports.useVoronoiMesh=d; | ||
//# sourceMappingURL=nivo-voronoi.cjs.js.map |
@@ -1,539 +0,2 @@ | ||
import { useMemo, Fragment, createElement, useRef, useState, useCallback } from 'react'; | ||
import { Container, useDimensions, SvgWrapper, ResponsiveWrapper, getRelativeCursor } from '@nivo/core'; | ||
import { scaleLinear } from 'd3-scale'; | ||
import { Delaunay } from 'd3-delaunay'; | ||
import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime'; | ||
function _defineProperty(obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
} | ||
function ownKeys(object, enumerableOnly) { | ||
var keys = Object.keys(object); | ||
if (Object.getOwnPropertySymbols) { | ||
var symbols = Object.getOwnPropertySymbols(object); | ||
if (enumerableOnly) symbols = symbols.filter(function (sym) { | ||
return Object.getOwnPropertyDescriptor(object, sym).enumerable; | ||
}); | ||
keys.push.apply(keys, symbols); | ||
} | ||
return keys; | ||
} | ||
function _objectSpread2(target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i] != null ? arguments[i] : {}; | ||
if (i % 2) { | ||
ownKeys(Object(source), true).forEach(function (key) { | ||
_defineProperty(target, key, source[key]); | ||
}); | ||
} else if (Object.getOwnPropertyDescriptors) { | ||
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); | ||
} else { | ||
ownKeys(Object(source)).forEach(function (key) { | ||
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); | ||
}); | ||
} | ||
} | ||
return target; | ||
} | ||
function _objectWithoutPropertiesLoose(source, excluded) { | ||
if (source == null) return {}; | ||
var target = {}; | ||
var sourceKeys = Object.keys(source); | ||
var key, i; | ||
for (i = 0; i < sourceKeys.length; i++) { | ||
key = sourceKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
target[key] = source[key]; | ||
} | ||
return target; | ||
} | ||
function _objectWithoutProperties(source, excluded) { | ||
if (source == null) return {}; | ||
var target = _objectWithoutPropertiesLoose(source, excluded); | ||
var key, i; | ||
if (Object.getOwnPropertySymbols) { | ||
var sourceSymbolKeys = Object.getOwnPropertySymbols(source); | ||
for (i = 0; i < sourceSymbolKeys.length; i++) { | ||
key = sourceSymbolKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; | ||
target[key] = source[key]; | ||
} | ||
} | ||
return target; | ||
} | ||
var defaultVoronoiProps = { | ||
xDomain: [0, 1], | ||
yDomain: [0, 1], | ||
layers: ['links', 'cells', 'points', 'bounds'], | ||
enableLinks: false, | ||
linkLineWidth: 1, | ||
linkLineColor: '#bbbbbb', | ||
enableCells: true, | ||
cellLineWidth: 2, | ||
cellLineColor: '#000000', | ||
enablePoints: true, | ||
pointSize: 4, | ||
pointColor: '#666666', | ||
role: 'img' | ||
}; | ||
var getAccessor = function getAccessor(directive) { | ||
return typeof directive === 'function' ? directive : function (datum) { | ||
return datum[directive]; | ||
}; | ||
}; | ||
var computeMeshPoints = function computeMeshPoints(_ref) { | ||
var points = _ref.points, | ||
_ref$x = _ref.x, | ||
x = _ref$x === void 0 ? 'x' : _ref$x, | ||
_ref$y = _ref.y, | ||
y = _ref$y === void 0 ? 'y' : _ref$y; | ||
var getX = getAccessor(x); | ||
var getY = getAccessor(y); | ||
return points.map(function (point) { | ||
return [getX(point), getY(point)]; | ||
}); | ||
}; | ||
var computeMesh = function computeMesh(_ref2) { | ||
var points = _ref2.points, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
debug = _ref2.debug; | ||
var delaunay = Delaunay.from(points); | ||
var voronoi = debug ? delaunay.voronoi([0, 0, width, height]) : undefined; | ||
return { | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}; | ||
var useVoronoiMesh = function useVoronoiMesh(_ref) { | ||
var points = _ref.points, | ||
x = _ref.x, | ||
y = _ref.y, | ||
width = _ref.width, | ||
height = _ref.height, | ||
debug = _ref.debug; | ||
var points2d = useMemo(function () { | ||
return computeMeshPoints({ | ||
points: points, | ||
x: x, | ||
y: y | ||
}); | ||
}, [points, x, y]); | ||
return useMemo(function () { | ||
return computeMesh({ | ||
points: points2d, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}); | ||
}, [points2d, width, height, debug]); | ||
}; | ||
var useVoronoi = function useVoronoi(_ref2) { | ||
var data = _ref2.data, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
xDomain = _ref2.xDomain, | ||
yDomain = _ref2.yDomain; | ||
var xScale = useMemo(function () { | ||
return scaleLinear().domain(xDomain).range([0, width]); | ||
}, [xDomain, width]); | ||
var yScale = useMemo(function () { | ||
return scaleLinear().domain(yDomain).range([0, height]); | ||
}, [yDomain, height]); | ||
var points = useMemo(function () { | ||
return data.map(function (d) { | ||
return { | ||
x: xScale(d.x), | ||
y: yScale(d.y), | ||
data: d | ||
}; | ||
}); | ||
}, [data, xScale, yScale]); | ||
return useMemo(function () { | ||
var delaunay = Delaunay.from(points.map(function (p) { | ||
return [p.x, p.y]; | ||
})); | ||
var voronoi = delaunay.voronoi([0, 0, width, height]); | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, width, height]); | ||
}; | ||
var useVoronoiLayerContext = function useVoronoiLayerContext(_ref3) { | ||
var points = _ref3.points, | ||
delaunay = _ref3.delaunay, | ||
voronoi = _ref3.voronoi; | ||
return useMemo(function () { | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, delaunay, voronoi]); | ||
}; | ||
var InnerVoronoi = function InnerVoronoi(_ref) { | ||
var data = _ref.data, | ||
width = _ref.width, | ||
height = _ref.height, | ||
partialMargin = _ref.margin, | ||
_ref$layers = _ref.layers, | ||
layers = _ref$layers === void 0 ? defaultVoronoiProps.layers : _ref$layers, | ||
_ref$xDomain = _ref.xDomain, | ||
xDomain = _ref$xDomain === void 0 ? defaultVoronoiProps.xDomain : _ref$xDomain, | ||
_ref$yDomain = _ref.yDomain, | ||
yDomain = _ref$yDomain === void 0 ? defaultVoronoiProps.yDomain : _ref$yDomain, | ||
_ref$enableLinks = _ref.enableLinks, | ||
enableLinks = _ref$enableLinks === void 0 ? defaultVoronoiProps.enableLinks : _ref$enableLinks, | ||
_ref$linkLineWidth = _ref.linkLineWidth, | ||
linkLineWidth = _ref$linkLineWidth === void 0 ? defaultVoronoiProps.linkLineWidth : _ref$linkLineWidth, | ||
_ref$linkLineColor = _ref.linkLineColor, | ||
linkLineColor = _ref$linkLineColor === void 0 ? defaultVoronoiProps.linkLineColor : _ref$linkLineColor, | ||
_ref$enableCells = _ref.enableCells, | ||
enableCells = _ref$enableCells === void 0 ? defaultVoronoiProps.enableCells : _ref$enableCells, | ||
_ref$cellLineWidth = _ref.cellLineWidth, | ||
cellLineWidth = _ref$cellLineWidth === void 0 ? defaultVoronoiProps.cellLineWidth : _ref$cellLineWidth, | ||
_ref$cellLineColor = _ref.cellLineColor, | ||
cellLineColor = _ref$cellLineColor === void 0 ? defaultVoronoiProps.cellLineColor : _ref$cellLineColor, | ||
_ref$enablePoints = _ref.enablePoints, | ||
enablePoints = _ref$enablePoints === void 0 ? defaultVoronoiProps.enableCells : _ref$enablePoints, | ||
_ref$pointSize = _ref.pointSize, | ||
pointSize = _ref$pointSize === void 0 ? defaultVoronoiProps.pointSize : _ref$pointSize, | ||
_ref$pointColor = _ref.pointColor, | ||
pointColor = _ref$pointColor === void 0 ? defaultVoronoiProps.pointColor : _ref$pointColor, | ||
_ref$role = _ref.role, | ||
role = _ref$role === void 0 ? defaultVoronoiProps.role : _ref$role; | ||
var _useDimensions = useDimensions(width, height, partialMargin), | ||
outerWidth = _useDimensions.outerWidth, | ||
outerHeight = _useDimensions.outerHeight, | ||
margin = _useDimensions.margin, | ||
innerWidth = _useDimensions.innerWidth, | ||
innerHeight = _useDimensions.innerHeight; | ||
var _useVoronoi = useVoronoi({ | ||
data: data, | ||
width: innerWidth, | ||
height: innerHeight, | ||
xDomain: xDomain, | ||
yDomain: yDomain | ||
}), | ||
points = _useVoronoi.points, | ||
delaunay = _useVoronoi.delaunay, | ||
voronoi = _useVoronoi.voronoi; | ||
var layerById = { | ||
links: null, | ||
cells: null, | ||
points: null, | ||
bounds: null | ||
}; | ||
if (enableLinks && layers.includes('links')) { | ||
layerById.links = jsx("path", { | ||
stroke: linkLineColor, | ||
strokeWidth: linkLineWidth, | ||
fill: "none", | ||
d: delaunay.render() | ||
}, "links"); | ||
} | ||
if (enableCells && layers.includes('cells')) { | ||
layerById.cells = jsx("path", { | ||
d: voronoi.render(), | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth | ||
}, "cells"); | ||
} | ||
if (enablePoints && layers.includes('points')) { | ||
layerById.points = jsx("path", { | ||
stroke: "none", | ||
fill: pointColor, | ||
d: delaunay.renderPoints(undefined, pointSize / 2) | ||
}, "points"); | ||
} | ||
if (layers.includes('bounds')) { | ||
layerById.bounds = jsx("path", { | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth, | ||
d: voronoi.renderBounds() | ||
}, "bounds"); | ||
} | ||
var layerContext = useVoronoiLayerContext({ | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}); | ||
return jsx(SvgWrapper, { | ||
width: outerWidth, | ||
height: outerHeight, | ||
margin: margin, | ||
role: role, | ||
children: layers.map(function (layer, i) { | ||
if (layerById[layer] !== undefined) { | ||
return layerById[layer]; | ||
} | ||
if (typeof layer === 'function') { | ||
return jsx(Fragment, { | ||
children: createElement(layer, layerContext) | ||
}, i); | ||
} | ||
return null; | ||
}) | ||
}); | ||
}; | ||
var Voronoi = function Voronoi(_ref2) { | ||
var theme = _ref2.theme, | ||
otherProps = _objectWithoutProperties(_ref2, ["theme"]); | ||
return jsx(Container, { | ||
isInteractive: false, | ||
animate: false, | ||
theme: theme, | ||
children: jsx(InnerVoronoi, _objectSpread2({}, otherProps)) | ||
}); | ||
}; | ||
var ResponsiveVoronoi = function ResponsiveVoronoi(props) { | ||
return jsx(ResponsiveWrapper, { | ||
children: function children(_ref) { | ||
var width = _ref.width, | ||
height = _ref.height; | ||
return jsx(Voronoi, _objectSpread2({ | ||
width: width, | ||
height: height | ||
}, props)); | ||
} | ||
}); | ||
}; | ||
function _arrayWithHoles(arr) { | ||
if (Array.isArray(arr)) return arr; | ||
} | ||
function _iterableToArrayLimit(arr, i) { | ||
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; | ||
var _arr = []; | ||
var _n = true; | ||
var _d = false; | ||
var _e = undefined; | ||
try { | ||
for (var _i = arr[Symbol.iterator](), _s; !(_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 _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 _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 _slicedToArray(arr, i) { | ||
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); | ||
} | ||
var Mesh = function Mesh(_ref) { | ||
var nodes = _ref.nodes, | ||
width = _ref.width, | ||
height = _ref.height, | ||
x = _ref.x, | ||
y = _ref.y, | ||
onMouseEnter = _ref.onMouseEnter, | ||
onMouseMove = _ref.onMouseMove, | ||
onMouseLeave = _ref.onMouseLeave, | ||
onClick = _ref.onClick, | ||
debug = _ref.debug; | ||
var elementRef = useRef(null); | ||
var _useState = useState(null), | ||
_useState2 = _slicedToArray(_useState, 2), | ||
currentIndex = _useState2[0], | ||
setCurrentIndex = _useState2[1]; | ||
var _useVoronoiMesh = useVoronoiMesh({ | ||
points: nodes, | ||
x: x, | ||
y: y, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}), | ||
delaunay = _useVoronoiMesh.delaunay, | ||
voronoi = _useVoronoiMesh.voronoi; | ||
var voronoiPath = useMemo(function () { | ||
if (debug && voronoi) { | ||
return voronoi.render(); | ||
} | ||
return undefined; | ||
}, [debug, voronoi]); | ||
var getIndexAndNodeFromEvent = useCallback(function (event) { | ||
if (!elementRef.current) { | ||
return [null, null]; | ||
} | ||
var _getRelativeCursor = getRelativeCursor(elementRef.current, event), | ||
_getRelativeCursor2 = _slicedToArray(_getRelativeCursor, 2), | ||
x = _getRelativeCursor2[0], | ||
y = _getRelativeCursor2[1]; | ||
var index = delaunay.find(x, y); | ||
return [index, index !== undefined ? nodes[index] : null]; | ||
}, [elementRef, delaunay]); | ||
var handleMouseEnter = useCallback(function (event) { | ||
var _getIndexAndNodeFromE = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE2 = _slicedToArray(_getIndexAndNodeFromE, 2), | ||
index = _getIndexAndNodeFromE2[0], | ||
node = _getIndexAndNodeFromE2[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseEnter]); | ||
var handleMouseMove = useCallback(function (event) { | ||
var _getIndexAndNodeFromE3 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE4 = _slicedToArray(_getIndexAndNodeFromE3, 2), | ||
index = _getIndexAndNodeFromE4[0], | ||
node = _getIndexAndNodeFromE4[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseMove]); | ||
var handleMouseLeave = useCallback(function (event) { | ||
setCurrentIndex(null); | ||
if (onMouseLeave) { | ||
var previousNode = undefined; | ||
if (currentIndex !== null) { | ||
previousNode = nodes[currentIndex]; | ||
} | ||
previousNode && onMouseLeave(previousNode, event); | ||
} | ||
}, [setCurrentIndex, currentIndex, onMouseLeave, nodes]); | ||
var handleClick = useCallback(function (event) { | ||
var _getIndexAndNodeFromE5 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE6 = _slicedToArray(_getIndexAndNodeFromE5, 2), | ||
index = _getIndexAndNodeFromE6[0], | ||
node = _getIndexAndNodeFromE6[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onClick === null || onClick === void 0 ? void 0 : onClick(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onClick]); | ||
return jsxs("g", { | ||
ref: elementRef, | ||
children: [debug && voronoi && jsxs(Fragment$1, { | ||
children: [jsx("path", { | ||
d: voronoiPath, | ||
stroke: "red", | ||
strokeWidth: 1, | ||
opacity: 0.75 | ||
}), currentIndex !== null && jsx("path", { | ||
fill: "pink", | ||
opacity: 0.35, | ||
d: voronoi.renderCell(currentIndex) | ||
})] | ||
}), jsx("rect", { | ||
width: width, | ||
height: height, | ||
fill: "red", | ||
opacity: 0, | ||
style: { | ||
cursor: 'auto' | ||
}, | ||
onMouseEnter: handleMouseEnter, | ||
onMouseMove: handleMouseMove, | ||
onMouseLeave: handleMouseLeave, | ||
onClick: handleClick | ||
})] | ||
}); | ||
}; | ||
var renderVoronoiToCanvas = function renderVoronoiToCanvas(ctx, voronoi) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.75; | ||
ctx.beginPath(); | ||
voronoi.render(ctx); | ||
ctx.strokeStyle = 'red'; | ||
ctx.lineWidth = 1; | ||
ctx.stroke(); | ||
ctx.restore(); | ||
}; | ||
var renderVoronoiCellToCanvas = function renderVoronoiCellToCanvas(ctx, voronoi, index) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.35; | ||
ctx.beginPath(); | ||
voronoi.renderCell(index, ctx); | ||
ctx.fillStyle = 'red'; | ||
ctx.fill(); | ||
ctx.restore(); | ||
}; | ||
export { Mesh, ResponsiveVoronoi, Voronoi, computeMesh, computeMeshPoints, defaultVoronoiProps, renderVoronoiCellToCanvas, renderVoronoiToCanvas, useVoronoi, useVoronoiLayerContext, useVoronoiMesh }; | ||
import{useMemo as n,Fragment as e,createElement as i,useRef as o,useState as t,useCallback as r}from"react";import{Container as l,useDimensions as u,SvgWrapper as a,ResponsiveWrapper as d,getRelativeCursor as s}from"@nivo/core";import{scaleLinear as c}from"d3-scale";import{Delaunay as h}from"d3-delaunay";import{jsx as f,jsxs as v,Fragment as p}from"react/jsx-runtime";function m(){return m=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var o in i)Object.prototype.hasOwnProperty.call(i,o)&&(n[o]=i[o])}return n},m.apply(this,arguments)}var y={xDomain:[0,1],yDomain:[0,1],layers:["links","cells","points","bounds"],enableLinks:!1,linkLineWidth:1,linkLineColor:"#bbbbbb",enableCells:!0,cellLineWidth:2,cellLineColor:"#000000",enablePoints:!0,pointSize:4,pointColor:"#666666",role:"img"},g=function(n){return"function"==typeof n?n:function(e){return e[n]}},b=function(n){var e=n.points,i=n.x,o=void 0===i?"x":i,t=n.y,r=void 0===t?"y":t,l=g(o),u=g(r);return e.map((function(n){return[l(n),u(n)]}))},k=function(n){var e=n.points,i=n.width,o=n.height,t=n.debug,r=h.from(e),l=t?r.voronoi([0,0,i,o]):void 0;return{delaunay:r,voronoi:l}},x=function(e){var i=e.points,o=e.x,t=e.y,r=e.width,l=e.height,u=e.debug,a=n((function(){return b({points:i,x:o,y:t})}),[i,o,t]);return n((function(){return k({points:a,width:r,height:l,debug:u})}),[a,r,l,u])},C=function(e){var i=e.data,o=e.width,t=e.height,r=e.xDomain,l=e.yDomain,u=n((function(){return c().domain(r).range([0,o])}),[r,o]),a=n((function(){return c().domain(l).range([0,t])}),[l,t]),d=n((function(){return i.map((function(n){return{x:u(n.x),y:a(n.y),data:n}}))}),[i,u,a]);return n((function(){var n=h.from(d.map((function(n){return[n.x,n.y]}))),e=n.voronoi([0,0,o,t]);return{points:d,delaunay:n,voronoi:e}}),[d,o,t])},L=function(e){var i=e.points,o=e.delaunay,t=e.voronoi;return n((function(){return{points:i,delaunay:o,voronoi:t}}),[i,o,t])},w=["theme"],W=function(n){var o=n.data,t=n.width,r=n.height,l=n.margin,d=n.layers,s=void 0===d?y.layers:d,c=n.xDomain,h=void 0===c?y.xDomain:c,v=n.yDomain,p=void 0===v?y.yDomain:v,m=n.enableLinks,g=void 0===m?y.enableLinks:m,b=n.linkLineWidth,k=void 0===b?y.linkLineWidth:b,x=n.linkLineColor,w=void 0===x?y.linkLineColor:x,W=n.enableCells,D=void 0===W?y.enableCells:W,M=n.cellLineWidth,P=void 0===M?y.cellLineWidth:M,O=n.cellLineColor,S=void 0===O?y.cellLineColor:O,j=n.enablePoints,z=void 0===j?y.enableCells:j,A=n.pointSize,E=void 0===A?y.pointSize:A,H=n.pointColor,B=void 0===H?y.pointColor:H,F=n.role,I=void 0===F?y.role:F,q=u(t,r,l),G=q.outerWidth,J=q.outerHeight,K=q.margin,N=q.innerWidth,Q=q.innerHeight,R=C({data:o,width:N,height:Q,xDomain:h,yDomain:p}),T=R.points,U=R.delaunay,V=R.voronoi,X={links:null,cells:null,points:null,bounds:null};g&&s.includes("links")&&(X.links=f("path",{stroke:w,strokeWidth:k,fill:"none",d:U.render()},"links")),D&&s.includes("cells")&&(X.cells=f("path",{d:V.render(),fill:"none",stroke:S,strokeWidth:P},"cells")),z&&s.includes("points")&&(X.points=f("path",{stroke:"none",fill:B,d:U.renderPoints(void 0,E/2)},"points")),s.includes("bounds")&&(X.bounds=f("path",{fill:"none",stroke:S,strokeWidth:P,d:V.renderBounds()},"bounds"));var Y=L({points:T,delaunay:U,voronoi:V});return f(a,{width:G,height:J,margin:K,role:I,children:s.map((function(n,o){return void 0!==X[n]?X[n]:"function"==typeof n?f(e,{children:i(n,Y)},o):null}))})},D=function(n){var e=n.theme,i=function(n,e){if(null==n)return{};var i,o,t={},r=Object.keys(n);for(o=0;o<r.length;o++)i=r[o],e.indexOf(i)>=0||(t[i]=n[i]);return t}(n,w);return f(l,{isInteractive:!1,animate:!1,theme:e,children:f(W,m({},i))})},M=function(n){return f(d,{children:function(e){var i=e.width,o=e.height;return f(D,m({width:i,height:o},n))}})},P=function(e){var i=e.nodes,l=e.width,u=e.height,a=e.x,d=e.y,c=e.onMouseEnter,h=e.onMouseMove,m=e.onMouseLeave,y=e.onClick,g=e.debug,b=o(null),k=t(null),C=k[0],L=k[1],w=x({points:i,x:a,y:d,width:l,height:u,debug:g}),W=w.delaunay,D=w.voronoi,M=n((function(){if(g&&D)return D.render()}),[g,D]),P=r((function(n){if(!b.current)return[null,null];var e=s(b.current,n),o=e[0],t=e[1],r=W.find(o,t);return[r,void 0!==r?i[r]:null]}),[b,W]),O=r((function(n){var e=P(n),i=e[0],o=e[1];L(i),o&&(null==c||c(o,n))}),[P,L,c]),S=r((function(n){var e=P(n),i=e[0],o=e[1];L(i),o&&(null==h||h(o,n))}),[P,L,h]),j=r((function(n){if(L(null),m){var e=void 0;null!==C&&(e=i[C]),e&&m(e,n)}}),[L,C,m,i]),z=r((function(n){var e=P(n),i=e[0],o=e[1];L(i),o&&(null==y||y(o,n))}),[P,L,y]);return v("g",{ref:b,children:[g&&D&&v(p,{children:[f("path",{d:M,stroke:"red",strokeWidth:1,opacity:.75}),null!==C&&f("path",{fill:"pink",opacity:.35,d:D.renderCell(C)})]}),f("rect",{width:l,height:u,fill:"red",opacity:0,style:{cursor:"auto"},onMouseEnter:O,onMouseMove:S,onMouseLeave:j,onClick:z})]})},O=function(n,e){n.save(),n.globalAlpha=.75,n.beginPath(),e.render(n),n.strokeStyle="red",n.lineWidth=1,n.stroke(),n.restore()},S=function(n,e,i){n.save(),n.globalAlpha=.35,n.beginPath(),e.renderCell(i,n),n.fillStyle="red",n.fill(),n.restore()};export{P as Mesh,M as ResponsiveVoronoi,D as Voronoi,k as computeMesh,b as computeMeshPoints,y as defaultVoronoiProps,S as renderVoronoiCellToCanvas,O as renderVoronoiToCanvas,C as useVoronoi,L as useVoronoiLayerContext,x as useVoronoiMesh}; | ||
//# sourceMappingURL=nivo-voronoi.es.js.map |
@@ -1,553 +0,2 @@ | ||
(function (global, factory) { | ||
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@nivo/core'), require('d3-scale'), require('d3-delaunay'), require('react/jsx-runtime')) : | ||
typeof define === 'function' && define.amd ? define(['exports', 'react', '@nivo/core', 'd3-scale', 'd3-delaunay', 'react/jsx-runtime'], factory) : | ||
(global = global || self, factory(global.nivo = global.nivo || {}, global.React, global.nivo, global.d3, global.d3, global['react/jsx-runtime'])); | ||
}(this, (function (exports, react, core, d3Scale, d3Delaunay, jsxRuntime) { 'use strict'; | ||
function _defineProperty(obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
} | ||
function ownKeys(object, enumerableOnly) { | ||
var keys = Object.keys(object); | ||
if (Object.getOwnPropertySymbols) { | ||
var symbols = Object.getOwnPropertySymbols(object); | ||
if (enumerableOnly) symbols = symbols.filter(function (sym) { | ||
return Object.getOwnPropertyDescriptor(object, sym).enumerable; | ||
}); | ||
keys.push.apply(keys, symbols); | ||
} | ||
return keys; | ||
} | ||
function _objectSpread2(target) { | ||
for (var i = 1; i < arguments.length; i++) { | ||
var source = arguments[i] != null ? arguments[i] : {}; | ||
if (i % 2) { | ||
ownKeys(Object(source), true).forEach(function (key) { | ||
_defineProperty(target, key, source[key]); | ||
}); | ||
} else if (Object.getOwnPropertyDescriptors) { | ||
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); | ||
} else { | ||
ownKeys(Object(source)).forEach(function (key) { | ||
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); | ||
}); | ||
} | ||
} | ||
return target; | ||
} | ||
function _objectWithoutPropertiesLoose(source, excluded) { | ||
if (source == null) return {}; | ||
var target = {}; | ||
var sourceKeys = Object.keys(source); | ||
var key, i; | ||
for (i = 0; i < sourceKeys.length; i++) { | ||
key = sourceKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
target[key] = source[key]; | ||
} | ||
return target; | ||
} | ||
function _objectWithoutProperties(source, excluded) { | ||
if (source == null) return {}; | ||
var target = _objectWithoutPropertiesLoose(source, excluded); | ||
var key, i; | ||
if (Object.getOwnPropertySymbols) { | ||
var sourceSymbolKeys = Object.getOwnPropertySymbols(source); | ||
for (i = 0; i < sourceSymbolKeys.length; i++) { | ||
key = sourceSymbolKeys[i]; | ||
if (excluded.indexOf(key) >= 0) continue; | ||
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; | ||
target[key] = source[key]; | ||
} | ||
} | ||
return target; | ||
} | ||
var defaultVoronoiProps = { | ||
xDomain: [0, 1], | ||
yDomain: [0, 1], | ||
layers: ['links', 'cells', 'points', 'bounds'], | ||
enableLinks: false, | ||
linkLineWidth: 1, | ||
linkLineColor: '#bbbbbb', | ||
enableCells: true, | ||
cellLineWidth: 2, | ||
cellLineColor: '#000000', | ||
enablePoints: true, | ||
pointSize: 4, | ||
pointColor: '#666666', | ||
role: 'img' | ||
}; | ||
var getAccessor = function getAccessor(directive) { | ||
return typeof directive === 'function' ? directive : function (datum) { | ||
return datum[directive]; | ||
}; | ||
}; | ||
var computeMeshPoints = function computeMeshPoints(_ref) { | ||
var points = _ref.points, | ||
_ref$x = _ref.x, | ||
x = _ref$x === void 0 ? 'x' : _ref$x, | ||
_ref$y = _ref.y, | ||
y = _ref$y === void 0 ? 'y' : _ref$y; | ||
var getX = getAccessor(x); | ||
var getY = getAccessor(y); | ||
return points.map(function (point) { | ||
return [getX(point), getY(point)]; | ||
}); | ||
}; | ||
var computeMesh = function computeMesh(_ref2) { | ||
var points = _ref2.points, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
debug = _ref2.debug; | ||
var delaunay = d3Delaunay.Delaunay.from(points); | ||
var voronoi = debug ? delaunay.voronoi([0, 0, width, height]) : undefined; | ||
return { | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}; | ||
var useVoronoiMesh = function useVoronoiMesh(_ref) { | ||
var points = _ref.points, | ||
x = _ref.x, | ||
y = _ref.y, | ||
width = _ref.width, | ||
height = _ref.height, | ||
debug = _ref.debug; | ||
var points2d = react.useMemo(function () { | ||
return computeMeshPoints({ | ||
points: points, | ||
x: x, | ||
y: y | ||
}); | ||
}, [points, x, y]); | ||
return react.useMemo(function () { | ||
return computeMesh({ | ||
points: points2d, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}); | ||
}, [points2d, width, height, debug]); | ||
}; | ||
var useVoronoi = function useVoronoi(_ref2) { | ||
var data = _ref2.data, | ||
width = _ref2.width, | ||
height = _ref2.height, | ||
xDomain = _ref2.xDomain, | ||
yDomain = _ref2.yDomain; | ||
var xScale = react.useMemo(function () { | ||
return d3Scale.scaleLinear().domain(xDomain).range([0, width]); | ||
}, [xDomain, width]); | ||
var yScale = react.useMemo(function () { | ||
return d3Scale.scaleLinear().domain(yDomain).range([0, height]); | ||
}, [yDomain, height]); | ||
var points = react.useMemo(function () { | ||
return data.map(function (d) { | ||
return { | ||
x: xScale(d.x), | ||
y: yScale(d.y), | ||
data: d | ||
}; | ||
}); | ||
}, [data, xScale, yScale]); | ||
return react.useMemo(function () { | ||
var delaunay = d3Delaunay.Delaunay.from(points.map(function (p) { | ||
return [p.x, p.y]; | ||
})); | ||
var voronoi = delaunay.voronoi([0, 0, width, height]); | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, width, height]); | ||
}; | ||
var useVoronoiLayerContext = function useVoronoiLayerContext(_ref3) { | ||
var points = _ref3.points, | ||
delaunay = _ref3.delaunay, | ||
voronoi = _ref3.voronoi; | ||
return react.useMemo(function () { | ||
return { | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}; | ||
}, [points, delaunay, voronoi]); | ||
}; | ||
var InnerVoronoi = function InnerVoronoi(_ref) { | ||
var data = _ref.data, | ||
width = _ref.width, | ||
height = _ref.height, | ||
partialMargin = _ref.margin, | ||
_ref$layers = _ref.layers, | ||
layers = _ref$layers === void 0 ? defaultVoronoiProps.layers : _ref$layers, | ||
_ref$xDomain = _ref.xDomain, | ||
xDomain = _ref$xDomain === void 0 ? defaultVoronoiProps.xDomain : _ref$xDomain, | ||
_ref$yDomain = _ref.yDomain, | ||
yDomain = _ref$yDomain === void 0 ? defaultVoronoiProps.yDomain : _ref$yDomain, | ||
_ref$enableLinks = _ref.enableLinks, | ||
enableLinks = _ref$enableLinks === void 0 ? defaultVoronoiProps.enableLinks : _ref$enableLinks, | ||
_ref$linkLineWidth = _ref.linkLineWidth, | ||
linkLineWidth = _ref$linkLineWidth === void 0 ? defaultVoronoiProps.linkLineWidth : _ref$linkLineWidth, | ||
_ref$linkLineColor = _ref.linkLineColor, | ||
linkLineColor = _ref$linkLineColor === void 0 ? defaultVoronoiProps.linkLineColor : _ref$linkLineColor, | ||
_ref$enableCells = _ref.enableCells, | ||
enableCells = _ref$enableCells === void 0 ? defaultVoronoiProps.enableCells : _ref$enableCells, | ||
_ref$cellLineWidth = _ref.cellLineWidth, | ||
cellLineWidth = _ref$cellLineWidth === void 0 ? defaultVoronoiProps.cellLineWidth : _ref$cellLineWidth, | ||
_ref$cellLineColor = _ref.cellLineColor, | ||
cellLineColor = _ref$cellLineColor === void 0 ? defaultVoronoiProps.cellLineColor : _ref$cellLineColor, | ||
_ref$enablePoints = _ref.enablePoints, | ||
enablePoints = _ref$enablePoints === void 0 ? defaultVoronoiProps.enableCells : _ref$enablePoints, | ||
_ref$pointSize = _ref.pointSize, | ||
pointSize = _ref$pointSize === void 0 ? defaultVoronoiProps.pointSize : _ref$pointSize, | ||
_ref$pointColor = _ref.pointColor, | ||
pointColor = _ref$pointColor === void 0 ? defaultVoronoiProps.pointColor : _ref$pointColor, | ||
_ref$role = _ref.role, | ||
role = _ref$role === void 0 ? defaultVoronoiProps.role : _ref$role; | ||
var _useDimensions = core.useDimensions(width, height, partialMargin), | ||
outerWidth = _useDimensions.outerWidth, | ||
outerHeight = _useDimensions.outerHeight, | ||
margin = _useDimensions.margin, | ||
innerWidth = _useDimensions.innerWidth, | ||
innerHeight = _useDimensions.innerHeight; | ||
var _useVoronoi = useVoronoi({ | ||
data: data, | ||
width: innerWidth, | ||
height: innerHeight, | ||
xDomain: xDomain, | ||
yDomain: yDomain | ||
}), | ||
points = _useVoronoi.points, | ||
delaunay = _useVoronoi.delaunay, | ||
voronoi = _useVoronoi.voronoi; | ||
var layerById = { | ||
links: null, | ||
cells: null, | ||
points: null, | ||
bounds: null | ||
}; | ||
if (enableLinks && layers.includes('links')) { | ||
layerById.links = jsxRuntime.jsx("path", { | ||
stroke: linkLineColor, | ||
strokeWidth: linkLineWidth, | ||
fill: "none", | ||
d: delaunay.render() | ||
}, "links"); | ||
} | ||
if (enableCells && layers.includes('cells')) { | ||
layerById.cells = jsxRuntime.jsx("path", { | ||
d: voronoi.render(), | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth | ||
}, "cells"); | ||
} | ||
if (enablePoints && layers.includes('points')) { | ||
layerById.points = jsxRuntime.jsx("path", { | ||
stroke: "none", | ||
fill: pointColor, | ||
d: delaunay.renderPoints(undefined, pointSize / 2) | ||
}, "points"); | ||
} | ||
if (layers.includes('bounds')) { | ||
layerById.bounds = jsxRuntime.jsx("path", { | ||
fill: "none", | ||
stroke: cellLineColor, | ||
strokeWidth: cellLineWidth, | ||
d: voronoi.renderBounds() | ||
}, "bounds"); | ||
} | ||
var layerContext = useVoronoiLayerContext({ | ||
points: points, | ||
delaunay: delaunay, | ||
voronoi: voronoi | ||
}); | ||
return jsxRuntime.jsx(core.SvgWrapper, { | ||
width: outerWidth, | ||
height: outerHeight, | ||
margin: margin, | ||
role: role, | ||
children: layers.map(function (layer, i) { | ||
if (layerById[layer] !== undefined) { | ||
return layerById[layer]; | ||
} | ||
if (typeof layer === 'function') { | ||
return jsxRuntime.jsx(react.Fragment, { | ||
children: react.createElement(layer, layerContext) | ||
}, i); | ||
} | ||
return null; | ||
}) | ||
}); | ||
}; | ||
var Voronoi = function Voronoi(_ref2) { | ||
var theme = _ref2.theme, | ||
otherProps = _objectWithoutProperties(_ref2, ["theme"]); | ||
return jsxRuntime.jsx(core.Container, { | ||
isInteractive: false, | ||
animate: false, | ||
theme: theme, | ||
children: jsxRuntime.jsx(InnerVoronoi, _objectSpread2({}, otherProps)) | ||
}); | ||
}; | ||
var ResponsiveVoronoi = function ResponsiveVoronoi(props) { | ||
return jsxRuntime.jsx(core.ResponsiveWrapper, { | ||
children: function children(_ref) { | ||
var width = _ref.width, | ||
height = _ref.height; | ||
return jsxRuntime.jsx(Voronoi, _objectSpread2({ | ||
width: width, | ||
height: height | ||
}, props)); | ||
} | ||
}); | ||
}; | ||
function _arrayWithHoles(arr) { | ||
if (Array.isArray(arr)) return arr; | ||
} | ||
function _iterableToArrayLimit(arr, i) { | ||
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; | ||
var _arr = []; | ||
var _n = true; | ||
var _d = false; | ||
var _e = undefined; | ||
try { | ||
for (var _i = arr[Symbol.iterator](), _s; !(_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 _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 _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 _slicedToArray(arr, i) { | ||
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); | ||
} | ||
var Mesh = function Mesh(_ref) { | ||
var nodes = _ref.nodes, | ||
width = _ref.width, | ||
height = _ref.height, | ||
x = _ref.x, | ||
y = _ref.y, | ||
onMouseEnter = _ref.onMouseEnter, | ||
onMouseMove = _ref.onMouseMove, | ||
onMouseLeave = _ref.onMouseLeave, | ||
onClick = _ref.onClick, | ||
debug = _ref.debug; | ||
var elementRef = react.useRef(null); | ||
var _useState = react.useState(null), | ||
_useState2 = _slicedToArray(_useState, 2), | ||
currentIndex = _useState2[0], | ||
setCurrentIndex = _useState2[1]; | ||
var _useVoronoiMesh = useVoronoiMesh({ | ||
points: nodes, | ||
x: x, | ||
y: y, | ||
width: width, | ||
height: height, | ||
debug: debug | ||
}), | ||
delaunay = _useVoronoiMesh.delaunay, | ||
voronoi = _useVoronoiMesh.voronoi; | ||
var voronoiPath = react.useMemo(function () { | ||
if (debug && voronoi) { | ||
return voronoi.render(); | ||
} | ||
return undefined; | ||
}, [debug, voronoi]); | ||
var getIndexAndNodeFromEvent = react.useCallback(function (event) { | ||
if (!elementRef.current) { | ||
return [null, null]; | ||
} | ||
var _getRelativeCursor = core.getRelativeCursor(elementRef.current, event), | ||
_getRelativeCursor2 = _slicedToArray(_getRelativeCursor, 2), | ||
x = _getRelativeCursor2[0], | ||
y = _getRelativeCursor2[1]; | ||
var index = delaunay.find(x, y); | ||
return [index, index !== undefined ? nodes[index] : null]; | ||
}, [elementRef, delaunay]); | ||
var handleMouseEnter = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE2 = _slicedToArray(_getIndexAndNodeFromE, 2), | ||
index = _getIndexAndNodeFromE2[0], | ||
node = _getIndexAndNodeFromE2[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseEnter]); | ||
var handleMouseMove = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE3 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE4 = _slicedToArray(_getIndexAndNodeFromE3, 2), | ||
index = _getIndexAndNodeFromE4[0], | ||
node = _getIndexAndNodeFromE4[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onMouseMove]); | ||
var handleMouseLeave = react.useCallback(function (event) { | ||
setCurrentIndex(null); | ||
if (onMouseLeave) { | ||
var previousNode = undefined; | ||
if (currentIndex !== null) { | ||
previousNode = nodes[currentIndex]; | ||
} | ||
previousNode && onMouseLeave(previousNode, event); | ||
} | ||
}, [setCurrentIndex, currentIndex, onMouseLeave, nodes]); | ||
var handleClick = react.useCallback(function (event) { | ||
var _getIndexAndNodeFromE5 = getIndexAndNodeFromEvent(event), | ||
_getIndexAndNodeFromE6 = _slicedToArray(_getIndexAndNodeFromE5, 2), | ||
index = _getIndexAndNodeFromE6[0], | ||
node = _getIndexAndNodeFromE6[1]; | ||
setCurrentIndex(index); | ||
if (node) { | ||
onClick === null || onClick === void 0 ? void 0 : onClick(node, event); | ||
} | ||
}, [getIndexAndNodeFromEvent, setCurrentIndex, onClick]); | ||
return jsxRuntime.jsxs("g", { | ||
ref: elementRef, | ||
children: [debug && voronoi && jsxRuntime.jsxs(jsxRuntime.Fragment, { | ||
children: [jsxRuntime.jsx("path", { | ||
d: voronoiPath, | ||
stroke: "red", | ||
strokeWidth: 1, | ||
opacity: 0.75 | ||
}), currentIndex !== null && jsxRuntime.jsx("path", { | ||
fill: "pink", | ||
opacity: 0.35, | ||
d: voronoi.renderCell(currentIndex) | ||
})] | ||
}), jsxRuntime.jsx("rect", { | ||
width: width, | ||
height: height, | ||
fill: "red", | ||
opacity: 0, | ||
style: { | ||
cursor: 'auto' | ||
}, | ||
onMouseEnter: handleMouseEnter, | ||
onMouseMove: handleMouseMove, | ||
onMouseLeave: handleMouseLeave, | ||
onClick: handleClick | ||
})] | ||
}); | ||
}; | ||
var renderVoronoiToCanvas = function renderVoronoiToCanvas(ctx, voronoi) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.75; | ||
ctx.beginPath(); | ||
voronoi.render(ctx); | ||
ctx.strokeStyle = 'red'; | ||
ctx.lineWidth = 1; | ||
ctx.stroke(); | ||
ctx.restore(); | ||
}; | ||
var renderVoronoiCellToCanvas = function renderVoronoiCellToCanvas(ctx, voronoi, index) { | ||
ctx.save(); | ||
ctx.globalAlpha = 0.35; | ||
ctx.beginPath(); | ||
voronoi.renderCell(index, ctx); | ||
ctx.fillStyle = 'red'; | ||
ctx.fill(); | ||
ctx.restore(); | ||
}; | ||
exports.Mesh = Mesh; | ||
exports.ResponsiveVoronoi = ResponsiveVoronoi; | ||
exports.Voronoi = Voronoi; | ||
exports.computeMesh = computeMesh; | ||
exports.computeMeshPoints = computeMeshPoints; | ||
exports.defaultVoronoiProps = defaultVoronoiProps; | ||
exports.renderVoronoiCellToCanvas = renderVoronoiCellToCanvas; | ||
exports.renderVoronoiToCanvas = renderVoronoiToCanvas; | ||
exports.useVoronoi = useVoronoi; | ||
exports.useVoronoiLayerContext = useVoronoiLayerContext; | ||
exports.useVoronoiMesh = useVoronoiMesh; | ||
Object.defineProperty(exports, '__esModule', { value: true }); | ||
}))); | ||
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@nivo/core"),require("d3-scale"),require("d3-delaunay"),require("react/jsx-runtime")):"function"==typeof define&&define.amd?define(["exports","react","@nivo/core","d3-scale","d3-delaunay","react/jsx-runtime"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).nivo=e.nivo||{},e.React,e.nivo,e.d3,e.d3,e["react/jsx-runtime"])}(this,(function(e,n,o,i,r,t){"use strict";function l(){return l=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var o=arguments[n];for(var i in o)Object.prototype.hasOwnProperty.call(o,i)&&(e[i]=o[i])}return e},l.apply(this,arguments)}var u={xDomain:[0,1],yDomain:[0,1],layers:["links","cells","points","bounds"],enableLinks:!1,linkLineWidth:1,linkLineColor:"#bbbbbb",enableCells:!0,cellLineWidth:2,cellLineColor:"#000000",enablePoints:!0,pointSize:4,pointColor:"#666666",role:"img"},a=function(e){return"function"==typeof e?e:function(n){return n[e]}},s=function(e){var n=e.points,o=e.x,i=void 0===o?"x":o,r=e.y,t=void 0===r?"y":r,l=a(i),u=a(t);return n.map((function(e){return[l(e),u(e)]}))},d=function(e){var n=e.points,o=e.width,i=e.height,t=e.debug,l=r.Delaunay.from(n),u=t?l.voronoi([0,0,o,i]):void 0;return{delaunay:l,voronoi:u}},c=function(e){var o=e.points,i=e.x,r=e.y,t=e.width,l=e.height,u=e.debug,a=n.useMemo((function(){return s({points:o,x:i,y:r})}),[o,i,r]);return n.useMemo((function(){return d({points:a,width:t,height:l,debug:u})}),[a,t,l,u])},h=function(e){var o=e.data,t=e.width,l=e.height,u=e.xDomain,a=e.yDomain,s=n.useMemo((function(){return i.scaleLinear().domain(u).range([0,t])}),[u,t]),d=n.useMemo((function(){return i.scaleLinear().domain(a).range([0,l])}),[a,l]),c=n.useMemo((function(){return o.map((function(e){return{x:s(e.x),y:d(e.y),data:e}}))}),[o,s,d]);return n.useMemo((function(){var e=r.Delaunay.from(c.map((function(e){return[e.x,e.y]}))),n=e.voronoi([0,0,t,l]);return{points:c,delaunay:e,voronoi:n}}),[c,t,l])},f=function(e){var o=e.points,i=e.delaunay,r=e.voronoi;return n.useMemo((function(){return{points:o,delaunay:i,voronoi:r}}),[o,i,r])},v=["theme"],p=function(e){var i=e.data,r=e.width,l=e.height,a=e.margin,s=e.layers,d=void 0===s?u.layers:s,c=e.xDomain,v=void 0===c?u.xDomain:c,p=e.yDomain,y=void 0===p?u.yDomain:p,m=e.enableLinks,b=void 0===m?u.enableLinks:m,g=e.linkLineWidth,x=void 0===g?u.linkLineWidth:g,k=e.linkLineColor,C=void 0===k?u.linkLineColor:k,j=e.enableCells,M=void 0===j?u.enableCells:j,L=e.cellLineWidth,W=void 0===L?u.cellLineWidth:L,w=e.cellLineColor,D=void 0===w?u.cellLineColor:w,P=e.enablePoints,V=void 0===P?u.enableCells:P,S=e.pointSize,O=void 0===S?u.pointSize:S,q=e.pointColor,R=void 0===q?u.pointColor:q,T=e.role,z=void 0===T?u.role:T,E=o.useDimensions(r,l,a),A=E.outerWidth,F=E.outerHeight,H=E.margin,_=E.innerWidth,B=E.innerHeight,I=h({data:i,width:_,height:B,xDomain:v,yDomain:y}),G=I.points,J=I.delaunay,K=I.voronoi,N={links:null,cells:null,points:null,bounds:null};b&&d.includes("links")&&(N.links=t.jsx("path",{stroke:C,strokeWidth:x,fill:"none",d:J.render()},"links")),M&&d.includes("cells")&&(N.cells=t.jsx("path",{d:K.render(),fill:"none",stroke:D,strokeWidth:W},"cells")),V&&d.includes("points")&&(N.points=t.jsx("path",{stroke:"none",fill:R,d:J.renderPoints(void 0,O/2)},"points")),d.includes("bounds")&&(N.bounds=t.jsx("path",{fill:"none",stroke:D,strokeWidth:W,d:K.renderBounds()},"bounds"));var Q=f({points:G,delaunay:J,voronoi:K});return t.jsx(o.SvgWrapper,{width:A,height:F,margin:H,role:z,children:d.map((function(e,o){return void 0!==N[e]?N[e]:"function"==typeof e?t.jsx(n.Fragment,{children:n.createElement(e,Q)},o):null}))})},y=function(e){var n=e.theme,i=function(e,n){if(null==e)return{};var o,i,r={},t=Object.keys(e);for(i=0;i<t.length;i++)o=t[i],n.indexOf(o)>=0||(r[o]=e[o]);return r}(e,v);return t.jsx(o.Container,{isInteractive:!1,animate:!1,theme:n,children:t.jsx(p,l({},i))})};e.Mesh=function(e){var i=e.nodes,r=e.width,l=e.height,u=e.x,a=e.y,s=e.onMouseEnter,d=e.onMouseMove,h=e.onMouseLeave,f=e.onClick,v=e.debug,p=n.useRef(null),y=n.useState(null),m=y[0],b=y[1],g=c({points:i,x:u,y:a,width:r,height:l,debug:v}),x=g.delaunay,k=g.voronoi,C=n.useMemo((function(){if(v&&k)return k.render()}),[v,k]),j=n.useCallback((function(e){if(!p.current)return[null,null];var n=o.getRelativeCursor(p.current,e),r=n[0],t=n[1],l=x.find(r,t);return[l,void 0!==l?i[l]:null]}),[p,x]),M=n.useCallback((function(e){var n=j(e),o=n[0],i=n[1];b(o),i&&(null==s||s(i,e))}),[j,b,s]),L=n.useCallback((function(e){var n=j(e),o=n[0],i=n[1];b(o),i&&(null==d||d(i,e))}),[j,b,d]),W=n.useCallback((function(e){if(b(null),h){var n=void 0;null!==m&&(n=i[m]),n&&h(n,e)}}),[b,m,h,i]),w=n.useCallback((function(e){var n=j(e),o=n[0],i=n[1];b(o),i&&(null==f||f(i,e))}),[j,b,f]);return t.jsxs("g",{ref:p,children:[v&&k&&t.jsxs(t.Fragment,{children:[t.jsx("path",{d:C,stroke:"red",strokeWidth:1,opacity:.75}),null!==m&&t.jsx("path",{fill:"pink",opacity:.35,d:k.renderCell(m)})]}),t.jsx("rect",{width:r,height:l,fill:"red",opacity:0,style:{cursor:"auto"},onMouseEnter:M,onMouseMove:L,onMouseLeave:W,onClick:w})]})},e.ResponsiveVoronoi=function(e){return t.jsx(o.ResponsiveWrapper,{children:function(n){var o=n.width,i=n.height;return t.jsx(y,l({width:o,height:i},e))}})},e.Voronoi=y,e.computeMesh=d,e.computeMeshPoints=s,e.defaultVoronoiProps=u,e.renderVoronoiCellToCanvas=function(e,n,o){e.save(),e.globalAlpha=.35,e.beginPath(),n.renderCell(o,e),e.fillStyle="red",e.fill(),e.restore()},e.renderVoronoiToCanvas=function(e,n){e.save(),e.globalAlpha=.75,e.beginPath(),n.render(e),e.strokeStyle="red",e.lineWidth=1,e.stroke(),e.restore()},e.useVoronoi=h,e.useVoronoiLayerContext=f,e.useVoronoiMesh=c,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
//# sourceMappingURL=nivo-voronoi.umd.js.map |
{ | ||
"name": "@nivo/voronoi", | ||
"version": "0.74.1", | ||
"version": "0.75.0", | ||
"license": "MIT", | ||
@@ -36,3 +36,3 @@ "author": { | ||
"devDependencies": { | ||
"@nivo/core": "0.74.1", | ||
"@nivo/core": "0.75.0", | ||
"@types/d3-delaunay": "^5.3.0", | ||
@@ -42,3 +42,3 @@ "@types/d3-scale": "^3.2.2" | ||
"peerDependencies": { | ||
"@nivo/core": "0.74.1", | ||
"@nivo/core": "0.75.0", | ||
"react": ">= 16.14.0 < 18.0.0" | ||
@@ -49,3 +49,3 @@ }, | ||
}, | ||
"gitHead": "4ae8bc60779cb9bb8cb14b16726819217da16133" | ||
"gitHead": "bfe8126876bf0e46ad82251935ab78178e901bcf" | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
89255
224
4
1