Skip to content

Commit f019974

Browse files
michabaurmichabaur
committed
yFiles for HTML 2.6.0.3 demos
1 parent 84208e2 commit f019974

File tree

1,656 files changed

+17750
-9166
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

1,656 files changed

+17750
-9166
lines changed

‎demos/.prettierignore‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@
22
**/dist/
33
**/node_modules/
44
/application-features/webgl-rendering/resources/*.json
5-
/showcase/tree-of-life/resources/TreeOfLifeData.json
5+
/showcase/large-graphs/resources/*.json
66
/internal/webgl-performance-tests/resources/*.json
7+
/showcase/tree-of-life/resources/TreeOfLifeData.json
78
/starter-kits/**
89
/view/large-graphs/resources/*.json
910
/view/rendering-optimizations/resources/*.json
11+
/view/webgl-label-fading/resources/hierarchic_2000_2100.json

‎demos/.prettierrc.json‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,9 @@
11
{
22
"printWidth": 100,
3-
"tabWidth": 2,
4-
"endOfLine": "auto",
5-
"useTabs": false,
63
"semi": false,
74
"singleQuote": true,
8-
"bracketSpacing": true,
95
"trailingComma": "none",
10-
"arrowParens": "avoid",
6+
"endOfLine": "auto",
117
"overrides": [
128
{
139
"files": ["tutorial-*/**/*.ts"],

‎demos/README.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
@@ -107,7 +107,7 @@ <h2>Your browser does not support modern CSS</h2>
107107
<div class="content-wide">
108108
<div id="general-intro">
109109
<p class="first-paragraph">
110-
The <a href="https://www.yworks.com/products/yfiles-for-html">yFiles for HTML 2.6.0.2</a> demo applications are available in
110+
The <a href="https://www.yworks.com/products/yfiles-for-html">yFiles for HTML 2.6.0.3</a> demo applications are available in
111111
both JavaScript and TypeScript.
112112
<span class="js-only"
113113
>Show <a href="../demos-ts/README.html">TypeScript Demos</a>.</span

‎demos/analysis/clustering/ClusteringDemo.js‎

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -276,7 +276,7 @@ function configureUserInteraction(graphComponent) {
276276
*/
277277
function configureDendrogramComponent(dendrogramComponent) {
278278
// add a dragging listener to run the hierarchical algorithm when the dragging of the cutoff line has finished
279-
dendrogramComponent.addDragFinishedListener(cutOffValue => {
279+
dendrogramComponent.addDragFinishedListener((cutOffValue) => {
280280
removeClusterVisuals()
281281
runHierarchicalClustering(cutOffValue)
282282
})
@@ -474,7 +474,7 @@ function visualizeClusteringResult() {
474474

475475
// creates a map the holds for each cluster id, the list of nodes that belong to the particular cluster
476476
const clustering = new Map()
477-
graph.nodes.forEach(node => {
477+
graph.nodes.forEach((node) => {
478478
let clusterId = result.nodeClusterIds.get(node)
479479
// biconnected components returns -1 as cluster id when only one node is present.
480480
// We change the clusterId manually here, as otherwise we'll get an exception in
@@ -592,7 +592,7 @@ function loadGraph(sampleData) {
592592
{
593593
data: sampleData.nodes,
594594
id: 'id',
595-
layout: data => new Rect(data.x, data.y, data.w, data.h),
595+
layout: (data) => new Rect(data.x, data.y, data.w, data.h),
596596
labels: ['label']
597597
}
598598
],
@@ -623,10 +623,10 @@ function initializeUI() {
623623

624624
// edge-betweenness menu
625625
const minInput = document.querySelector(`#ebMinClusterNumber`)
626-
minInput.addEventListener('change', _ => {
626+
minInput.addEventListener('change', (_) => {
627627
const value = parseFloat(minInput.value)
628628
const maximumClusterNumber = parseFloat(document.querySelector(`#ebMaxClusterNumber`).value)
629-
if (isNaN(value) || value < 1) {
629+
if (Number.isNaN(value) || value < 1) {
630630
alert('Number of clusters should be non-negative.')
631631
minInput.value = '1'
632632
return
@@ -647,10 +647,10 @@ function initializeUI() {
647647
})
648648

649649
const maxInput = document.querySelector(`#ebMaxClusterNumber`)
650-
maxInput.addEventListener('change', _ => {
650+
maxInput.addEventListener('change', (_) => {
651651
const value = parseFloat(maxInput.value)
652652
const minimumClusterNumber = parseFloat(document.querySelector(`#ebMinClusterNumber`).value)
653-
if (isNaN(value) || value < minimumClusterNumber || minimumClusterNumber < 1) {
653+
if (Number.isNaN(value) || value < minimumClusterNumber || minimumClusterNumber < 1) {
654654
const message =
655655
value < minimumClusterNumber
656656
? 'Desired maximum number of clusters cannot be smaller than the desired minimum number of clusters.'
@@ -665,7 +665,7 @@ function initializeUI() {
665665
const considerEdgeDirection = document.querySelector(`#directed`)
666666
considerEdgeDirection.addEventListener('click', () => {
667667
const isChecked = considerEdgeDirection.checked
668-
graph.edges.forEach(edge => {
668+
graph.edges.forEach((edge) => {
669669
graph.setStyle(edge, isChecked ? directedEdgeStyle : graph.edgeDefaults.style)
670670
})
671671

@@ -674,7 +674,7 @@ function initializeUI() {
674674

675675
const considerEdgeCosts = document.querySelector(`#edgeCosts`)
676676
considerEdgeCosts.addEventListener('click', () => {
677-
graph.edges.forEach(edge => {
677+
graph.edges.forEach((edge) => {
678678
if (considerEdgeCosts.checked) {
679679
const edgeCost = Math.floor(Math.random() * 200 + 1)
680680
if (edge.labels.size > 0) {
@@ -683,7 +683,7 @@ function initializeUI() {
683683
graph.addLabel(edge, `${edgeCost}`)
684684
}
685685
} else {
686-
edge.labels.toArray().forEach(label => {
686+
edge.labels.toArray().forEach((label) => {
687687
graph.remove(label)
688688
})
689689
}
@@ -695,19 +695,19 @@ function initializeUI() {
695695
const distanceCombobox = document.querySelector(`#distance-metrics`)
696696
distanceCombobox.addEventListener('change', runAlgorithm)
697697
const kMeansInput = document.querySelector(`#kMeansMaxClusterNumber`)
698-
kMeansInput.addEventListener('change', _ => {
698+
kMeansInput.addEventListener('change', (_) => {
699699
const value = parseFloat(kMeansInput.value)
700-
if (isNaN(value) || value < 1) {
700+
if (Number.isNaN(value) || value < 1) {
701701
alert('Desired maximum number of clusters should be greater than zero.')
702702
kMeansInput.value = '1'
703703
return
704704
}
705705
runAlgorithm()
706706
})
707707
const iterationInput = document.querySelector(`#iterations`)
708-
iterationInput.addEventListener('change', _ => {
708+
iterationInput.addEventListener('change', (_) => {
709709
const value = parseFloat(iterationInput.value)
710-
if (isNaN(value) || value < 0) {
710+
if (Number.isNaN(value) || value < 0) {
711711
alert('Desired maximum number of iterations should be non-negative.')
712712
iterationInput.value = '0'
713713
return
@@ -748,7 +748,7 @@ function getEdgeWeight(edge) {
748748
if (edge.labels.size > 0) {
749749
// ...try to return its value
750750
const edgeWeight = parseFloat(edge.labels.first().text)
751-
if (!isNaN(edgeWeight)) {
751+
if (!Number.isNaN(edgeWeight)) {
752752
return edgeWeight > 0 ? edgeWeight : 1
753753
}
754754
}

‎demos/analysis/clustering/ClusteringDemo.ts‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -270,7 +270,7 @@ function configureUserInteraction(graphComponent: GraphComponent): void {
270270
*/
271271
function configureDendrogramComponent(dendrogramComponent: DendrogramComponent): void {
272272
// add a dragging listener to run the hierarchical algorithm when the dragging of the cutoff line has finished
273-
dendrogramComponent.addDragFinishedListener(cutOffValue => {
273+
dendrogramComponent.addDragFinishedListener((cutOffValue) => {
274274
removeClusterVisuals()
275275
runHierarchicalClustering(cutOffValue)
276276
})
@@ -473,7 +473,7 @@ function visualizeClusteringResult(): void {
473473

474474
// creates a map the holds for each cluster id, the list of nodes that belong to the particular cluster
475475
const clustering = new Map<number, IRectangle[]>()
476-
graph.nodes.forEach(node => {
476+
graph.nodes.forEach((node) => {
477477
let clusterId: number = result.nodeClusterIds.get(node)!
478478
// biconnected components returns -1 as cluster id when only one node is present.
479479
// We change the clusterId manually here, as otherwise we'll get an exception in
@@ -622,12 +622,12 @@ function initializeUI(): void {
622622

623623
// edge-betweenness menu
624624
const minInput = document.querySelector<HTMLInputElement>(`#ebMinClusterNumber`)!
625-
minInput.addEventListener('change', _ => {
625+
minInput.addEventListener('change', (_) => {
626626
const value = parseFloat(minInput.value)
627627
const maximumClusterNumber = parseFloat(
628628
document.querySelector<HTMLInputElement>(`#ebMaxClusterNumber`)!.value
629629
)
630-
if (isNaN(value) || value < 1) {
630+
if (Number.isNaN(value) || value < 1) {
631631
alert('Number of clusters should be non-negative.')
632632
minInput.value = '1'
633633
return
@@ -648,12 +648,12 @@ function initializeUI(): void {
648648
})
649649

650650
const maxInput = document.querySelector<HTMLInputElement>(`#ebMaxClusterNumber`)!
651-
maxInput.addEventListener('change', _ => {
651+
maxInput.addEventListener('change', (_) => {
652652
const value = parseFloat(maxInput.value)
653653
const minimumClusterNumber = parseFloat(
654654
document.querySelector<HTMLInputElement>(`#ebMinClusterNumber`)!.value
655655
)
656-
if (isNaN(value) || value < minimumClusterNumber || minimumClusterNumber < 1) {
656+
if (Number.isNaN(value) || value < minimumClusterNumber || minimumClusterNumber < 1) {
657657
const message =
658658
value < minimumClusterNumber
659659
? 'Desired maximum number of clusters cannot be smaller than the desired minimum number of clusters.'
@@ -668,7 +668,7 @@ function initializeUI(): void {
668668
const considerEdgeDirection = document.querySelector<HTMLInputElement>(`#directed`)!
669669
considerEdgeDirection.addEventListener('click', () => {
670670
const isChecked = considerEdgeDirection.checked
671-
graph.edges.forEach(edge => {
671+
graph.edges.forEach((edge) => {
672672
graph.setStyle(edge, isChecked ? directedEdgeStyle : graph.edgeDefaults.style)
673673
})
674674

@@ -677,7 +677,7 @@ function initializeUI(): void {
677677

678678
const considerEdgeCosts = document.querySelector<HTMLInputElement>(`#edgeCosts`)!
679679
considerEdgeCosts.addEventListener('click', () => {
680-
graph.edges.forEach(edge => {
680+
graph.edges.forEach((edge) => {
681681
if (considerEdgeCosts.checked) {
682682
const edgeCost = Math.floor(Math.random() * 200 + 1)
683683
if (edge.labels.size > 0) {
@@ -686,7 +686,7 @@ function initializeUI(): void {
686686
graph.addLabel(edge, `${edgeCost}`)
687687
}
688688
} else {
689-
edge.labels.toArray().forEach(label => {
689+
edge.labels.toArray().forEach((label) => {
690690
graph.remove(label)
691691
})
692692
}
@@ -698,19 +698,19 @@ function initializeUI(): void {
698698
const distanceCombobox = document.querySelector<HTMLSelectElement>(`#distance-metrics`)!
699699
distanceCombobox.addEventListener('change', runAlgorithm)
700700
const kMeansInput = document.querySelector<HTMLInputElement>(`#kMeansMaxClusterNumber`)!
701-
kMeansInput.addEventListener('change', _ => {
701+
kMeansInput.addEventListener('change', (_) => {
702702
const value = parseFloat(kMeansInput.value)
703-
if (isNaN(value) || value < 1) {
703+
if (Number.isNaN(value) || value < 1) {
704704
alert('Desired maximum number of clusters should be greater than zero.')
705705
kMeansInput.value = '1'
706706
return
707707
}
708708
runAlgorithm()
709709
})
710710
const iterationInput = document.querySelector<HTMLInputElement>(`#iterations`)!
711-
iterationInput.addEventListener('change', _ => {
711+
iterationInput.addEventListener('change', (_) => {
712712
const value = parseFloat(iterationInput.value)
713-
if (isNaN(value) || value < 0) {
713+
if (Number.isNaN(value) || value < 0) {
714714
alert('Desired maximum number of iterations should be non-negative.')
715715
iterationInput.value = '0'
716716
return
@@ -751,7 +751,7 @@ function getEdgeWeight(edge: IEdge): number {
751751
if (edge.labels.size > 0) {
752752
// ...try to return its value
753753
const edgeWeight = parseFloat(edge.labels.first().text)
754-
if (!isNaN(edgeWeight)) {
754+
if (!Number.isNaN(edgeWeight)) {
755755
return edgeWeight > 0 ? edgeWeight : 1
756756
}
757757
}

‎demos/analysis/clustering/DemoVisuals.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@ export class VoronoiVisual extends BaseClass(IVisualCreator) {
9999
container.appendChild(svgPath)
100100
})
101101

102-
this.clusters.centroids.forEach(point => {
102+
this.clusters.centroids.forEach((point) => {
103103
VoronoiVisual.drawClusterCenter(point, container)
104104
})
105105

@@ -172,7 +172,7 @@ export class PolygonVisual extends BaseClass(IVisualCreator) {
172172
let generalPath = new GeneralPath()
173173
if (clusterNodeBounds.length > 1) {
174174
const points = new YList()
175-
clusterNodeBounds.forEach(layout => {
175+
clusterNodeBounds.forEach((layout) => {
176176
const offset = 0
177177
const x = layout.x
178178
const y = layout.y

‎demos/analysis/clustering/DemoVisuals.ts‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,7 @@ export class VoronoiVisual
104104
container.appendChild(svgPath)
105105
})
106106

107-
this.clusters.centroids.forEach(point => {
107+
this.clusters.centroids.forEach((point) => {
108108
VoronoiVisual.drawClusterCenter(point, container)
109109
})
110110

@@ -185,7 +185,7 @@ export class PolygonVisual
185185
let generalPath: GeneralPath = new GeneralPath()
186186
if (clusterNodeBounds.length > 1) {
187187
const points = new YList()
188-
clusterNodeBounds.forEach(layout => {
188+
clusterNodeBounds.forEach((layout) => {
189189
const offset = 0
190190
const x = layout.x
191191
const y = layout.y
@@ -254,7 +254,10 @@ export class AxisVisual
254254
extends BaseClass<IVisualCreator>(IVisualCreator)
255255
implements IVisualCreator
256256
{
257-
constructor(private maxY: number, private rect: Rect) {
257+
constructor(
258+
private maxY: number,
259+
private rect: Rect
260+
) {
258261
super()
259262
}
260263

@@ -338,7 +341,10 @@ export class CutoffVisual
338341
{
339342
public cutOffValue: number
340343

341-
constructor(public rectangle: IRectangle, private readonly maxY: number) {
344+
constructor(
345+
public rectangle: IRectangle,
346+
private readonly maxY: number
347+
) {
342348
super()
343349
this.rectangle = rectangle
344350
this.maxY = maxY

0 commit comments

Comments
 (0)