Locale for axis nvd3.js - d3.js

How to change the locale on axis labels? By default US locale is used for numbers ','(comma) as thousand separator while I need to change it to '.'
Thanks

Locale-Unaware version:
commaFormat = d3.format(',')
chart = nv.models.lineChart();
chart.xAxis().tickFormat(commaFormat);
chart.yAxis().tickFormat(commaFormat);
You will need to do this for every axis on every chart.

Looks like https://stackoverflow.com/a/19275327/240358 is on the right track.
From the 2.10 release, https://github.com/mbostock/d3/pull/753 has info on rebuilding d3 with a locale. Built-in locale files are at https://github.com/mbostock/d3/tree/master/src/locale
As you asked in relation to nvd3, you'll want to fork d3 on github, run the build, commit that bin/ on a separate branch, and push that to your fork. Then in your project that uses nvd3, you can use that branch - if you're using bower for your dependencies, specify your branch and repo as the dependency.
I am now considering building and hosting local versions.

Not sure how I missed this earlier, but the latest d3 localization allows runtime definition loading.
d3.locale({
thousands: ".",
decimal: ","
});
# nvd3 charting code.
https://github.com/mbostock/d3/wiki/Localization

Related

dc.js grouped bar chart

I need to do this grouped bar chart like this one but the .renderType() doesn`t work. Are there any solutions to do a chart like this? Thanks!
You're right, it's non-trivial to find a branch or fork of dc.js and use it in your project.
The PR you linked is rather old and was replaced by this one. Unfortunately all grouped bar implementations had design shortcomings and none are ready to merge, which is why we still have to use forks or branches of the code.
Instead of renderType the API on this fork changed to
.groupBars(true)
The fork and branch for the new PR are here:
https://github.com/jaklub/dc.js/tree/grouped-or-stacked-bars
The artifacts (dc.js and dc.css) can be found on the grouped-or-stacked-bars-artifacts branch.
One way to fetch them is using jsdelivr:
https://cdn.jsdelivr.net/gh/jaklub/dc.js#grouped-or-stacked-bars-artifacts/dc.js
https://cdn.jsdelivr.net/gh/jaklub/dc.js#grouped-or-stacked-bars-artifacts/dc.css
Or, if you're using npm, you can declare the dependency as so:
"dc": "git+git#github.com:jaklub/dc.js#grouped-or-stacked-bars-artifacts"
Shorter version for any recent version of npm:
"dc": "jaklub/dc.js#grouped-or-stacked-bars-artifacts"
Although this is a fork of the last major version (3) of dc, it's compatible with the latest d3, as demonstrated in this demo fiddle.
Clearly you need a lot more horizontal space in order to display grouped bars, but that's a separate issue.

GeoJSON not visible in output rendered by code using D3.js v3

I'd like to visualize a geojson file in the EPSG:4326 coordinate reference system using D3.js version 3. I'm aware it's better to use the newest version, but alas I'm restricted because of old software that doesn't support higher versions.
I wrote this code: https://bl.ocks.org/FrieseWoudloper/141945ce346639013ac1ced8e4c071b7
In the resulting output there is an SVG element with paths, but I don't see it. I think I have the translate and scale arguments wrong, but I don't know how to determine the right values. Could you please give me any directions on how to fix this?

Empty Burndown Chart

I'm working with Visual Studio Team Services. I'm trying to build an example project with few sprints inside. I have declared all tasks in my Backlog Items, but I have no idea why:
Despite I declare effort for each task, I can see it only in the column
of the parent folder.
Burndown chart is empty. Can I somehow set previous date in the tasks? I need to fill my burndown chart with some data.
The iteration is in the future. It won't show a burndown chart until 7/3.
Also, it's called a "burndown" chart, not a "burnout" chart. "Burnout" has a very different meaning in English. :)

Two different version of D3 in the same page

I'd like to have on the same page D3 charts that are build with different version of D3 (ok, frames are an option, but ideally without them).
What is the best way to have two version of D3 library in the same page (4.x and 3.x) ?

Is there a jQuery plugin for Dot language file visualization?

Is there a jQuery plugin for displaying Dot files live in the browser as specified here?
I've seen a proof of concept at Visual Politics, but it doesn't seem to fully support the Dot language as even -- doesn't display correctly.
Any libraries out there I could have a look at for this?
I need to implement network graphs in the browser from dot files loaded via Ajax (rather than server side generated PNGs)
Check out Canviz: http://code.google.com/p/canviz/
Demos are located here: http://www.ryandesign.com/canviz/
As I was looking for the same answer, I found "viz.js" providing a java script version of GraphViz for DOT (see https://github.com/mdaines/viz.js).
Using this, I build myself WP GraphViz, a plugin for WordPress (see http://wordpress.org/plugins/wp-graphviz/).
I've been working on this for almost a week.
There are three different implementations:
1.Render svg in simple js, no needs install of graphviz
jquery.graphviz.svg https://github.com/mountainstorm/jquery.graphviz.svg
jQuery plugin to make Graphviz SVG output more interactive and easier to navigate. Makes it easy to have features like:
Highlight nodes/edges
Zoom in/out
Graph navigation - select linked nodes
Fancy UI tooltips; bootstrap supported out the box
Move things forward/back in the graph
Have a look at the demo: https://cdn.rawgit.com/mountainstorm/jquery.graphviz.svg/master/demo.html
2.Based on d3.js
<https://github.com/dagrejs/dagre-d3> d3.js + dagre
<https://github.com/dagrejs/dagre> pure js library
or:
<https://github.com/magjac/d3-graphviz> d3.js + graphviz c++ build
<https://github.com/hpcc-systems/hpcc-js-wasm> build graphviz 2.47
3.server side call graphviz to generate svg file.
<http://viz-js.com/>
<https://github.com/mdaines/viz.js>
<https://github.com/dreampuf/GraphvizOnline>

Resources