Questions tagged [angular-nvd3]

Angular.js directives for nvd3.js

Filter by
Sorted by
Tagged with
0 votes
0 answers
11 views

angular nvd3chart: Chart label doesn't start at the intersection point

ChartConfig = { height: 450, x: (d: number): number => { return d[0]; }, y: (d: number): number => { return d1; }, margin: { top: 0, right: 0, bottom: 30, left: 85 }, useVoronoi: false, clipEdge:...
0 votes
1 answer
93 views

How to add more attributes in tooltip series in Angular NVD3 line chart

I need to add more attributes in tooltip series in Angular NVD3 line chart, if possible, without modifying the NVD3 source code. I know there are similar posts, but none of them covers this scenario. ...
1 vote
0 answers
31 views

Cannot run a function which is defined in scope from clickable tooltips of nvd3 charts

I have been trying to define a function in scope and trigger it when button is clicked in the tooltip. Here is the code that I have been working on in plnkr Clickable tooltips. I have modified plnkr ...
  • 123
0 votes
1 answer
74 views

Angular-nvd3(1.0.7) discreteBarChart's bar not show up

I copied all options and datasource from example . and the graph shows , but I can't see the bars . but if I mouse over it , it gave me a tooltips. so the bar is there , but I can't see it.. the ...
  • 561
1 vote
1 answer
297 views

how to set color to Angular-nvd3 (1.0.7)

I'm working on an AngularJS 1.5.3 project , and I use Angular-nvd3(1.0.7). I have met 2 problems: 1,When I'm using a discreteBarChart , I need to assign different color to every column,like this:(...
  • 561
1 vote
0 answers
136 views

Angular js nvd3 set margin for legends

How to add margin to legends for nvd3 charts. I'm following https://github.com/krispo/angular-nvd3/blob/gh-pages/js/lineChart.js they have given events for legends but not shown any example related to ...
  • 1,313
0 votes
1 answer
44 views

AngularJS prepare data for MultiBar Chart NVD3

I am calling my API to get JSON array below, array = [{"date":1533791167870,"count":1,"name":"James"},{"date":1533791167870,"count":3,"name":"Kane"},{"date":1533791167918,"count":1,"name":"Kane"},{"...
  • 235
0 votes
1 answer
721 views

On common x-axis how to draw a chart with different unit of dataset array (multi line chart)

As you can see in the above picture, I have two type of data array, In one set of data on y-axis I am getting in degree celsius and another of data array I am getting in hertz (hz), And the is quite ...
1 vote
0 answers
28 views

Angular nvd3 shows gaps between bars of grouped chart

I have a scenario where i need to show top 5 values for each date (each date data may differ). Issue scenario : For date 10th sep i have got response (top 5 -> Samsung Electronics, Lg, Apple, Amazon, ...
  • 85
1 vote
0 answers
120 views

ScatterPlot ng2-nvd3 big black circle

I am using ng2-nvd3 to plot a scatter. I fetch the data and create the data object in the good format. Then I create the option to display the chart. The points are properly displayed but I have big ...
  • 2,001
1 vote
0 answers
257 views

AngularJS Nvd3 Chart - Call the callback on every statechange

I have a graph who can have one set of data or multiples set of data. I need to check every stateChange and triggered the callback (he make actions that I need to make at every changes). here is my ...
  • 1,395
0 votes
0 answers
193 views

AngularJS nvd3 chart - Highlight a point

Hi have an app with some graphs and I use a callback function to get the clicked point. I want to highlight it but I don't find any solution who work, and the documentation of this plugin is ...
  • 1,395
1 vote
0 answers
41 views

NVD3 Bubble Chart disappears when all data filtered out

I have a filter which filters data for an NVD3 bubble chart. When no data or some data is filtered, the chart works perfectly well. However, when I filter all of the data out of the chart, the ...
1 vote
0 answers
256 views

how to give zoom Support feature for Angular 2 NVD3 Chart

I found some zoom functions for angular 1.x nvd3 chart. but I don't really know how to access them via the options in angular 2 nvd3 chart? Based on the nvd3 website there's a zooming functionality – ...
0 votes
1 answer
92 views

NVD3 How to remove Y-axis in Line chart and also utilize the space of Y-axis after it is removed

I am using NVD3 for showing a line chart. I have this line chart as follows: chart: { type: 'lineChart', height: 150, margin : { ...
0 votes
1 answer
108 views

Why is my line chart not plotting all of my data?

I am trying to create a line charts which covers points of {x: someX, y: someY}. But, it's not covering all of my points, and maxes out when y is 783. Here is a picture of what's going on: The ...
  • 2,272
1 vote
0 answers
214 views

How to add legends to a sunburst chart in nvd3?

Is there a way to add legends to a sunburst NVD3 chart? I'm doing this and it's currently not working. chart = nv.models.sunburstChart() .showTooltipPercent(true) .color(d3....
0 votes
1 answer
106 views

Issue with nvd3 charts in angular 2. Unable to display y-axis values as desired

Am using angular2 nvd3 charts. I have an issue with scaling on y-axis. I have y values like 623.10, 631.60, 629.10, 633.50, 631.80, 623.40 etc., and in options am doing something like yAxis: { ...
  • 387
1 vote
1 answer
636 views

Printing Charts in Internet Explorer Rendered By Angular-nvD3

I am using Bootstrap v3.2.0 for laying out 3 graphs created using Angular-nvD3. I am trying to render the page for printing. I have some modified CSS in the @media print rule. Everything renders ...
  • 473
1 vote
1 answer
96 views

AngularJS nvD3 Error - What versions are compatible?

I have the same problem as with this user: Angular nvD3 Error: Invalid isolate scope definition for directive nvd3 The answer there said "use the latest angularjs" beyond Angular 1.1.4....but I am ...
user avatar
0 votes
1 answer
620 views

Gradient color in nvd3 area and bar charts?

Is it possible to apply gradient color to area(filled-line) charts in nvd3. I have seen a workaround in d3 charts, using the svg object. But is there a simpler way to do this, or any hack to get the ...
  • 3,218
0 votes
0 answers
371 views

Is it possible to draw custom markers with nvd3?

I am trying to choose the best technology for plotting a rich graph which should contain a mix with few charts types like Line Chart, Scatter Chart, Bar Chart, Candlestick and other inside one canvas. ...
6 votes
1 answer
1k views

has no exported member 'CoordinateReferenceSystem'

Iam using suing "d3": "^4.10.0", and "@types/d3": "^4.10.0", in my angular 4 project , Suddenly its start throwing error ERROR in @types/d3-geo/index.d.ts (39,19): Namespace '"@types/geojson/index"' ...
0 votes
1 answer
236 views

Angular nvD3 Stacked Area Chart Data Series Format

I am trying to use my own data in a nvD3 stacked area chart. The sample data format from the Angular nvD3 site has a format like this: [{ "key":"Series 1", "values":[[1025409600000,0],[...
  • 473
1 vote
1 answer
559 views

How to catch the Click-Event on the stream legend with Angular NVD3 MultiBar Chart?

I'm currently using Angular NVD3 wrapper. I can't find a way to catch the Click-Event on the stream legend (highlighted in red in the image below). How to do that? The goal is to keep unselected ...
  • 4,725
0 votes
0 answers
193 views

unable to import nvd3 guage chart JS file

I need to implement guage chart and I am using NVD3 for that. https://github.com/enplore/nvd3-charts I tried to import js files mentioned in above link but getting the following error, GET http://[...
  • 1
2 votes
2 answers
550 views

Angular NVD3: How to access the chart object defined in HTML

I have defined a multibar chart using the <nvd3> directive and passing the data and options to it defined in my controller: <nvd3 options="vm.options" data="vm.data"></nvd3> Now I ...
-1 votes
1 answer
527 views

Angular nvd3 forced directed graph - increase edge length

I am using angular nvd3 to plot a forced directed graph. http://krispo.github.io/angular-nvd3/#/forceDirectedGraph These are the configurations : $scope.graphOption = { ...
  • 761
0 votes
1 answer
284 views

Pie chart with data [] dont show any message

Hi everyone I have a pie chart made with nvd3 and when graph.data=[] it doenst show anything.. I want to display a simple message like "No data to show" View: <tab ng-if="dataConsNetfilter" ...
1 vote
1 answer
246 views

NVD3 - How to add arrow heads to the links using angular-nvd3

I'm working from the example of the force directed graph. krispo/angular-nvd3/blob/gh-pages/js/forceDirectedGraph.js How would I modify this code, so that I can add arrow heads to each of the ...
1 vote
0 answers
282 views

Disable legend based on another legend click - angular nvd3 chart

I would like to disable a legend(breached95) based on the click of another legend(var95) in nvd3 chart. Below script fires the legend click event which gives the click legend values but unable to ...
  • 1,511
2 votes
2 answers
284 views

nvD3 - multiBarChart - How to start from 0 and how to change the shape of controls

I have added a multiBarChart in my app using nvD3. I am stuck in doing two things: How to start it from 0. My first bar is starting after leaving some space. I played with group spacing but ...
  • 5,544
0 votes
0 answers
236 views

NVD3 Line Chart not updating yAxis with forceY

I have a line chart with a margin between the lowest and highest price and the chart borders. I don't want the ticks touching the top and the bottom of the chart, so I used forceY to achieve that. &...
0 votes
1 answer
319 views

nvd3 candlestick chart not displaying custom data

I have a nvd3 angular candlestick chart that displays hardcoded data just fine. But when I point it another data source (socket.io), it doesn't display anymore. I get my data from a socket here $...
0 votes
1 answer
312 views

How to draw bar chart with range x-axis?

I am using angular-nvd3 to draw charts. Is there an option do draw bar chart with an x-axis like this? *** *** *** *** *** *** *** *** *** *** **...
  • 4,725
0 votes
1 answer
61 views

angular-nvd3 margin doesn't work? (krispo)

No matter how much I change the margin. The dates get cut off. I am trying to show a 7 date range, but the last date gets cut off. Any ideas, to work around this? My code: vm.lineChartOptions = { ...
0 votes
1 answer
857 views

Angular NVD-3 Graph: Axis Labels and Axis Numbers Cut Off and Outside of Viewing Window

Currently I am using angular-nvd3 graphing to display data. However, the stacked area chart nvd3 graph type is cutting off the numbers and axis labels. The template graph can be viewed here. The y-...
  • 1,250
1 vote
0 answers
72 views

How to pull an array of JSON objects from API endpoint, to display on angular-nvd3 line chart?

I am trying to get an array of objects from an API endpoint inside of a mongo DB. The trouble I am having is what syntax to use to plug in that data, and then get the chart to display that data from ...
0 votes
0 answers
232 views

how to get y-Axis points in NVD3 chart

I'm working with NVD3 charts with angular2 following this link. I'm getting line chart fine. In line chart on mouse over tooltip gets shown on Yaxis 3 points. YAxis have Line lines so three points we ...
1 vote
1 answer
833 views

Set background color of Angular-nvD3

I am using Angular-nvD3 in my Charts and I would like to change the background of this chart like the picture example. Can anyone help me please? Here its the HTML code: <div class="col-md-6"> ...
  • 133
0 votes
0 answers
191 views

change angular-nvd3 chart's key shape

I want to change the "Events" key shape from circle to square but rather do so via angular-nvd3 or nvd3 api instead of selecting using d3 and changing it after the chart renders.. so far couldn't find ...
  • 1,386
0 votes
1 answer
319 views

How to update percent values of custom tooltip in angular nvd3 pie chart

I am showing custom tooltip with percent values in Angular NVD3 pie chart. plunker link `https://plnkr.co/edit/Tv544U?p=preview` tooltip shows correct values in percent. But if I deselect any ...
  • 111
1 vote
0 answers
255 views

NVD3 chart "date type" change max and min position yaxis

i need to change y axis position that min position is in top and max position in bottom. so the nvd3 chart will move down to the latest value everything i need is in this link. http://jsfiddle.net/...
  • 65
0 votes
1 answer
397 views

How can I replicate this nvd3 chart title styling/positioning behaviour?

I am taking over a site which uses Angular-nvD3 to draw a pie chart and when I build the site locally the title isn't displaying correctly. Here's the chart on the current working site... and here'...
  • 349
2 votes
1 answer
1k views

How can I resize my d3.js script? is there a way to put this into a div tag where I can resize my bar chart smaller?

i am unable to resize my bar chart within a script tag. Currently the bar chat is showing up massive on the page and I would like to resize the chart into a smaller size on the page. Is there a way ...
  • 135
1 vote
1 answer
406 views

Line Graph using D3 is not starting from the date i want it to

Below is my line graph where I am using 2 lines to show different values, One line is blue and the other is red. however the red line i want to start from 'Dec 27'(half way of the graph) instead of ...
  • 135
2 votes
1 answer
455 views

Use Different Value on Mouseover in angular nvd3

I have a data set that contains a frequency per hundred and an absolute count. The data set looks like this: $scope.data = [ { key: "Cumulative Return", values: [ {...
1 vote
0 answers
66 views

How to add the focus to nvd3 charts in angular

I have to build a web app which is data driven, So I will have to use so many chart types from nvd3, there are some charts in nvd3 where the Focus is added. But I will need to add the focus for every ...
0 votes
1 answer
979 views

Setting a min & max on the axis

I am using anuglar-nvd3 and can't find any documentation on the API. The issue I'm facing right now is how can I set a maximum & minimum value on the xAxis and yAxis. In other words regardless of ...
  • 4,159
0 votes
0 answers
359 views

Angular nvd3 Line chart scrolling

How to do scrolling along the x axis with Angular nvd3? I find this http://blog.scottlogic.com/2014/09/19/interactive.html and http://bl.ocks.org/stepheneb/1182434 but it is too difficult It doesn't ...

1
2 3 4 5