You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
I'm trying to set the y-axis range of the chart from 1-100. Consulted the API documentation and found a possible solution with axis.tickValues as seen here https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickValues However, using the option does not work. Reading further down on the documentation page linked above under axis.tickSize, the following line was spotted The end ticks are determined b
I have a line chart and every time the page refresh it changes the data, which is great but I need to to refresh by a user click. This is because there will eventually be other input fields on the page and refreshing the page would destroy their current session. jsfiddle - http://jsfiddle.net/darcyvoutt/dXtv2/ Here is the code setup to create the line: function economyData() { // Rounds var numRou
I'm working on a multi-line chart in D3 but am having some issues with the rendering. I'm trying to render two lines with data that looks like this: [ { key:"line 1", values: [ {x:1, y:1}, {x:2, y:2} ] }, { key:"line 2" , values: [ {x:1, y:1}, {x:2, y:2}, {x:3, y:3} ] } ] "line 2" renders just fine, but "line 1" stops rendering at x = 2. I understand that my dataset might be considered incomplete,
I am using NVD3 to visualise data on economic inequality. The chart for the US is here: http://www.chartbookofeconomicinequality.com/inequality-by-country/USA/ These are two lineCharts on top of each other. The problem I have is that there are quite a lot of missing values and this causes two problems: If I would not make sure that the missing values are not visualised the line Chart would connect
I'm using NVD3.js to display a multi-line chart. I would like the yAxis to display to 2 decimal numbers edited answer var chart; nv.addGraph(function () { chart = nv.models.lineChart() .options({ margin: { left: 140, bottom: 50 }, x: function (d, i) { return i; }, showXAxis: true, showYAxis: true, transitionDuration: 250, tooltips: true, tooltipContent: function (key, x, y, e, graph) { return '<h3
I'm trying to set the width and height of a nvd3 multi bar chart programmatically using chart.width(600); chart.height(400); See the example here: http://jsfiddle.net/hPgyq/20/ As you can see this really messes up the chart. I know I can do this is CSS with: #chart svg { width: 600px; height: 400px; } but I thought this was also possible using the width() and height() functions on the chart. Am I
インタラクションの実装 さて昨日は D3.js 日本語訳の全 16 章の内容を駆け足で一気に書き下ろしてみましたが、この内容だけですと静的なプロッティングしかできずなんとも消化不良です。 そこで今回は前々回にも紹介した NVD3 との組み合わせでいよいよ D3.js の肝心の目玉であるインタラクションを実装していきます。 完成形のデモアプリケーションはこちらから閲覧できます。 (うまく表示されない場合はブラウザをリロードしてみてください) Heroku を利用する いままでは画像をペタペタと記事に貼ってきましたがインタラクションを見せるには Qiita に画像を貼るだけでは不十分です。そこでデモアプリケーションとして外部のサイトにデプロイすることを考えます。こんなときに非常に便利なのが Heroku というサイトです。詳細はこの辺りを読めば分かると思いますが要は無料でも使える PaaS サ
Javascriptのライブラリはたくさんあるけれど、いろんな統計分析結果を表示するのに良さそうなライブラリは意外と限られてます。 そんな図/グラフ描画用Javascriptライブラリを画像とともにまとめておきました。 NVD3.js ライセンス: Apache 2.0 D3.jsで作られたチャート描画用ライブラリ。グニュグニュ動いてカッコいいが複雑なものを使うとバグを踏んだりする。git hub管理されているのでパッチを投げるのは比較的簡単。 Vis.js ライセンス: Apache 2.0 / MIT グラフ理論的なグラフを描くのが主眼のライブラリだが、棒グラフ、折れ線グラフなどは描ける。パイチャートは描けない。 Google Charts ライセンス: completely free 言わずと知れたGoogle先生のライブラリ。使いやすいが、見慣れているせいか少しダサく感じるのが欠点
まずはじめに、データ可視化は真の目的ではありません。手段です。 Vitaly Friedman の有名な言葉で、データ可視化の大目的は明瞭かつ効果的に情報とコミュニケーションができるように、データを視覚化できる能力そのものである (The main goal of data visualization is its ability to visualize data, communicating infomation clearly and effectivelty.) というものがあります。 情報を視覚的に伝える 明確に情報を伝える 効果的に情報を伝える こういったことがデータ可視化の要件かと思います。 とくに、何のための可視化なのかという大目的を見失ってはいけません。 この辺の話は以下の「データ可視化勉強会」のスライドがとても素晴らしいのであわせて参照すると良いでしょう。 http:
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く