1

I have an angular-2-application written in typescript which works pretty well; however, I stumbled upon this Problem for which the various related answers to the $-function did not help me. I also have the library "plottable" included and this is where the problem occured: There is a tutorial for tooltips (which happens to be what i Need in my Charts). In this tutorial, the following code can be found:

// Initializing tooltip anchor
var tooltipAnchorSelection = plot.foreground().append("circle").attr({


 r: 3,
  opacity: 0
});

var tooltipAnchor = $(tooltipAnchorSelection.node());
tooltipAnchor.tooltip({
  animation: false,
  container: "body",
  placement: "auto",
  title: "text",
  trigger: "manual"
});

What my question now is about is this line:

var tooltipAnchor = $(tooltipAnchorSelection.node());

I can't seem to find a working replacement for the $-function here. I have the following questons:

  • Is this jQuery? (since i have no real knowledge about jQuery I wouldn't know, the rest of the code seems pretty much like plain JavaScript to me though)
  • How can I replace this in my typescript-code to do the same as it does here?

I have tried simply removing it (would not throw any syntax-error but would not Show any tooltips either) but of course that didn't work; I also tried replacing it with document.getElementById(tooltipAnchorSelection.node()) but that didn't work either

Here is a JSFiddle showing a working Version of These tooltips; since this is written in JavaScript it works, but copying that exact same code to typescript shows me a syntax-error at the dollarsign.

Thanks for the help, I'd really appreciate it

Edit: I am not allowed to integrate jQuery in this project so just doing this can't fix my problem.

PS: I thought about naming this question something like "plottable tooltips don't work in typescript" or something but as the JSFiddle Shows they do work somehow, this really seems to be more of an issue with the $-function than with anything else

Yato
  • 64
  • 8
  • 1
    This uses jQuery and Bootstrap. Import these in your code. Can't say how to import unitl I see some actual code. – Saravana Apr 20 '17 at 12:00
  • @Saravana The actual full working code can be found in the JSFiddle that is linked; Could you please Elaborate what it has to do with bootstrap? I have used it quite a lot recently but I have never come across something coded like this (assuming you are talking about the bootstrap.css?) – Yato Apr 20 '17 at 12:05
  • I meant the code for your Angular 2 project where you are getting error using `$`. In your example fiddle, you are using `tooltip()` method from the Bootstrap library. – Saravana Apr 20 '17 at 14:20
  • Ah so the tooltip() comes from bootstrap, nice to know thank you. As for the code, the problem here is that it is the exact same code that Fails in my app, I copy-pasted it from the fiddle and it gives me, most likely because of typescript, the error at the $. That's why I am looking for a replacement for the $-function but I just can't seem to find one (the ones I tried because I assumed they would be equivalent didn't work) – Yato Apr 20 '17 at 14:55
  • 1
    You don't have to replace it. Just use the jQuery and Bootstrap package in your project. – Saravana Apr 20 '17 at 15:08
  • I frogot to state that I can not integrate jQuery in this project, I am sorry about that, I'll add it to the question as an edit. This is why I need a substitute for it – Yato Apr 21 '17 at 06:37
  • if you cannot use `jQuery` this will not work. – Aluan Haddad Apr 23 '17 at 06:02
  • Hello Aluan, so there is no equivalent to this jQuery-function in plain JavaScript? not even a multi-liner that ultimately does the same thing in the end? That's what I am searching for, would be unfortunate for me if it didn't – Yato Apr 24 '17 at 08:39

0 Answers0