Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Fractalis
fractal.js
Commits
e498958f
Commit
e498958f
authored
Jul 13, 2017
by
Sascha Herzinger
Browse files
Finally a working tooltip library
parent
e264fa75
Changes
3
Hide whitespace changes
Inline
Side-by-side
package.json
View file @
e498958f
...
...
@@ -25,6 +25,7 @@
"
gsap
"
:
"
^1.20.2
"
,
"
jquery
"
:
"
^3.2.1
"
,
"
tippy.js
"
:
"
^1.1.0
"
,
"
uuid
"
:
"
^3.1.0
"
,
"
vue
"
:
"
^2.3.3
"
,
"
vue-template-compiler
"
:
"
^2.3.3
"
,
"
vuex
"
:
"
^2.3.1
"
...
...
src/vue/charts/CorrelationAnalysis.vue
View file @
e498958f
...
...
@@ -53,12 +53,11 @@
r=
"4"
:fill=
"categoryColors[categories.indexOf(point.category) % categoryColors.length]"
:stroke=
"subsetColors[point.subset]"
:title=
"point.tooltip"
:data-test=
"point.tooltip"
v-tooltip=
"
{title: point.tooltip, options: {theme: 'light', arrow: true}}"
v-for="point in shownPoints.all">
</circle>
<line
class=
"fjs-lin-reg-line"
:
title
=
"
regLine.tooltip"
v-tooltip=
"
{
title
:
regLine.tooltip
, options: {theme: 'light', arrow: true, followCursor: true}}
"
:x1="tweened.regLine.x1"
:x2="tweened.regLine.x2"
:y1="tweened.regLine.y1"
...
...
@@ -120,9 +119,9 @@
import
requestHandling
from
'
../methods/run-analysis
'
import
*
as
d3
from
'
d3
'
import
{
TweenLite
}
from
'
gsap
'
import
tooltip
from
'
../directives/tooltip.js
'
import
TaskView
from
'
../components/TaskView.vue
'
import
deepFreeze
from
'
deep-freeze-strict
'
import
tippy
from
'
tippy.js
'
export
default
{
name
:
'
correlation-analysis
'
,
data
()
{
...
...
@@ -158,7 +157,6 @@
data
:
[]
}
,
selectedPoints
:
[],
tooltips
:
{
}
,
tweened
:
{
regLine
:
{
x1
:
0
,
x2
:
0
,
y1
:
0
,
y2
:
0
}
}
...
...
@@ -376,35 +374,9 @@
// statement. This helps with the integration into the Vue component lifecycle. E.g.: an animation can't be
// applied to an element that does not exist yet.
watch
:
{
'
shownPoints
'
:
{
handler
:
function
()
{
// https://github.com/atomiks/tippyjs/issues/74
if
(
typeof
this
.
tooltips
.
points
!==
'
undefined
'
)
{
this
.
tooltips
.
points
.
destroyAll
()
}
this
.
$nextTick
(()
=>
{
this
.
tooltips
.
points
=
tippy
(
`.fjs-vm-uid-${this._uid
}
.fjs-scatterplot-point:not([data-tooltipped])`
,
{
performance
:
true
,
theme
:
'
light
'
,
arrow
:
true
}
)
}
)
}
}
,
'
regLine
'
:
{
handler
:
function
(
newRegLine
)
{
TweenLite
.
to
(
this
.
tweened
.
regLine
,
0.5
,
newRegLine
)
// https://github.com/atomiks/tippyjs/issues/74
if
(
typeof
this
.
tooltips
.
regLine
!==
'
undefined
'
)
{
this
.
tooltips
.
regLine
.
destroyAll
()
}
this
.
$nextTick
(()
=>
{
this
.
tooltips
.
regLine
=
tippy
(
`.fjs-vm-uid-${this._uid
}
.fjs-lin-reg-line:not([data-tooltipped])`
,
{
theme
:
'
light
'
,
arrow
:
true
,
followCursor
:
true
}
)
}
)
}
}
,
'
histPolyPoints
'
:
{
...
...
@@ -474,11 +446,14 @@
}
,
components
:
{
DataBox
,
TaskView
TaskView
,
}
,
mixins
:
[
requestHandling
],
directives
:
{
tooltip
}
,
methods
:
{
runAnalysisWrapper
({
init
,
args
}
)
{
// function made available via requestHandling mixin
...
...
src/vue/directives/tooltip.js
0 → 100644
View file @
e498958f
import
tippy
from
'
tippy.js
'
import
uuid4
from
'
uuid/v4
'
export
default
{
update
:
function
(
el
,
binding
,
vnode
)
{
if
(
typeof
vnode
.
context
.
$options
.
_tippyInstances
===
'
undefined
'
)
{
vnode
.
context
.
$options
.
_tippyInstances
=
{}
}
if
(
!
el
.
hasAttribute
(
'
data-tooltipped
'
))
{
const
uuid
=
uuid4
()
el
.
setAttribute
(
'
title
'
,
binding
.
value
.
title
)
el
.
setAttribute
(
'
data-uuid
'
,
uuid
)
const
tip
=
tippy
(
el
,
Object
.
assign
(
binding
.
value
.
options
,
{
performance
:
true
}))
vnode
.
context
.
$options
.
_tippyInstances
[
uuid
]
=
tip
}
else
{
const
uuid
=
el
.
getAttribute
(
'
data-uuid
'
)
const
tip
=
vnode
.
context
.
$options
.
_tippyInstances
[
uuid
]
const
popper
=
tip
.
getPopperElement
(
el
)
el
.
setAttribute
(
'
title
'
,
binding
.
value
.
title
)
tip
.
update
(
popper
)
}
}
}
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment