@cosmograph/cosmograph
Advanced tools
Comparing version 1.0.0 to 1.1.0
@@ -29,2 +29,7 @@ import { Graph, CosmosInputNode, CosmosInputLink } from '@cosmograph/cosmos'; | ||
private _selectedNodesFilter; | ||
private _cosmos; | ||
/** | ||
* @deprecated Direct use of the cosmos can lead to unexpected results, | ||
* so we do not recommend using it. Will be removed in version 2.0.0 | ||
* */ | ||
cosmos: Graph<N, L>; | ||
@@ -34,2 +39,16 @@ constructor(containerNode: HTMLDivElement, config?: CosmographInputConfig<N, L>); | ||
/** | ||
* Progress value indicates how far the simulation goes from 0 to 1, | ||
* where 0 represents the start of the simulation and 1 represents the end. | ||
*/ | ||
get progress(): number; | ||
/** | ||
* A value that gives information about the running simulation status. | ||
*/ | ||
get isSimulationRunning(): boolean; | ||
/** | ||
* The maximum point size. | ||
* This value is the maximum size of the `gl.POINTS` primitive that WebGL can render on the user's hardware. | ||
*/ | ||
get maxPointSize(): number; | ||
/** | ||
* Sets the data for the graph. | ||
@@ -76,2 +95,7 @@ * @param nodes - Nodes to be added to the graph. | ||
/** | ||
* Get nodes that are currently selected. | ||
* @returns Array of selected nodes. | ||
*/ | ||
getSelectedNodes(): N[] | null; | ||
/** | ||
* Center the view and zoom in to a node. | ||
@@ -82,2 +106,43 @@ * @param node Node to be zoomed in. | ||
/** | ||
* Zoom the view in or out to the specified zoom level. | ||
* @param value Zoom level | ||
* @param duration Duration of the zoom in/out transition. | ||
*/ | ||
setZoomLevel(value: number, duration?: number): void; | ||
/** | ||
* Get zoom level. | ||
* @returns Zoom level value of the view. | ||
*/ | ||
getZoomLevel(): number; | ||
/** | ||
* Get current X and Y coordinates of the nodes. | ||
* @returns Object where keys are the ids of the nodes and values are corresponding `{ x: number; y: number }` objects. | ||
*/ | ||
getNodePositions(): { | ||
[key: string]: { | ||
x: number; | ||
y: number; | ||
}; | ||
}; | ||
/** | ||
* Get current X and Y coordinates of the nodes. | ||
* @returns A Map object where keys are the ids of the nodes and values are their corresponding X and Y coordinates in the [number, number] format. | ||
*/ | ||
getNodePositionsMap(): Map<string, [number, number]>; | ||
/** | ||
* Get current X and Y coordinates of the nodes. | ||
* @returns Array of `[x: number, y: number]` arrays. | ||
*/ | ||
getNodePositionsArray(): [number, number][]; | ||
/** | ||
* Center and zoom in/out the view to fit all nodes in the scene. | ||
* @param duration Duration of the center and zoom in/out animation in milliseconds (`250` by default). | ||
*/ | ||
fitView(duration?: number): void; | ||
/** | ||
* Center and zoom in/out the view to fit nodes by their ids in the scene. | ||
* @param duration Duration of the center and zoom in/out animation in milliseconds (`250` by default). | ||
*/ | ||
fitViewByNodeIds(ids: string[], duration?: number): void; | ||
/** | ||
* Set focus on a node. A ring will be drawn around the focused node. | ||
@@ -89,2 +154,39 @@ * If no node is focused, the ring will be cleared. | ||
/** | ||
* Get nodes that are adjacent to a specific node by its id. | ||
* @param id Id of the node. | ||
* @returns Array of adjacent nodes. | ||
*/ | ||
getAdjacentNodes(id: string): N[] | undefined; | ||
/** | ||
* Converts the X and Y node coordinates from the space coordinate system to the screen coordinate system. | ||
* @param spacePosition Array of x and y coordinates in the space coordinate system. | ||
* @returns Array of x and y coordinates in the screen coordinate system. | ||
*/ | ||
spaceToScreenPosition(spacePosition: [number, number]): [number, number]; | ||
/** | ||
* Converts the node radius value from the space coordinate system to the screen coordinate system. | ||
* @param spaceRadius Radius of Node in the space coordinate system. | ||
* @returns Radius of Node in the screen coordinate system. | ||
*/ | ||
spaceToScreenRadius(spaceRadius: number): number; | ||
/** | ||
* Get node radius by its index. | ||
* @param index Index of the node. | ||
* @returns Radius of the node. | ||
*/ | ||
getNodeRadiusByIndex(index: number): number | undefined; | ||
/** | ||
* Get node radius by its id. | ||
* @param id Id of the node. | ||
* @returns Radius of the node. | ||
*/ | ||
getNodeRadiusById(id: string): number | undefined; | ||
/** | ||
* For the nodes that are currently visible on the screen, get a sample of node ids with their coordinates. | ||
* The resulting number of nodes will depend on the `nodeSamplingDistance` configuration property, | ||
* and the sampled nodes will be evenly distributed. | ||
* @returns A Map object where keys are the ids of the nodes and values are their corresponding X and Y coordinates in the [number, number] format. | ||
*/ | ||
getSampledNodePositionsMap(): Map<string, [number, number]>; | ||
/** | ||
* Starts the simulation. | ||
@@ -104,5 +206,17 @@ * @param alpha Value between 0 and 1. The higher the value, | ||
/** | ||
* Render only one frame of the simulation (stops the simulation if it was running). | ||
*/ | ||
step(): void; | ||
/** | ||
* Destroy the graph and clean up the context. | ||
*/ | ||
remove(): void; | ||
/** | ||
* Create new Cosmos instance. | ||
*/ | ||
create(): void; | ||
/** | ||
* Returns an array of nodes with their degree values in the order they were sent to Cosmograph. | ||
*/ | ||
getNodeDegrees(): number[]; | ||
private _createCosmosConfig; | ||
@@ -109,0 +223,0 @@ private _updateLabels; |
@@ -1,2 +0,2 @@ | ||
import{Graph as s}from"@cosmograph/cosmos";import{LabelRenderer as e,CssLabel as o}from"@interacta/css-labels";import{merge as t}from"@cosmograph/ui";import{color as i}from"d3-color";import{watermark as l}from"./watermark.js";import{addMetrics as n}from"../../api/supabase/supabase.js";import r from"./style.module.css.js";import{defaultCosmographConfig as a}from"./config.js";import{Crossfilter as d}from"./crossfilter.js";class h{constructor(i,n){var h;this._data={nodes:[],links:[]},this._previousData={nodes:[],links:[]},this._config={},this._nodesForTopLabels=new Set,this._nodesForForcedLabels=new Set,this._trackedNodeToLabel=new Map,this._isLabelsDestroyed=!1,this._svgParser=new DOMParser,this._nodesCrossfilter=new d(this._applyLinksFilter.bind(this)),this._linksCrossfilter=new d(this._applyNodesFilter.bind(this)),this._nodesFilter=this._nodesCrossfilter.addFilter(!1),this._linksFilter=this._linksCrossfilter.addFilter(!1),this._selectedNodesFilter=this._nodesCrossfilter.addFilter(),this._isDataDifferent=()=>{const s=JSON.stringify(this._data.nodes),e=JSON.stringify(this._previousData.nodes),o=JSON.stringify(this._data.links),t=JSON.stringify(this._previousData.links);return s!==e||o!==t},this._onClick=(...s)=>{var e,o;null===(o=(e=this._config).onClick)||void 0===o||o.call(e,...s)},this._onNodeMouseOver=(...s)=>{var e,o;null===(o=(e=this._config).onNodeMouseOver)||void 0===o||o.call(e,...s);const[t,,i]=s;this._renderLabelForHovered(t,i)},this._onNodeMouseOut=(...s)=>{var e,o;null===(o=(e=this._config).onNodeMouseOut)||void 0===o||o.call(e,...s),this._renderLabelForHovered()},this._onMouseMove=(...s)=>{var e,o;null===(o=(e=this._config).onMouseMove)||void 0===o||o.call(e,...s);const[t,,i]=s;this._renderLabelForHovered(t,i)},this._onZoomStart=(...s)=>{var e,o;null===(o=(e=this._config).onZoomStart)||void 0===o||o.call(e,...s)},this._onZoom=(...s)=>{var e,o;null===(o=(e=this._config).onZoom)||void 0===o||o.call(e,...s),this._renderLabelForHovered(),this._renderLabels()},this._onZoomEnd=(...s)=>{var e,o;null===(o=(e=this._config).onZoomEnd)||void 0===o||o.call(e,...s)},this._onStart=(...s)=>{var e,o;null===(o=(e=this._config).onSimulationStart)||void 0===o||o.call(e,...s)},this._onTick=(...s)=>{var e,o;null===(o=(e=this._config).onSimulationTick)||void 0===o||o.call(e,...s),this._renderLabels()},this._onEnd=(...s)=>{var e,o;null===(o=(e=this._config).onSimulationEnd)||void 0===o||o.call(e,...s)},this._onPause=(...s)=>{var e,o;null===(o=(e=this._config).onSimulationPause)||void 0===o||o.call(e,...s)},this._onRestart=(...s)=>{var e,o;null===(o=(e=this._config).onSimulationRestart)||void 0===o||o.call(e,...s)},this._containerNode=i,this._containerNode.classList.add(r.cosmograph),this._config=t(a,null!=n?n:{}),this._canvasElement=document.createElement("canvas"),this._labelsDivElement=document.createElement("div"),this._watermarkDivElement=document.createElement("div"),this._watermarkDivElement.classList.add(r.watermark),this._watermarkDivElement.onclick=()=>{var s;return null===(s=window.open("https://cosmograph.app/","_blank"))||void 0===s?void 0:s.focus()},i.appendChild(this._canvasElement),i.appendChild(this._labelsDivElement),i.appendChild(this._watermarkDivElement),this.cosmos=new s(this._canvasElement,this._createCosmosConfig(n)),this._linksFilter.setAccessor((s=>[s.source,s.target])),this._nodesFilter.setAccessor((s=>s.id)),this._selectedNodesFilter.setAccessor((s=>s.id)),this._nodesCrossfilter.onFiltered=()=>{var s,e;let o;this._nodesCrossfilter.isAnyFiltersActive()?(o=this._nodesCrossfilter.getFilteredRecords(),this.cosmos.selectNodesByIds(o.map((s=>s.id)))):this.cosmos.unselectNodes(),this._updateSelectedNodesSet(o),null===(e=(s=this._config).onNodesFiltered)||void 0===e||e.call(s,o)},this._linksCrossfilter.onFiltered=()=>{var s,e;let o;this._linksCrossfilter.isAnyFiltersActive()&&(o=this._linksCrossfilter.getFilteredRecords()),null===(e=(s=this._config).onLinksFiltered)||void 0===e||e.call(s,o)};const c=this._svgParser.parseFromString(l,"image/svg+xml").firstChild;null===(h=this._watermarkDivElement)||void 0===h||h.appendChild(c),this._cssLabelsRenderer=new e(this._labelsDivElement),this._hoveredCssLabel=new o(this._labelsDivElement)}get data(){return this._data}setData(s,e){var o,t,i,l;this._data={nodes:s,links:e},this.cosmos.setData(s,e),this._nodesCrossfilter.addRecords(s),this._linksCrossfilter.addRecords(e),this._updateLabels(),null===(t=(o=this._config).onSetData)||void 0===t||t.call(o,s,e),this._isDataDifferent()&&(["cosmograph.app"].includes(window.location.hostname)||n({browser:navigator.userAgent,hostname:window.location.hostname,mode:null,is_library_metric:!0,links_count:e.length,links_have_time:null,links_raw_columns:null!==(i=Object.keys(null==e?void 0:e[0]).length)&&void 0!==i?i:0,links_raw_lines:null,nodes_count:s.length,nodes_have_time:null,nodes_raw_columns:null!==(l=Object.keys(null==s?void 0:s[0]).length)&&void 0!==l?l:0,nodes_raw_lines:null})),this._previousData={nodes:s,links:e}}setConfig(s){var e;if(this._config=t(a,null!=s?s:{}),this.cosmos.setConfig(this._createCosmosConfig(s)),null==s?void 0:s.backgroundColor){const o=null===(e=i(null==s?void 0:s.backgroundColor))||void 0===e?void 0:e.formatHex();if(o){const s=this._checkBrightness(o),e=document.querySelector(":root");s>.65?null==e||e.style.setProperty("--cosmograph-watermark-color","#000000"):null==e||e.style.setProperty("--cosmograph-watermark-color","#ffffff")}}this._updateLabels()}addNodesFilter(){return this._nodesCrossfilter.addFilter()}addLinksFilter(){return this._linksCrossfilter.addFilter()}selectNodesInRange(s){var e;this.cosmos.selectNodesInRange(s);const o=new Set((null!==(e=this.cosmos.getSelectedNodes())&&void 0!==e?e:[]).map((s=>s.id)));this._selectedNodesFilter.applyFilter((s=>o.has(s)))}selectNodes(s){const e=new Set(s.map((s=>s.id)));this._selectedNodesFilter.applyFilter((s=>e.has(s)))}selectNode(s,e=!1){const o=new Set([s,...e&&this.cosmos.getAdjacentNodes(s.id)||[]].map((s=>s.id)));this._selectedNodesFilter.applyFilter((s=>o.has(s)))}unselectNodes(){this._selectedNodesFilter.clear()}zoomToNode(s){this.cosmos.zoomToNodeById(s.id)}focusNode(s){this.cosmos.setFocusedNodeById(null==s?void 0:s.id)}start(s=1){this.cosmos.start(s)}pause(){this.cosmos.pause()}restart(){this.cosmos.restart()}remove(){this.cosmos.destroy(),this._isLabelsDestroyed||(this._containerNode.innerHTML="",this._isLabelsDestroyed=!0,this._hoveredCssLabel.destroy(),this._cssLabelsRenderer.destroy())}_createCosmosConfig(s){return{...s,simulation:{...Object.keys(null!=s?s:{}).filter((s=>-1!==s.indexOf("simulation"))).reduce(((e,o)=>{const t=o.replace("simulation","");return e[t.charAt(0).toLowerCase()+t.slice(1)]=null==s?void 0:s[o],e}),{}),onStart:this._onStart.bind(this),onTick:this._onTick.bind(this),onEnd:this._onEnd.bind(this),onPause:this._onPause.bind(this),onRestart:this._onRestart.bind(this)},events:{onClick:this._onClick.bind(this),onNodeMouseOver:this._onNodeMouseOver.bind(this),onNodeMouseOut:this._onNodeMouseOut.bind(this),onMouseMove:this._onMouseMove.bind(this),onZoomStart:this._onZoomStart.bind(this),onZoom:this._onZoom.bind(this),onZoomEnd:this._onZoomEnd.bind(this)}}}_updateLabels(){if(this._isLabelsDestroyed)return;const{data:{nodes:s},_config:{showTopLabels:e,showTopLabelsLimit:o,showLabelsFor:t,showTopLabelsValueKey:i,nodeLabelAccessor:l}}=this;if(this._nodesForTopLabels.clear(),e&&o){let e;e=i?[...s].sort(((s,e)=>{const o=s[i],t=e[i];return"number"==typeof o&&"number"==typeof t?t-o:0})):Object.entries(this.cosmos.graph.degree).sort(((s,e)=>e[1]-s[1])).slice(0,o).map((s=>this.cosmos.graph.getNodeByIndex(+s[0])));for(let t=0;t<o&&!(t>=s.length);t++){const s=e[t];s&&this._nodesForTopLabels.add(s)}}this._nodesForForcedLabels.clear(),null==t||t.forEach(this._nodesForForcedLabels.add,this._nodesForForcedLabels),this._trackedNodeToLabel.clear(),this.cosmos.trackNodePositionsByIds([...e?this._nodesForTopLabels:[],...this._nodesForForcedLabels].map((s=>{var e;return this._trackedNodeToLabel.set(s,null!==(e=null==l?void 0:l(s))&&void 0!==e?e:s.id),s.id}))),this._renderLabels()}_updateSelectedNodesSet(s){this._isLabelsDestroyed||(s?(this._selectedNodesSet=new Set,null==s||s.forEach(this._selectedNodesSet.add,this._selectedNodesSet)):this._selectedNodesSet=void 0,this._renderLabels())}_renderLabels(){if(this._isLabelsDestroyed)return;const{_selectedNodesSet:s,_config:{showDynamicLabels:e,nodeLabelAccessor:o,nodeLabelColor:t,nodeLabelClassName:i}}=this;let l=[];const n=this.cosmos.getTrackedNodePositionsMap(),a=new Map;if(e){this.cosmos.getSampledNodePositionsMap().forEach(((s,e)=>{var t;const i=this.cosmos.graph.getNodeById(e);i&&a.set(i,[null!==(t=null==o?void 0:o(i))&&void 0!==t?t:i.id,s,r.cosmographShowDynamicLabels,.7])}))}this._nodesForTopLabels.forEach((s=>{a.set(s,[this._trackedNodeToLabel.get(s),n.get(s.id),r.cosmographShowTopLabels,.9])})),this._nodesForForcedLabels.forEach((s=>{a.set(s,[this._trackedNodeToLabel.get(s),n.get(s.id),r.cosmographShowLabelsFor,1])})),l=[...a.entries()].map((([e,[o,l,n,r]])=>{var a,d,h;const c=this.cosmos.spaceToScreenPosition([null!==(a=null==l?void 0:l[0])&&void 0!==a?a:0,null!==(d=null==l?void 0:l[1])&&void 0!==d?d:0]),_=this.cosmos.spaceToScreenRadius(this.cosmos.config.nodeSizeScale*this.cosmos.getNodeRadiusById(e.id)),u=!!s,m=null==s?void 0:s.has(e);return{id:e.id,text:null!=o?o:"",x:c[0],y:c[1]-(_+2),weight:u&&!m?.1:r,shouldBeShown:this._nodesForForcedLabels.has(e),style:u&&!m?"opacity: 0.1;":"",color:t&&("string"==typeof t?t:null==t?void 0:t(e)),className:null!==(h="string"==typeof i?i:null==i?void 0:i(e))&&void 0!==h?h:n}})),this._cssLabelsRenderer.setLabels(l),this._cssLabelsRenderer.draw(!0)}_renderLabelForHovered(s,e){var o,t;const{_config:{showHoveredNodeLabel:i,nodeLabelAccessor:l,hoveredNodeLabelClassName:n,hoveredNodeLabelColor:r}}=this;if(!this._isLabelsDestroyed){if(i&&s&&e){const i=this.cosmos.spaceToScreenPosition(e),a=this.cosmos.spaceToScreenRadius(this.cosmos.getNodeRadiusById(s.id));this._hoveredCssLabel.setText(null!==(o=null==l?void 0:l(s))&&void 0!==o?o:s.id),this._hoveredCssLabel.setVisibility(!0),this._hoveredCssLabel.setPosition(i[0],i[1]-(a+2)),this._hoveredCssLabel.setClassName("string"==typeof n?n:null!==(t=null==n?void 0:n(s))&&void 0!==t?t:""),this._hoveredCssLabel.setColor(r&&("string"==typeof r?r:null==r?void 0:r(s)))}else this._hoveredCssLabel.setVisibility(!1);this._hoveredCssLabel.draw()}}_applyLinksFilter(){if(this._nodesCrossfilter.isAnyFiltersActive(this._nodesFilter)){const s=this._nodesCrossfilter.getFilteredRecords(this._nodesFilter),e=new Set(s.map((s=>s.id)));this._linksFilter.applyFilter((s=>{const o=null==s?void 0:s[0],t=null==s?void 0:s[1];return e.has(o)&&e.has(t)}))}else this._linksFilter.clear()}_applyNodesFilter(){if(this._linksCrossfilter.isAnyFiltersActive(this._linksFilter)){const s=this._linksCrossfilter.getFilteredRecords(this._linksFilter),e=new Set(s.map((s=>[s.source,s.target])).flat());this._nodesFilter.applyFilter((s=>e.has(s)))}else this._nodesFilter.clear()}_checkBrightness(s){const e=(s=>{const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(s);return e?{r:parseInt((e[1]||0).toString(),16),g:parseInt((e[2]||0).toString(),16),b:parseInt((e[3]||0).toString(),16)}:{r:0,g:0,b:0}})(s);return(.2126*e.r+.7152*e.g+.0722*e.b)/255}}export{h as Cosmograph}; | ||
import{Graph as e}from"@cosmograph/cosmos";import{LabelRenderer as s,CssLabel as o}from"@interacta/css-labels";import{merge as t}from"@cosmograph/ui";import{color as i}from"d3-color";import{watermark as r}from"./watermark.js";import{addMetrics as n}from"../../api/supabase/supabase.js";import l from"./style.module.css.js";import{defaultCosmographConfig as d}from"./config.js";import{Crossfilter as a}from"./crossfilter.js";class h{constructor(i,n){var h;this._data={nodes:[],links:[]},this._previousData={nodes:[],links:[]},this._config={},this._nodesForTopLabels=new Set,this._nodesForForcedLabels=new Set,this._trackedNodeToLabel=new Map,this._isLabelsDestroyed=!1,this._svgParser=new DOMParser,this._nodesCrossfilter=new a(this._applyLinksFilter.bind(this)),this._linksCrossfilter=new a(this._applyNodesFilter.bind(this)),this._nodesFilter=this._nodesCrossfilter.addFilter(!1),this._linksFilter=this._linksCrossfilter.addFilter(!1),this._selectedNodesFilter=this._nodesCrossfilter.addFilter(),this._isDataDifferent=()=>{const e=JSON.stringify(this._data.nodes),s=JSON.stringify(this._previousData.nodes),o=JSON.stringify(this._data.links),t=JSON.stringify(this._previousData.links);return e!==s||o!==t},this._onClick=(...e)=>{var s,o;null===(o=(s=this._config).onClick)||void 0===o||o.call(s,...e)},this._onNodeMouseOver=(...e)=>{var s,o;null===(o=(s=this._config).onNodeMouseOver)||void 0===o||o.call(s,...e);const[t,,i]=e;this._renderLabelForHovered(t,i)},this._onNodeMouseOut=(...e)=>{var s,o;null===(o=(s=this._config).onNodeMouseOut)||void 0===o||o.call(s,...e),this._renderLabelForHovered()},this._onMouseMove=(...e)=>{var s,o;null===(o=(s=this._config).onMouseMove)||void 0===o||o.call(s,...e);const[t,,i]=e;this._renderLabelForHovered(t,i)},this._onZoomStart=(...e)=>{var s,o;null===(o=(s=this._config).onZoomStart)||void 0===o||o.call(s,...e)},this._onZoom=(...e)=>{var s,o;null===(o=(s=this._config).onZoom)||void 0===o||o.call(s,...e),this._renderLabelForHovered(),this._renderLabels()},this._onZoomEnd=(...e)=>{var s,o;null===(o=(s=this._config).onZoomEnd)||void 0===o||o.call(s,...e)},this._onStart=(...e)=>{var s,o;null===(o=(s=this._config).onSimulationStart)||void 0===o||o.call(s,...e)},this._onTick=(...e)=>{var s,o;null===(o=(s=this._config).onSimulationTick)||void 0===o||o.call(s,...e),this._renderLabels()},this._onEnd=(...e)=>{var s,o;null===(o=(s=this._config).onSimulationEnd)||void 0===o||o.call(s,...e)},this._onPause=(...e)=>{var s,o;null===(o=(s=this._config).onSimulationPause)||void 0===o||o.call(s,...e)},this._onRestart=(...e)=>{var s,o;null===(o=(s=this._config).onSimulationRestart)||void 0===o||o.call(s,...e)},this._containerNode=i,this._containerNode.classList.add(l.cosmograph),this._config=t(d,null!=n?n:{}),this._canvasElement=document.createElement("canvas"),this._labelsDivElement=document.createElement("div"),this._watermarkDivElement=document.createElement("div"),this._watermarkDivElement.classList.add(l.watermark),this._watermarkDivElement.onclick=()=>{var e;return null===(e=window.open("https://cosmograph.app/","_blank"))||void 0===e?void 0:e.focus()},i.appendChild(this._canvasElement),i.appendChild(this._labelsDivElement),i.appendChild(this._watermarkDivElement),this._cosmos=new e(this._canvasElement,this._createCosmosConfig(n)),this.cosmos=this._cosmos,this._linksFilter.setAccessor((e=>[e.source,e.target])),this._nodesFilter.setAccessor((e=>e.id)),this._selectedNodesFilter.setAccessor((e=>e.id)),this._nodesCrossfilter.onFiltered=()=>{var e,s;let o;this._nodesCrossfilter.isAnyFiltersActive()?(o=this._nodesCrossfilter.getFilteredRecords(),this._cosmos.selectNodesByIds(o.map((e=>e.id)))):this._cosmos.unselectNodes(),this._updateSelectedNodesSet(o),null===(s=(e=this._config).onNodesFiltered)||void 0===s||s.call(e,o)},this._linksCrossfilter.onFiltered=()=>{var e,s;let o;this._linksCrossfilter.isAnyFiltersActive()&&(o=this._linksCrossfilter.getFilteredRecords()),null===(s=(e=this._config).onLinksFiltered)||void 0===s||s.call(e,o)};const c=this._svgParser.parseFromString(r,"image/svg+xml").firstChild;null===(h=this._watermarkDivElement)||void 0===h||h.appendChild(c),this._cssLabelsRenderer=new s(this._labelsDivElement),this._hoveredCssLabel=new o(this._labelsDivElement)}get data(){return this._data}get progress(){return this._cosmos.progress}get isSimulationRunning(){return this._cosmos.isSimulationRunning}get maxPointSize(){return this._cosmos.maxPointSize}setData(e,s){var o,t,i,r;this._data={nodes:e,links:s},this._cosmos.setData(e,s),this._nodesCrossfilter.addRecords(e),this._linksCrossfilter.addRecords(s),this._updateLabels(),null===(t=(o=this._config).onSetData)||void 0===t||t.call(o,e,s),this._isDataDifferent()&&(["cosmograph.app"].includes(window.location.hostname)||n({browser:navigator.userAgent,hostname:window.location.hostname,mode:null,is_library_metric:!0,links_count:s.length,links_have_time:null,links_raw_columns:null!==(i=Object.keys(null==s?void 0:s[0]).length)&&void 0!==i?i:0,links_raw_lines:null,nodes_count:e.length,nodes_have_time:null,nodes_raw_columns:null!==(r=Object.keys(null==e?void 0:e[0]).length)&&void 0!==r?r:0,nodes_raw_lines:null})),this._previousData={nodes:e,links:s}}setConfig(e){var s;if(this._config=t(d,null!=e?e:{}),this._cosmos.setConfig(this._createCosmosConfig(e)),null==e?void 0:e.backgroundColor){const o=null===(s=i(null==e?void 0:e.backgroundColor))||void 0===s?void 0:s.formatHex();if(o){const e=this._checkBrightness(o),s=document.querySelector(":root");e>.65?null==s||s.style.setProperty("--cosmograph-watermark-color","#000000"):null==s||s.style.setProperty("--cosmograph-watermark-color","#ffffff")}}this._updateLabels()}addNodesFilter(){return this._nodesCrossfilter.addFilter()}addLinksFilter(){return this._linksCrossfilter.addFilter()}selectNodesInRange(e){var s;this._cosmos.selectNodesInRange(e);const o=new Set((null!==(s=this.getSelectedNodes())&&void 0!==s?s:[]).map((e=>e.id)));this._selectedNodesFilter.applyFilter((e=>o.has(e)))}selectNodes(e){const s=new Set(e.map((e=>e.id)));this._selectedNodesFilter.applyFilter((e=>s.has(e)))}selectNode(e,s=!1){const o=new Set([e,...s&&this._cosmos.getAdjacentNodes(e.id)||[]].map((e=>e.id)));this._selectedNodesFilter.applyFilter((e=>o.has(e)))}unselectNodes(){this._selectedNodesFilter.clear()}getSelectedNodes(){return this._cosmos.getSelectedNodes()}zoomToNode(e){this._cosmos.zoomToNodeById(e.id)}setZoomLevel(e,s=0){this._cosmos.setZoomLevel(e,s)}getZoomLevel(){return this._cosmos.getZoomLevel()}getNodePositions(){return this._cosmos.getNodePositions()}getNodePositionsMap(){return this._cosmos.getNodePositionsMap()}getNodePositionsArray(){return this._cosmos.getNodePositionsArray()}fitView(e=250){this._cosmos.fitView(e)}fitViewByNodeIds(e,s=250){this._cosmos.fitViewByNodeIds(e,s)}focusNode(e){this._cosmos.setFocusedNodeById(null==e?void 0:e.id)}getAdjacentNodes(e){return this._cosmos.getAdjacentNodes(e)}spaceToScreenPosition(e){return this._cosmos.spaceToScreenPosition(e)}spaceToScreenRadius(e){return this._cosmos.spaceToScreenRadius(e)}getNodeRadiusByIndex(e){return this._cosmos.getNodeRadiusByIndex(e)}getNodeRadiusById(e){return this._cosmos.getNodeRadiusById(e)}getSampledNodePositionsMap(){return this._cosmos.getSampledNodePositionsMap()}start(e=1){this._cosmos.start(e)}pause(){this._cosmos.pause()}restart(){this._cosmos.restart()}step(){this._cosmos.step()}remove(){this._cosmos.destroy(),this._isLabelsDestroyed||(this._containerNode.innerHTML="",this._isLabelsDestroyed=!0,this._hoveredCssLabel.destroy(),this._cssLabelsRenderer.destroy())}create(){this._cosmos.create()}getNodeDegrees(){return this._cosmos.graph.degree}_createCosmosConfig(e){return{...e,simulation:{...Object.keys(null!=e?e:{}).filter((e=>-1!==e.indexOf("simulation"))).reduce(((s,o)=>{const t=o.replace("simulation","");return s[t.charAt(0).toLowerCase()+t.slice(1)]=null==e?void 0:e[o],s}),{}),onStart:this._onStart.bind(this),onTick:this._onTick.bind(this),onEnd:this._onEnd.bind(this),onPause:this._onPause.bind(this),onRestart:this._onRestart.bind(this)},events:{onClick:this._onClick.bind(this),onNodeMouseOver:this._onNodeMouseOver.bind(this),onNodeMouseOut:this._onNodeMouseOut.bind(this),onMouseMove:this._onMouseMove.bind(this),onZoomStart:this._onZoomStart.bind(this),onZoom:this._onZoom.bind(this),onZoomEnd:this._onZoomEnd.bind(this)}}}_updateLabels(){if(this._isLabelsDestroyed)return;const{data:{nodes:e},_config:{showTopLabels:s,showTopLabelsLimit:o,showLabelsFor:t,showTopLabelsValueKey:i,nodeLabelAccessor:r}}=this;if(this._nodesForTopLabels.clear(),s&&o){let s;s=i?[...e].sort(((e,s)=>{const o=e[i],t=s[i];return"number"==typeof o&&"number"==typeof t?t-o:0})):Object.entries(this._cosmos.graph.degree).sort(((e,s)=>s[1]-e[1])).slice(0,o).map((e=>this._cosmos.graph.getNodeByIndex(+e[0])));for(let t=0;t<o&&!(t>=e.length);t++){const e=s[t];e&&this._nodesForTopLabels.add(e)}}this._nodesForForcedLabels.clear(),null==t||t.forEach(this._nodesForForcedLabels.add,this._nodesForForcedLabels),this._trackedNodeToLabel.clear(),this._cosmos.trackNodePositionsByIds([...s?this._nodesForTopLabels:[],...this._nodesForForcedLabels].map((e=>{var s;return this._trackedNodeToLabel.set(e,null!==(s=null==r?void 0:r(e))&&void 0!==s?s:e.id),e.id}))),this._renderLabels()}_updateSelectedNodesSet(e){this._isLabelsDestroyed||(e?(this._selectedNodesSet=new Set,null==e||e.forEach(this._selectedNodesSet.add,this._selectedNodesSet)):this._selectedNodesSet=void 0,this._renderLabels())}_renderLabels(){if(this._isLabelsDestroyed)return;const{_selectedNodesSet:e,_config:{showDynamicLabels:s,nodeLabelAccessor:o,nodeLabelColor:t,nodeLabelClassName:i}}=this;let r=[];const n=this._cosmos.getTrackedNodePositionsMap(),d=new Map;if(s){this.getSampledNodePositionsMap().forEach(((e,s)=>{var t;const i=this._cosmos.graph.getNodeById(s);i&&d.set(i,[null!==(t=null==o?void 0:o(i))&&void 0!==t?t:i.id,e,l.cosmographShowDynamicLabels,.7])}))}this._nodesForTopLabels.forEach((e=>{d.set(e,[this._trackedNodeToLabel.get(e),n.get(e.id),l.cosmographShowTopLabels,.9])})),this._nodesForForcedLabels.forEach((e=>{d.set(e,[this._trackedNodeToLabel.get(e),n.get(e.id),l.cosmographShowLabelsFor,1])})),r=[...d.entries()].map((([s,[o,r,n,l]])=>{var d,a,h;const c=this.spaceToScreenPosition([null!==(d=null==r?void 0:r[0])&&void 0!==d?d:0,null!==(a=null==r?void 0:r[1])&&void 0!==a?a:0]),_=this.spaceToScreenRadius(this._cosmos.config.nodeSizeScale*this.getNodeRadiusById(s.id)),u=!!e,m=null==e?void 0:e.has(s);return{id:s.id,text:null!=o?o:"",x:c[0],y:c[1]-(_+2),weight:u&&!m?.1:l,shouldBeShown:this._nodesForForcedLabels.has(s),style:u&&!m?"opacity: 0.1;":"",color:t&&("string"==typeof t?t:null==t?void 0:t(s)),className:null!==(h="string"==typeof i?i:null==i?void 0:i(s))&&void 0!==h?h:n}})),this._cssLabelsRenderer.setLabels(r),this._cssLabelsRenderer.draw(!0)}_renderLabelForHovered(e,s){var o,t;const{_config:{showHoveredNodeLabel:i,nodeLabelAccessor:r,hoveredNodeLabelClassName:n,hoveredNodeLabelColor:l}}=this;if(!this._isLabelsDestroyed){if(i&&e&&s){const i=this.spaceToScreenPosition(s),d=this.spaceToScreenRadius(this.getNodeRadiusById(e.id));this._hoveredCssLabel.setText(null!==(o=null==r?void 0:r(e))&&void 0!==o?o:e.id),this._hoveredCssLabel.setVisibility(!0),this._hoveredCssLabel.setPosition(i[0],i[1]-(d+2)),this._hoveredCssLabel.setClassName("string"==typeof n?n:null!==(t=null==n?void 0:n(e))&&void 0!==t?t:""),this._hoveredCssLabel.setColor(l&&("string"==typeof l?l:null==l?void 0:l(e)))}else this._hoveredCssLabel.setVisibility(!1);this._hoveredCssLabel.draw()}}_applyLinksFilter(){if(this._nodesCrossfilter.isAnyFiltersActive(this._nodesFilter)){const e=this._nodesCrossfilter.getFilteredRecords(this._nodesFilter),s=new Set(e.map((e=>e.id)));this._linksFilter.applyFilter((e=>{const o=null==e?void 0:e[0],t=null==e?void 0:e[1];return s.has(o)&&s.has(t)}))}else this._linksFilter.clear()}_applyNodesFilter(){if(this._linksCrossfilter.isAnyFiltersActive(this._linksFilter)){const e=this._linksCrossfilter.getFilteredRecords(this._linksFilter),s=new Set(e.map((e=>[e.source,e.target])).flat());this._nodesFilter.applyFilter((e=>s.has(e)))}else this._nodesFilter.clear()}_checkBrightness(e){const s=(e=>{const s=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return s?{r:parseInt((s[1]||0).toString(),16),g:parseInt((s[2]||0).toString(),16),b:parseInt((s[3]||0).toString(),16)}:{r:0,g:0,b:0}})(e);return(.2126*s.r+.7152*s.g+.0722*s.b)/255}}export{h as Cosmograph}; | ||
//# sourceMappingURL=index.js.map |
@@ -1,2 +0,2 @@ | ||
import{merge as s,Search as t}from"@cosmograph/ui";import{defaultCosmographSearchConfig as e}from"./config.js";class o{constructor(o,i,c){this._config={},this._data=[],this._defaultAccessors=[],this._createDefaultAccessorOptions=s=>s.length>0&&s[0]?Object.keys(s[0]).map((s=>({label:s,accessor:t=>String(t[s])}))):[{label:"id",accessor:s=>s.id}],this._onSelect=(...s)=>{this._onSelectResult(...s)},this._onSearch=(...s)=>{var t,e;null===(e=(t=this._config).onSearch)||void 0===e||e.call(t,...s)},this._onEnter=(...s)=>{var t,e;null===(e=(t=this._config).onEnter)||void 0===e||e.call(t,...s)},this._onAccessorSelect=(...s)=>{var t,e;null===(e=(t=this._config).onAccessorSelect)||void 0===e||e.call(t,...s)},this._cosmograph=o,this._config=s(e,null!=c?c:{}),this.search=new t(i,this._createSearchConfig(c)),this._filter=this._cosmograph.addNodesFilter(),this._filter.onDataAdded=()=>{this._updateData()},this._updateData()}setConfig(t){const o=s(e,null!=t?t:{});this._data.length&&void 0===o.accessors&&(o.accessors=this._defaultAccessors),this.search.setConfig(this._createSearchConfig(o)),this._config=o}_updateData(){const s=this._cosmograph.data.nodes;(null==s?void 0:s.length)&&(this._data=s,this.search.setData(this._data),void 0===this._config.accessors&&(this._defaultAccessors=this._createDefaultAccessorOptions(this._data),this.setConfig({accessors:this._defaultAccessors})))}getConfig(){return this._config}remove(){this.search.destroy()}setListState(s){this.search.setListState(s)}clearInput(){this.search.clearInput()}_onSelectResult(s){var t,e;this._cosmograph.cosmos.pause(),this._cosmograph.zoomToNode(s),this._cosmograph.selectNode(s),null===(e=(t=this._config).onSelectResult)||void 0===e||e.call(t,s)}_createSearchConfig(s){return{...s,events:{onSelect:this._onSelect.bind(this),onSearch:this._onSearch.bind(this),onEnter:this._onEnter.bind(this),onAccessorSelect:this._onAccessorSelect.bind(this)}}}}export{o as CosmographSearch}; | ||
import{merge as s,Search as t}from"@cosmograph/ui";import{defaultCosmographSearchConfig as e}from"./config.js";class i{constructor(i,o,c){this._config={},this._data=[],this._defaultAccessors=[],this._createDefaultAccessorOptions=s=>s.length>0&&s[0]?Object.keys(s[0]).map((s=>({label:s,accessor:t=>String(t[s])}))):[{label:"id",accessor:s=>s.id}],this._onSelect=(...s)=>{this._onSelectResult(...s)},this._onSearch=(...s)=>{var t,e;null===(e=(t=this._config).onSearch)||void 0===e||e.call(t,...s)},this._onEnter=(...s)=>{var t,e;null===(e=(t=this._config).onEnter)||void 0===e||e.call(t,...s)},this._onAccessorSelect=(...s)=>{var t,e;null===(e=(t=this._config).onAccessorSelect)||void 0===e||e.call(t,...s)},this._cosmograph=i,this._config=s(e,null!=c?c:{}),this.search=new t(o,this._createSearchConfig(c)),this._filter=this._cosmograph.addNodesFilter(),this._filter.onDataAdded=()=>{this._updateData()},this._updateData()}setConfig(t){const i=s(e,null!=t?t:{});this._data.length&&void 0===i.accessors&&(i.accessors=this._defaultAccessors),this.search.setConfig(this._createSearchConfig(i)),this._config=i}_updateData(){const s=this._cosmograph.data.nodes;(null==s?void 0:s.length)&&(this._data=s,this.search.setData(this._data),void 0===this._config.accessors&&(this._defaultAccessors=this._createDefaultAccessorOptions(this._data),this.setConfig({accessors:this._defaultAccessors})))}getConfig(){return this._config}remove(){this.search.destroy()}setListState(s){this.search.setListState(s)}clearInput(){this.search.clearInput()}_onSelectResult(s){var t,e;this._cosmograph.pause(),this._cosmograph.zoomToNode(s),this._cosmograph.selectNode(s),null===(e=(t=this._config).onSelectResult)||void 0===e||e.call(t,s)}_createSearchConfig(s){return{...s,events:{onSelect:this._onSelect.bind(this),onSearch:this._onSearch.bind(this),onEnter:this._onEnter.bind(this),onAccessorSelect:this._onAccessorSelect.bind(this)}}}}export{i as CosmographSearch}; | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "@cosmograph/cosmograph", | ||
"version": "1.0.0", | ||
"version": "1.1.0", | ||
"description": "Cosmograph: The fastest web-based graph visualization library", | ||
@@ -12,3 +12,3 @@ "author": "cosmograph-org", | ||
"@cosmograph/cosmos": "1.5.0-beta.0", | ||
"@cosmograph/ui": "1.0.0", | ||
"@cosmograph/ui": "1.1.0", | ||
"@interacta/css-labels": "^0.0.11", | ||
@@ -15,0 +15,0 @@ "@supabase/supabase-js": "^2.38.4", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
203900
864
+ Added@cosmograph/ui@1.1.0(transitive)
- Removed@cosmograph/ui@1.0.0(transitive)
Updated@cosmograph/ui@1.1.0