nvd3.js

问题 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 properly for printing in Chrome, but the charts do not resize for printing in IE 11. I have tried to trigger a window resize event in JavaScript, it executes but doesn't make any difference. My div looks like this: <div class="container"> <div class="row"> <div class="col-md-3 col-sm-3 col-xs-3"> <div

问题 I am using NVD3.js multiChart to show multiple lines and bars in the chart. All is working fine, but the x-axis labels is aligned only to the line points, not bars. I want to correctly align labels directly below the bars as it should. But I get this: With red lines I marked where the labels should be. I made jsFiddle: http://jsfiddle.net/n2hfN/ Thanks! 回答1: As @Miichi mentioned, this is a bug in nvd3... I'm surprised that they have a TODO to "figure out why the value appears to be shifted"

问题 Is there a way to show an empty chart instead of the "No Data Available" message when there is no data to show? http://jsfiddle.net/sammla/pYWkD/2/ data2 = [ { "key" : "A key" , "values" : [] } ]; Thanks! 回答1: You can "hack" this by having an empty array that contains an empty array: data2 = [ { "key" : "A key" , "values" : [[]] } ]; 回答2: The answer provided by Lars works well when you do not want to show the noData message on a chart when its empty. Recently I had charts with content being

问题 I am making a bar graph in nvd3.js, similar to this example: http://nvd3.org/ghpages/discreteBar.html. I was wondering if there was a way to remove the gridline so the background would be plain white. All of the examples use gridlines. I also checked the source code and didn't see anything in the discreteBar model that would make this possible. 回答1: You can select those grid lines in your CSS and set their opacity 0: .tick { opacity: 0; } If you still want to see the baseline, you could

问题 I have some graphs using d3/nvd3. I am now wanting to be able to update the chart data with the click of a button, I have got it working 90% but when I update the data, the functionality becomes inconsistent. By this I mean that the clickable legend stops working properly, usually you can double click one of them and it would single out the data. I think somehow when the data updates, it still has the old data in it's memory and this is causing some issues? Here is my javascript - $( document

问题 I'm trying to use display categorical levels in the x-axis of my line chart. Say I have a data frame mydata <- data.frame(time = c("10am", "12pm", "3pm"), month = c("JAN", "JUL", "DEC"), value = 3:5) and I want to plot value ~ time or value ~ month . I could first create a variable that puts time on a linear scale, e.g. mydata$time_linear <- 1:3 then try to plot library(rCharts) p <- nPlot(value ~ time_linear, data = mydata, type = "lineChart") p$chart(useInteractiveGuideline = TRUE) p but I

问题 I am using nvd3.js first time in my php code. I want to show a graph count against date for particular user. I want to show the date horizontally and count vertically. But I did not understand how to do that. My json data is like: ["key":"0","values":[["1374517800000","2"]]},"182398":{"key":"182398","values":[["1375295400000","2"],["1374517800000","2"],["1374604200000","12"],["1374431400000","1"],["1375122600000","4"],["1375209000000","19"]]},"185271":{"key":"185271","values":[["1374604200000

问题 I have a page which I am trying to show multiple NVD3 charts on tabs. I see on the NVD3 site that they store all chart names ahead of time but I am not sure how I should do this. I have graph models which get stored in the database and then my page must dynamically render all of the charts and appropriate javascript on the fly. So far only the last graph constructed shows :( I render this partial for each graph <%if graph.present?%> <%@graph = graph%> <%end%> <%if @graph.data.empty?%> <%=

问题 working with discreteBarChart in nvd3 here is the basic example in jsfiddle I have created this bar chart and I have got my data that feeds it to look like this as is required: var data = [ { key: "KPI_NAME", values: [ { "label" : "A" , "value" : -29.765957771107, "series" : 0 } , { "label" : "B" , "value" : 0, "series" : 0 } , { "label" : "C" , "value" : 32.807804682612, "series" : 0 } , { "label" : "D" , "value" : 196.45946739256, "series" : 0 } , { "label" : "E" , "value" : 0

问题 I looked every where and I tried several solution but I wasn't able to find something similar to brushend in angular-nvd3 lineWithFocusChart. in fact I'm trying to get the details of the rendered brush extent. I tried callback : function(chart) { chart.focus.dispatch.on('brush', function(e) { console.log("hello", e) }); } But it renders all details and not the last one and when I use 'brushend' i get an error message like if the dispatch is undefined d3.js:492 Uncaught TypeError: Cannot read