0
votes

I'm using Bootstrap v3.3.1 CSS to style my page. Within my page I have a 'div' with and empty 'svg' element inside it. Within the 'svg' i'm using NVD3 to add charts.

It seems The bootsrap css and nvd3 css conflict. When I keep only bootsrap, I lose graph functionality like an interactive legend which changes color as I click it. If I keep only the nvd3 css, the graphs work perfect but I loose the style of my webpage. If I use both, everything seems to work except for tooltips on my charts (curiously, however, the tooltips on piecharts work, but not multi-bar, stacked area, etc).

Is there any way to make both work for me? Both the style of my page and the functionality of my tooltips? Thank you.

http://www.w3schools.com/bs/css/bootstrap_w3schools <--- bootsrap css https://cdn.rawgit.com/novus/nvd3/v1.8.1/build/nv.d3.css <-- nv.d3 css

1
We use both and haven't had this issue. Is it possible for you to post a link to an example?Lucas

1 Answers

0
votes

It seems you are not adding them in the right position. If you put Bootstrap before NVD3 you shouldn't have any problem or at least I don't have.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css">

<link rel="stylesheet" href="nv.1.8.1.d3.css">

I am giving you a link with a plunkr of mine, so you can see that it is adding Bootstrap style on my tooltip

http://plnkr.co/edit/n9QWBNHRDVEt4tuQh1fO?p=preview

Bye