Packages

chartkick

0.0.2
1.0.0 0.4.0 0.3.0 0.2.0 0.1.0 0.0.2 0.0.1

Create beautiful JavaScript charts with one line of Elixir

Current section

7 Versions

Jump to
Readme
7 Versions
2 Dependencies
Dependants
Files
Activity
Show whitespace

Compare versions

5 files changed
+220 additions
-11 deletions
  @@ -0,0 +1,7 @@
1 + ### 0.0.2
2 +
3 + * Removed defunct `ChartOptions` module.
4 +
5 + ### 0.0.1
6 +
7 + Initial release.
  @@ -1,4 +1,210 @@
1 - Chartkick
2 - =========
1 + # Chartkick
3 2
4 - ** TODO: Add description **
3 + Create beautiful Javascript charts with one line of Elixir. No more fighting with charting libraries!
4 +
5 + [See it in action](http://buren.github.io/chartkick-ex/)
6 +
7 + Works with Phoenix, plain Elixir and most browsers (including IE 6).
8 +
9 + I'm _very_ new to Elixir, so if you have any feedback, suggestions or comments please open an issue or PR!
10 +
11 + ## Charts
12 +
13 + All charts expect a JSON string.
14 + ```
15 + data = Poison.encode!([[175, 60], [190, 80], [180, 75]])
16 + ```
17 +
18 + Line chart
19 +
20 + ```elixir
21 + Chartkick.line_chart data
22 + ```
23 +
24 + Pie chart
25 +
26 + ```elixir
27 + Chartkick.pie_chart data
28 + ```
29 +
30 + Column chart
31 +
32 + ```elixir
33 + Chartkick.column_chart data
34 + ```
35 +
36 + Bar chart
37 +
38 + ```elixir
39 + Chartkick.bar_chart data
40 + ```
41 +
42 + Area chart
43 +
44 + ```elixir
45 + Chartkick.area_chart data
46 + ```
47 +
48 + Scatter chart
49 +
50 + ```elixir
51 + Chartkick.scatter_chart data
52 + ```
53 +
54 + Geo chart
55 +
56 + ```elixir
57 + Chartkick.geo_chart Poison.encode!("[[\"United States\",44],[\"Germany\",23]]")
58 + ```
59 +
60 + Timeline
61 +
62 + ```elixir
63 + Chartkick.timeline "[
64 + [\"Washington\", \"1789-04-29\", \"1797-03-03\"],
65 + [\"Adams\", \"1797-03-03\", \"1801-03-03\"],
66 + [\"Jefferson\", \"1801-03-03\", \"1809-03-03\"]
67 + ]"
68 + ```
69 +
70 + ### Say Goodbye To Timeouts
71 +
72 + Make your pages load super fast and stop worrying about timeouts. Give each chart its own endpoint.
73 +
74 + ```elixir
75 + Chartkick.line_chart "/path/to/chart.json"
76 + ```
77 +
78 + And respond with data as JSON.
79 +
80 + ### Options
81 +
82 + Id and height
83 +
84 + ```elixir
85 + Chartkick.line_chart data, id: "users-chart", height: "500px"
86 + ```
87 +
88 + Min and max values
89 +
90 + ```elixir
91 + Chartkick.line_chart data, min: 1000, max: 5000
92 + ```
93 +
94 + `min` defaults to 0 for charts with non-negative values. Use `nil` to let the charting library decide.
95 +
96 + Colors
97 +
98 + ```elixir
99 + Chartkick.line_chart data, colors: ["pink", "#999"]
100 + ```
101 +
102 + Stacked columns or bars
103 +
104 + ```elixir
105 + Chartkick.column_chart data, stacked: true
106 + ```
107 +
108 + Discrete axis
109 +
110 + ```elixir
111 + Chartkick.line_chart data, discrete: true
112 + ```
113 +
114 + Axis titles
115 +
116 + ```elixir
117 + Chartkick.line_chart data, xtitle: "Time", ytitle: "Population"
118 + ```
119 +
120 + The current implementation does unfortunately not allow you to pass options directly to the charting library yet.. PRs are welcome!
121 +
122 + See the documentation for [Google Charts](https://developers.google.com/chart/interactive/docs/gallery) and [Highcharts](http://api.highcharts.com/highcharts) for more info.
123 +
124 + ### Data
125 +
126 + Pass data as a JSON string.
127 +
128 + ```elixir
129 + Chartkick.pie_chart("{\"Football\" => 10, \"Basketball\" => 5}")
130 + Chartkick.pie_chart "[[\"Football\", 10], [\"Basketball\", 5]]"
131 + ```
132 +
133 + For multiple series, use the format
134 +
135 + ```elixir
136 + Chartkick.line_chart "[
137 + {name: \"Series A\", data: series_a},
138 + {name: \"Series B\", data: series_b}
139 + ]"
140 + ```
141 +
142 + Times can be a time, a timestamp, or a string (strings are parsed)
143 +
144 + ```elixir
145 + Chartkick.line_chart "{
146 + 1368174456 => 4,
147 + \"2013-05-07 00:00:00 UTC\" => 7
148 + }"
149 + ```
150 +
151 + ## Installation
152 +
153 + Add the following to your project :deps list:
154 +
155 + ```elixir
156 + {:chartkick, "~>0.0.2"}
157 + ```
158 +
159 + By default when you render a chart it will return both the HTML-element and JS that initializes the chart.
160 + This will only work if you load Chartkick in the `<head>` tag.
161 + You can chose to render the JS & HTML separately using the `only: :html` or `only: :script` option.
162 +
163 + For Google Charts, use:
164 +
165 + ```html
166 + <script src="//www.google.com/jsapi"></script>
167 + <script src="path/to/chartkick.js"></script>
168 + ```
169 +
170 + If you prefer Highcharts, use:
171 +
172 + ```html
173 + <script src="/path/to/highcharts.js"></script>
174 + <script src="path/to/chartkick.js"></script>
175 + ```
176 +
177 + ### Localization
178 +
179 + To specify a language for Google Charts, add:
180 +
181 + ```html
182 + <script>
183 + var Chartkick = {"language": "de"};
184 + </script>
185 + ```
186 +
187 + **before** the javascript files.
188 +
189 + ## No Elixir? No Problem
190 +
191 + Check out
192 +
193 + * JS [chartkick.js](https://github.com/ankane/chartkick.js)
194 + * Ruby [chartkick](https://github.com/ankane/chartkick)
195 + * Python [chartkick.py](https://github.com/mher/chartkick.py)
196 +
197 + ## History
198 +
199 + View the [changelog](https://github.com/buren/chartkick-ex/blob/master/CHANGELOG.md)
200 +
201 + Chartkick follows [Semantic Versioning](http://semver.org/)
202 +
203 + ## Contributing
204 +
205 + Everyone is encouraged to help improve this project. Here are a few ways you can help:
206 +
207 + - [Report bugs](https://github.com/buren/chartkick-ex/issues)
208 + - Fix bugs and [submit pull requests](https://github.com/buren/chartkick-ex/pulls)
209 + - Write, clarify, or fix documentation
210 + - Suggest or add new features
  @@ -1,7 +1,8 @@
1 1 {<<"app">>,<<"chartkick">>}.
2 2 {<<"build_tools">>,[<<"mix">>]}.
3 3 {<<"elixir">>,<<"~> 1.0">>}.
4 - {<<"files">>,[<<"lib/chartkick.ex">>,<<"mix.exs">>,<<"README.md">>]}.
4 + {<<"files">>,
5 + [<<"lib/chartkick.ex">>,<<"mix.exs">>,<<"README.md">>,<<"CHANGELOG.md">>]}.
5 6 {<<"name">>,<<"chartkick">>}.
6 7 {<<"requirements">>,
7 8 [{<<"poison">>,
  @@ -12,4 +13,4 @@
12 13 [{<<"app">>,<<"uuid">>},
13 14 {<<"optional">>,false},
14 15 {<<"requirement">>,<<"~> 1.0">>}]}]}.
15 - {<<"version">>,<<"0.0.1">>}.
16 + {<<"version">>,<<"0.0.2">>}.
  @@ -1,9 +1,4 @@
1 1 defmodule Chartkick do
2 - defmodule ChartOptions do
3 - @derive [Poison.Encoder]
4 - defstruct [:min, :max, :colors, :stacked, :discrete, :xtitle, :ytitle]
5 - end
6 -
7 2 def line_chart(data_source, options \\ []) do
8 3 chartkick_chart("LineChart", data_source, options)
9 4 end
  @@ -3,7 +3,7 @@ defmodule Chartkick.Mixfile do
3 3
4 4 def project do
5 5 [app: :chartkick,
6 - version: "0.0.1",
6 + version: "0.0.2",
7 7 elixir: "~> 1.0",
8 8 build_embedded: Mix.env == :prod,
9 9 start_permanent: Mix.env == :prod,