autonomic-cooperative/kcl-digital-humanities-garden
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix js

Browse Source
This commit is contained in:
Garry Ing 2021-04-25 14:30:58 -04:00
parent 5f1a50bb36
commit dba2a4eaf4
No known key found for this signature in database
GPG Key ID: 3B379B1F2193CC3E
3 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_notes/digital-public-garden.md
View File

@ -1,4 +1,6 @@
--- ---
date: 2021-03-15
status: 🌱
--- ---
![digital-garden](https://user-images.githubusercontent.com/227587/114309337-d5ff4800-9ab4-11eb-8f38-e7b4b7f590f0.png) ![digital-garden](https://user-images.githubusercontent.com/227587/114309337-d5ff4800-9ab4-11eb-8f38-e7b4b7f590f0.png)

16
_sass/_digital-garden.scss
View File

@ -87,12 +87,11 @@
.nodes circle { .nodes circle {
cursor: pointer; cursor: pointer;
stroke: var(--foreground-text);
fill: var(--background); fill: var(--background);
transition: all 0.15s ease-out; transition: all 0.15s ease-out;
&:hover { &:hover {
fill: var(--foreground-text); stroke: var(--foreground-text);
} }
} }
@ -105,22 +104,19 @@
} }
} }
.nodes [active], .nodes [active] {
.text [active] {
cursor: pointer; cursor: pointer;
stroke: var(--active-note);
}
.text [active] {
fill: var(--active-note); fill: var(--active-note);
stroke: transparent;
} }
.status { .status {
pointer-events: none; pointer-events: none;
} }
.inactive {
opacity: 0.45;
transition: opacity 0.15s ease-out;
}
// Notes inline styles // Notes inline styles
.note-meta:before { .note-meta:before {

10
assets/js/scripts.js
View File

@ -148,11 +148,11 @@ const d3 = window.d3
if (typeof window.graphData !== 'undefined') { if (typeof window.graphData !== 'undefined') {
const MINIMAL_NODE_SIZE = 10 const MINIMAL_NODE_SIZE = 10
const MAX_NODE_SIZE = 12 const MAX_NODE_SIZE = 16
const STROKE = 1 const STROKE = 1
const FONT_SIZE = 12 const FONT_SIZE = 12
const TICKS = 200 const TICKS = 200
const FONT_BASELINE = 35 const FONT_BASELINE = 42
const MAX_LABEL_LENGTH = 50 const MAX_LABEL_LENGTH = 50
const nodesData = window.graphData.nodes const nodesData = window.graphData.nodes
@ -163,9 +163,9 @@ if (typeof window.graphData !== 'undefined') {
const updateNodeSize = () => { const updateNodeSize = () => {
nodesData.forEach((el) => { nodesData.forEach((el) => {
let weight = let weight =
3 * 8 *
Math.sqrt( Math.sqrt(
linksData.filter((l) => l.source === el.id || l.target === el.id) linksData.filter((l) => l.source.id === el.id || l.target.id === el.id)
.length + 1 .length + 1
) )
if (weight < MINIMAL_NODE_SIZE) { if (weight < MINIMAL_NODE_SIZE) {
@ -280,7 +280,7 @@ if (typeof window.graphData !== 'undefined') {
const ticked = () => { const ticked = () => {
node.attr('cx', (d) => d.x).attr('cy', (d) => d.y) node.attr('cx', (d) => d.x).attr('cy', (d) => d.y)
status.attr('x', (d) => d.x - 24).attr('y', (d) => d.y) status.attr('x', (d) => d.x - 2).attr('y', (d) => d.y)
text text
.attr('x', (d) => d.x) .attr('x', (d) => d.x)
.attr('y', (d) => d.y - (FONT_BASELINE - nodeSize[d.id])) .attr('y', (d) => d.y - (FONT_BASELINE - nodeSize[d.id]))