├── .gitignore ├── .idea └── .name ├── LICENSE ├── README.md ├── build.sbt ├── demo ├── index-fastopt.html └── src │ └── main │ └── scala │ └── ScalaJSChartExample.scala ├── project ├── build.properties └── plugins.sbt └── src └── main └── scala └── io └── surfkit └── clientlib └── Chart.scala /.gitignore: -------------------------------------------------------------------------------- 1 | *.class 2 | *.log 3 | 4 | # sbt specific 5 | .cache 6 | .history 7 | .lib/ 8 | .idea/* 9 | dist/* 10 | target/ 11 | lib_managed/ 12 | src_managed/ 13 | project/boot/ 14 | project/plugins/project/ 15 | 16 | # Scala-IDE specific 17 | .scala_dependencies 18 | .worksheet 19 | -------------------------------------------------------------------------------- /.idea/.name: -------------------------------------------------------------------------------- 1 | Type-safe and Scala-friendly library over Chart.js -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Corey Auger 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # scalajs-chart 2 | Type-safe and Scala-friendly library over Chart.js. 3 | 4 | ## Dependency Info 5 | [Scala.js](https://www.scala-js.org/). 6 | 7 | [ChartJS](http://www.chartjs.org/) 8 | 9 | ## Get started 10 | I assume that you have setup a ScalaJS project before. If this is not the case you can follow the instructions and some basic example on the [Scala.js](https://www.scala-js.org/) homepage. 11 | 12 | 13 | ### Include Chart.js on your page 14 | ```html 15 | 16 | ``` 17 | Or better yet... if you are using WebJAR you can simply include the following line in your build.sbt 18 | ```sbt 19 | "org.webjars" % "chartjs" % "1.0.2" 20 | ``` 21 | 22 | ### Build.sbt 23 | Add the following dependency to your porject. 24 | 25 | `"io.surfkit" %%% "scalajs-chart" % "0.1-SNAPSHOT",` 26 | 27 | ## Some Examples 28 | Here are some of the Chartjs examples demonstrated in a type safe scalaJS way. 29 | 30 | ### TODO 31 | Initialize ... 32 | ```scala 33 | object todo{ 34 | 35 | } 36 | ``` 37 | 38 | 39 | -------------------------------------------------------------------------------- /build.sbt: -------------------------------------------------------------------------------- 1 | import SonatypeKeys._ 2 | 3 | import sbt.Keys._ 4 | 5 | lazy val root = project.in(file(".")). 6 | enablePlugins(ScalaJSPlugin).settings( 7 | credentials += Credentials(Path.userHome / ".ivy2" / ".credentials"), 8 | resolvers += "NextWave Repo" at "http://maxdevmaster.cloudapp.net:4343/artifactory/nxtwv-maven/", 9 | publishTo := Some("NextWave Repo" at "http://maxdevmaster.cloudapp.net:4343/artifactory/nxtwv-maven/") 10 | ) 11 | 12 | lazy val demo = (project in file("demo")) 13 | .settings(demoSettings:_*) 14 | .enablePlugins(ScalaJSPlugin) 15 | .dependsOn(root) 16 | 17 | 18 | lazy val demoSettings = Seq( 19 | name := s"chart-demo", 20 | scalaVersion := "2.11.8", 21 | libraryDependencies ++= Seq( 22 | "org.scala-js" %%% "scalajs-dom" % "0.9.0" 23 | ) 24 | ) 25 | 26 | name := "Type-safe and Scala-friendly library over Chart.js" 27 | 28 | normalizedName := "scalajs-chart" 29 | 30 | version := "0.0.2-SNAPSHOT" 31 | 32 | organization := "io.surfkit" 33 | 34 | scalaVersion := "2.11.8" 35 | 36 | crossScalaVersions := Seq("2.10.4", "2.11.8") 37 | 38 | libraryDependencies ++= Seq( 39 | "org.scala-js" %%% "scalajs-dom" % "0.9.0" 40 | ) 41 | 42 | jsDependencies in Test += RuntimeDOM 43 | 44 | homepage := Some(url("http://www.surfkit.io/")) 45 | 46 | licenses += ("MIT License", url("http://www.opensource.org/licenses/mit-license.php")) 47 | 48 | scmInfo := Some(ScmInfo( 49 | url("https://github.com/coreyauger/scalajs-chart"), 50 | "scm:git:git@github.com/coreyauger/scalajs-chart.git", 51 | Some("scm:git:git@github.com:coreyauger/scalajs-chart.git"))) 52 | 53 | publishMavenStyle := true 54 | 55 | 56 | pomExtra := ( 57 | 58 | 59 | coreyauger 60 | Corey Auger 61 | https://github.com/coreyauger/ 62 | 63 | 64 | ) 65 | 66 | pomIncludeRepository := { _ => false } 67 | -------------------------------------------------------------------------------- /demo/index-fastopt.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Example Scala.js application 5 | 6 | 10 | 11 | 12 | 13 |

Example Scala.js application - fast-optimized version

14 | 15 |
16 |
17 | 18 | 19 |
20 |
21 | 22 | 23 | 24 | 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /demo/src/main/scala/ScalaJSChartExample.scala: -------------------------------------------------------------------------------- 1 | package demo 2 | 3 | 4 | import org.scalajs.dom._ 5 | 6 | import scala.scalajs.js 7 | import js.annotation.JSExport 8 | import org.scalajs.dom 9 | 10 | object ScalaJSChartExample extends js.JSApp { 11 | def main(): Unit = { 12 | 13 | 14 | 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /project/build.properties: -------------------------------------------------------------------------------- 1 | sbt.version=0.13.7 2 | 3 | -------------------------------------------------------------------------------- /project/plugins.sbt: -------------------------------------------------------------------------------- 1 | addSbtPlugin("org.scala-js" % "sbt-scalajs" % "0.6.8") 2 | 3 | addSbtPlugin("com.jsuereth" % "sbt-pgp" % "1.0.0") 4 | 5 | addSbtPlugin("org.xerial.sbt" % "sbt-sonatype" % "0.2.2") 6 | 7 | -------------------------------------------------------------------------------- /src/main/scala/io/surfkit/clientlib/Chart.scala: -------------------------------------------------------------------------------- 1 | package io.surfkit.clientlib 2 | 3 | import scala.scalajs.js 4 | import js.annotation._ 5 | import js.JSConverters._ 6 | 7 | package chart { 8 | 9 | import org.scalajs.dom.Event 10 | import org.scalajs.dom.CanvasRenderingContext2D 11 | 12 | @js.native 13 | trait ChartDataSet extends js.Object { 14 | var label: String = js.native 15 | var fillColor: String = js.native 16 | var strokeColor: String = js.native 17 | var pointColor: String = js.native 18 | var pointStrokeColor: String = js.native 19 | var pointHighlightFill: String = js.native 20 | var pointHighlightStroke: String = js.native 21 | var highlightFill: String = js.native 22 | var highlightStroke: String = js.native 23 | var data: js.Array[Double] = js.native 24 | } 25 | 26 | object ChartDataSet { 27 | def apply( 28 | label: js.UndefOr[String] = js.undefined, 29 | fillColor: js.UndefOr[String] = js.undefined, 30 | strokeColor: js.UndefOr[String] = js.undefined, 31 | pointColor: js.UndefOr[String] = js.undefined, 32 | pointStrokeColor: js.UndefOr[String] = js.undefined, 33 | pointHighlightFill: js.UndefOr[String] = js.undefined, 34 | pointHighlightStroke: js.UndefOr[String] = js.undefined, 35 | highlightFill: js.UndefOr[String] = js.undefined, 36 | highlightStroke: js.UndefOr[String] = js.undefined, 37 | data: js.UndefOr[js.Array[Double]] = js.undefined 38 | ): ChartDataSet = { 39 | val result = js.Dynamic.literal() 40 | label.foreach(result.label = _) 41 | fillColor.foreach(result.fillColor = _) 42 | strokeColor.foreach(result.strokeColor = _) 43 | pointColor.foreach(result.pointColor = _) 44 | pointStrokeColor.foreach(result.pointStrokeColor = _) 45 | pointHighlightFill.foreach(result.pointHighlightFill = _) 46 | pointHighlightStroke.foreach(result.pointHighlightStroke = _) 47 | highlightFill.foreach(result.highlightFill = _) 48 | highlightStroke.foreach(result.highlightStroke = _) 49 | data.foreach(result.data = _) 50 | result.asInstanceOf[ChartDataSet] 51 | } 52 | } 53 | 54 | 55 | @js.native 56 | trait LinearChartData extends js.Object { 57 | var labels: js.Array[String] = js.native 58 | var datasets: js.Array[ChartDataSet] = js.native 59 | } 60 | 61 | object LinearChartData { 62 | def apply( 63 | labels: Seq[String] = Seq.empty[String], 64 | datasets: Seq[ChartDataSet] = Seq.empty[ChartDataSet] 65 | ): LinearChartData = { 66 | 67 | js.Dynamic.literal( 68 | labels = labels.toJSArray, 69 | datasets = datasets.toJSArray 70 | ).asInstanceOf[LinearChartData] 71 | } 72 | } 73 | 74 | 75 | @js.native 76 | trait CircularChartData extends js.Object { 77 | var value: Double = js.native 78 | var color: String = js.native 79 | var highlight: String = js.native 80 | var label: String = js.native 81 | } 82 | 83 | object CircularChartData { 84 | def apply( 85 | value: Double = 1, 86 | color: String = null, 87 | highlight: String = null, 88 | label: String = null 89 | ): CircularChartData = { 90 | js.Dynamic.literal( 91 | value = value, 92 | color = color, 93 | highlight = highlight, 94 | label = label 95 | ).asInstanceOf[CircularChartData] 96 | } 97 | } 98 | 99 | @js.native 100 | trait ChartSettings extends js.Object { 101 | var animation: Boolean = js.native 102 | var animationSteps: Double = js.native 103 | var animationEasing: String = js.native 104 | var showScale: Boolean = js.native 105 | var scaleOverride: Boolean = js.native 106 | var scaleLineColor: String = js.native 107 | var scaleLineWidth: Double = js.native 108 | var scaleShowLabels: Boolean = js.native 109 | var scaleLabel: String = js.native 110 | var scaleIntegersOnly: Boolean = js.native 111 | var scaleBeginAtZero: Boolean = js.native 112 | var scaleFontFamily: String = js.native 113 | var scaleFontSize: Double = js.native 114 | var scaleFontStyle: String = js.native 115 | var scaleFontColor: String = js.native 116 | var responsive: Boolean = js.native 117 | var maintainAspectRatio: Boolean = js.native 118 | var showTooltips: Boolean = js.native 119 | var tooltipEvents: js.Array[String] = js.native 120 | var tooltipFillColor: String = js.native 121 | var tooltipFontFamily: String = js.native 122 | var tooltipFontSize: Double = js.native 123 | var tooltipFontStyle: String = js.native 124 | var tooltipFontColor: String = js.native 125 | var tooltipTitleFontFamily: String = js.native 126 | var tooltipTitleFontSize: Double = js.native 127 | var tooltipTitleFontStyle: String = js.native 128 | var tooltipTitleFontColor: String = js.native 129 | var tooltipYPadding: Double = js.native 130 | var tooltipXPadding: Double = js.native 131 | var tooltipCaretSize: Double = js.native 132 | var tooltipCornerRadius: Double = js.native 133 | var tooltipXOffset: Double = js.native 134 | var tooltipTemplate: String = js.native 135 | var multiTooltipTemplate: String = js.native 136 | var onAnimationProgress: js.Function0[Any] = js.native 137 | var onAnimationComplete: js.Function0[Any] = js.native 138 | } 139 | 140 | 141 | object ChartSettings { 142 | def apply( 143 | animation: Boolean = true, 144 | animationSteps: Double = 60, 145 | animationEasing: String = "easeOutQuart", 146 | showScale: Boolean = true, 147 | scaleOverride: Boolean = false, 148 | scaleLineColor: String = "rgba(0,0,0,0.1)", 149 | scaleLineWidth: Double = 1, 150 | scaleShowLabels: Boolean = true, 151 | scaleLabel: String = "<%value%>", 152 | scaleIntegersOnly: Boolean = true, 153 | scaleBeginAtZero: Boolean = false, 154 | scaleFontFamily: String = "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", 155 | scaleFontSize: Double = 12, 156 | scaleFontStyle: String = "normal", 157 | scaleFontColor: String = "#666", 158 | responsive: Boolean = true, 159 | maintainAspectRatio: Boolean = false, 160 | showTooltips: Boolean = true, 161 | tooltipEvents: Seq[String] = Seq("mousemove", "touchstart", "touchmove"), 162 | tooltipFillColor: String = "rgba(0,0,0,0.8)", 163 | tooltipFontFamily: String = "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", 164 | tooltipFontSize: Double = 14, 165 | tooltipFontStyle: String = "normal", 166 | tooltipFontColor: String = "#fff", 167 | tooltipTitleFontFamily: String = "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif", 168 | tooltipTitleFontSize: Double = 14, 169 | tooltipTitleFontStyle: String = "bold", 170 | tooltipTitleFontColor: String = "#fff", 171 | tooltipYPadding: Double = 6, 172 | tooltipXPadding: Double = 6, 173 | tooltipCaretSize: Double = 8, 174 | tooltipCornerRadius: Double = 6, 175 | tooltipXOffset: Double = 10, 176 | tooltipTemplate: String = "<%if (label){%><%=label%>: <%}%><%= value %>", 177 | multiTooltipTemplate: String = "<%= value %>", 178 | onAnimationProgress: js.Function0[Any] = () => {}, 179 | onAnimationComplete: js.Function0[Any] = () => {} 180 | ): ChartSettings = { 181 | js.Dynamic.literal( 182 | animation = animation, 183 | animationSteps = animationSteps, 184 | animationEasing = animationEasing, 185 | showScale = showScale, 186 | scaleOverride = scaleOverride, 187 | scaleLineColor = scaleLineColor, 188 | scaleLineWidth = scaleLineWidth, 189 | scaleShowLabels = scaleShowLabels, 190 | scaleLabel = scaleLabel, 191 | scaleIntegersOnly = scaleIntegersOnly, 192 | scaleBeginAtZero = scaleBeginAtZero, 193 | scaleFontFamily = scaleFontFamily, 194 | scaleFontSize = scaleFontSize, 195 | scaleFontStyle = scaleFontStyle, 196 | scaleFontColor = scaleFontColor, 197 | responsive = responsive, 198 | maintainAspectRatio = maintainAspectRatio, 199 | showTooltips = showTooltips, 200 | tooltipEvents = tooltipEvents.toJSArray, 201 | tooltipFillColor = tooltipFillColor, 202 | tooltipFontFamily = tooltipFontFamily, 203 | tooltipFontSize = tooltipFontSize, 204 | tooltipFontStyle = tooltipFontStyle, 205 | tooltipFontColor = tooltipFontColor, 206 | tooltipTitleFontFamily = tooltipTitleFontFamily, 207 | tooltipTitleFontSize = tooltipTitleFontSize, 208 | tooltipTitleFontStyle = tooltipTitleFontStyle, 209 | tooltipTitleFontColor = tooltipTitleFontColor, 210 | tooltipYPadding = tooltipYPadding, 211 | tooltipXPadding = tooltipXPadding, 212 | tooltipCaretSize = tooltipCaretSize, 213 | tooltipCornerRadius = tooltipCornerRadius, 214 | tooltipXOffset = tooltipXOffset, 215 | tooltipTemplate = tooltipTemplate, 216 | multiTooltipTemplate = multiTooltipTemplate, 217 | onAnimationProgress = onAnimationProgress, 218 | onAnimationComplete = onAnimationComplete 219 | ).asInstanceOf[ChartSettings] 220 | } 221 | } 222 | 223 | @js.native 224 | trait ChartOptions extends js.Object { 225 | var scaleShowGridLines: Boolean = js.native 226 | var scaleGridLineColor: String = js.native 227 | var scaleGridLineWidth: Double = js.native 228 | var legendTemplate: String = js.native 229 | } 230 | 231 | object ChartOptions { 232 | def apply( 233 | scaleShowGridLines: Boolean = false, 234 | scaleGridLineColor: String = null, 235 | scaleGridLineWidth: Double = 1.0, 236 | legendTemplate: String = null 237 | ): ChartOptions = { 238 | js.Dynamic.literal( 239 | scaleShowGridLines = scaleShowGridLines, 240 | scaleGridLineColor = scaleGridLineColor, 241 | scaleGridLineWidth = scaleGridLineWidth, 242 | legendTemplate = legendTemplate 243 | ).asInstanceOf[ChartOptions] 244 | } 245 | } 246 | 247 | @js.native 248 | trait PointsAtEvent extends js.Object { 249 | var value: Double = js.native 250 | var label: String = js.native 251 | var datasetLabel: String = js.native 252 | var strokeColor: String = js.native 253 | var fillColor: String = js.native 254 | var highlightFill: String = js.native 255 | var highlightStroke: String = js.native 256 | var x: Double = js.native 257 | var y: Double = js.native 258 | } 259 | 260 | @js.native 261 | trait ChartInstance extends js.Object { 262 | var clear: js.Function0[Unit] = js.native 263 | var stop: js.Function0[Unit] = js.native 264 | var resize: js.Function0[Unit] = js.native 265 | var destroy: js.Function0[Unit] = js.native 266 | var toBase64Image: js.Function0[String] = js.native 267 | var generateLegend: js.Function0[String] = js.native 268 | } 269 | 270 | @js.native 271 | trait LinearInstance extends ChartInstance { 272 | var getPointsAtEvent: js.Function1[Event, js.Array[PointsAtEvent]] = js.native 273 | var update: js.Function0[Unit] = js.native 274 | var addData: js.Function2[js.Array[Double], String, Unit] = js.native 275 | var removeData: js.Function0[Unit] = js.native 276 | } 277 | 278 | @js.native 279 | trait CircularInstance extends ChartInstance { 280 | var getSegmentsAtEvent: js.Function1[Event, js.Array[js.Any]] = js.native 281 | var update: js.Function0[Unit] = js.native 282 | var addData: js.Function2[CircularChartData, Double, Unit] = js.native 283 | var removeData: js.Function1[Double, Unit] = js.native 284 | var segments: js.Array[CircularChartData] = js.native 285 | } 286 | 287 | @js.native 288 | trait LineChartOptions extends ChartOptions { 289 | var scaleShowHorizontalLines: Boolean = js.native 290 | var scaleShowVerticalLines: Boolean = js.native 291 | var bezierCurve: Boolean = js.native 292 | var bezierCurveTension: Double = js.native 293 | var pointDot: Boolean = js.native 294 | var pointDotRadius: Double = js.native 295 | var pointDotStrokeWidth: Double = js.native 296 | var pointHitDetectionRadius: Double = js.native 297 | var datasetStroke: Boolean = js.native 298 | var datasetStrokeWidth: Double = js.native 299 | var datasetFill: Boolean = js.native 300 | var responsive: Boolean = js.native 301 | var maintainAspectRatio: Boolean = js.native 302 | } 303 | 304 | object LineChartOptions { 305 | def apply( 306 | scaleShowHorizontalLines: Boolean = true, 307 | scaleShowVerticalLines: Boolean = true, 308 | bezierCurve: Boolean = true, 309 | bezierCurveTension: Double = 1.0, 310 | pointDot: Boolean = true, 311 | pointDotRadius: Double = 2.0, 312 | pointDotStrokeWidth: Double = 1.0, 313 | pointHitDetectionRadius: Double = 2.0, 314 | datasetStroke: Boolean = true, 315 | datasetStrokeWidth: Double = 1.0, 316 | datasetFill: Boolean = true, 317 | responsive: Boolean = true, 318 | maintainAspectRatio: Boolean = false 319 | ): LineChartOptions = { 320 | js.Dynamic.literal( 321 | scaleShowHorizontalLines = scaleShowHorizontalLines, 322 | scaleShowVerticalLines = scaleShowVerticalLines, 323 | bezierCurve = bezierCurve, 324 | bezierCurveTension = bezierCurveTension, 325 | pointDot = pointDot, 326 | pointDotRadius = pointDotRadius, 327 | pointDotStrokeWidth = pointDotStrokeWidth, 328 | pointHitDetectionRadius = pointHitDetectionRadius, 329 | datasetStroke = datasetStroke, 330 | datasetStrokeWidth = datasetStrokeWidth, 331 | datasetFill = datasetFill, 332 | responsive = responsive, 333 | maintainAspectRatio = maintainAspectRatio 334 | ).asInstanceOf[LineChartOptions] 335 | } 336 | } 337 | 338 | @js.native 339 | trait BarChartOptions extends ChartOptions { 340 | var scaleBeginAtZero: Boolean = js.native 341 | var scaleShowHorizontalLines: Boolean = js.native 342 | var scaleShowVerticalLines: Boolean = js.native 343 | var barShowStroke: Boolean = js.native 344 | var barStrokeWidth: Double = js.native 345 | var barValueSpacing: Double = js.native 346 | var barDatasetSpacing: Double = js.native 347 | var responsive: Boolean = js.native 348 | var maintainAspectRatio: Boolean = js.native 349 | } 350 | 351 | 352 | object BarChartOptions { 353 | def apply( 354 | scaleBeginAtZero: js.UndefOr[Boolean] = js.undefined, 355 | scaleShowHorizontalLines: js.UndefOr[Boolean] = js.undefined, 356 | scaleShowVerticalLines: js.UndefOr[Boolean] = js.undefined, 357 | barShowStroke: js.UndefOr[Boolean] = js.undefined, 358 | barStrokeWidth: js.UndefOr[Double] = js.undefined, 359 | barValueSpacing: js.UndefOr[Double] = js.undefined, 360 | barDatasetSpacing: js.UndefOr[Double] = js.undefined, 361 | responsive: js.UndefOr[Boolean] = js.undefined, 362 | maintainAspectRatio: js.UndefOr[Boolean] = js.undefined 363 | ): BarChartOptions = { 364 | val result = js.Dynamic.literal() 365 | scaleBeginAtZero.foreach(result.scaleBeginAtZero = _) 366 | scaleShowHorizontalLines.foreach(result.scaleShowHorizontalLines = _) 367 | scaleShowVerticalLines.foreach(result.scaleShowVerticalLines = _) 368 | barShowStroke.foreach(result.barShowStroke = _) 369 | barValueSpacing.foreach(result.barValueSpacing = _) 370 | barStrokeWidth.foreach(result.barStrokeWidth = _) 371 | barDatasetSpacing.foreach(result.barDatasetSpacing = _) 372 | responsive.foreach(result.responsive = _) 373 | maintainAspectRatio.foreach(result.maintainAspectRatio = _) 374 | result.asInstanceOf[BarChartOptions] 375 | } 376 | } 377 | 378 | @js.native 379 | trait RadarChartOptions extends js.Object { 380 | var scaleShowLine: Boolean = js.native 381 | var angleShowLineOut: Boolean = js.native 382 | var scaleShowLabels: Boolean = js.native 383 | var scaleBeginAtZero: Boolean = js.native 384 | var angleLineColor: String = js.native 385 | var angleLineWidth: Double = js.native 386 | var pointLabelFontFamily: String = js.native 387 | var pointLabelFontStyle: String = js.native 388 | var pointLabelFontSize: Double = js.native 389 | var pointLabelFontColor: String = js.native 390 | var pointDot: Boolean = js.native 391 | var pointDotRadius: Double = js.native 392 | var pointDotStrokeWidth: Double = js.native 393 | var pointHitDetectionRadius: Double = js.native 394 | var datasetStroke: Boolean = js.native 395 | var datasetStrokeWidth: Double = js.native 396 | var datasetFill: Boolean = js.native 397 | var legendTemplate: String = js.native 398 | } 399 | 400 | object RadarChartOptions { 401 | def apply( 402 | scaleShowLine: Boolean = true, 403 | angleShowLineOut: Boolean = true, 404 | scaleShowLabels: Boolean = false, 405 | scaleBeginAtZero: Boolean = true, 406 | angleLineColor: String = "rgba(0,0,0,.1)", 407 | angleLineWidth: Double = 1, 408 | pointLabelFontFamily: String = "'Arial'", 409 | pointLabelFontStyle: String = "normal", 410 | pointLabelFontSize: Double = 10, 411 | pointLabelFontColor: String = "#666", 412 | pointDot: Boolean = true, 413 | pointDotRadius: Double = 3, 414 | pointDotStrokeWidth: Double = 1, 415 | pointHitDetectionRadius: Double = 20, 416 | datasetStroke: Boolean = true, 417 | datasetStrokeWidth: Double = 2, 418 | datasetFill: Boolean = true, 419 | legendTemplate: String = "" 420 | ): RadarChartOptions = { 421 | js.Dynamic.literal( 422 | scaleShowLine = scaleShowLine, 423 | angleShowLineOut = angleShowLineOut, 424 | scaleShowLabels = scaleShowLabels, 425 | scaleBeginAtZero = scaleBeginAtZero, 426 | angleLineColor = angleLineColor, 427 | angleLineWidth = angleLineWidth, 428 | pointLabelFontFamily = pointLabelFontFamily, 429 | pointLabelFontStyle = pointLabelFontStyle, 430 | pointLabelFontSize = pointLabelFontSize, 431 | pointLabelFontColor = pointLabelFontColor, 432 | pointDot = pointDot, 433 | pointDotRadius = pointDotRadius, 434 | pointDotStrokeWidth = pointDotStrokeWidth, 435 | pointHitDetectionRadius = pointHitDetectionRadius, 436 | datasetStroke = datasetStroke, 437 | datasetStrokeWidth = datasetStrokeWidth, 438 | datasetFill = datasetFill, 439 | legendTemplate = legendTemplate 440 | ).asInstanceOf[RadarChartOptions] 441 | } 442 | } 443 | 444 | @js.native 445 | trait PolarAreaChartOptions extends js.Object { 446 | var scaleShowLabelBackdrop: Boolean = js.native 447 | var scaleBackdropColor: String = js.native 448 | var scaleBeginAtZero: Boolean = js.native 449 | var scaleBackdropPaddingY: Double = js.native 450 | var scaleBackdropPaddingX: Double = js.native 451 | var scaleShowLine: Boolean = js.native 452 | var segmentShowStroke: Boolean = js.native 453 | var segmentStrokeColor: String = js.native 454 | var segmentStrokeWidth: Double = js.native 455 | var animationSteps: Double = js.native 456 | var animationEasing: String = js.native 457 | var animateRotate: Boolean = js.native 458 | var animateScale: Boolean = js.native 459 | var legendTemplate: String = js.native 460 | } 461 | 462 | object PolarAreaChartOptions { 463 | def apply ( 464 | scaleShowLabelBackdrop: Boolean = true, 465 | scaleBackdropColor: String = "rgba(255,255,255,0.75)", 466 | scaleBeginAtZero: Boolean = true, 467 | scaleBackdropPaddingY: Double = 2, 468 | scaleBackdropPaddingX: Double = 2, 469 | scaleShowLine: Boolean = true, 470 | segmentShowStroke: Boolean = true, 471 | segmentStrokeColor: String = "#fff", 472 | segmentStrokeWidth: Double = 2, 473 | animationSteps: Double = 100, 474 | animationEasing: String = "easeOutBounce", 475 | animateRotate: Boolean = true, 476 | animateScale: Boolean = false, 477 | legendTemplate: String = "" 478 | ):PolarAreaChartOptions = { 479 | js.Dynamic.literal( 480 | scaleShowLabelBackdrop = scaleShowLabelBackdrop, 481 | scaleBackdropColor = scaleBackdropColor, 482 | scaleBeginAtZero = scaleBeginAtZero, 483 | scaleBackdropPaddingY = scaleBackdropPaddingY, 484 | scaleBackdropPaddingX = scaleBackdropPaddingX, 485 | scaleShowLine = scaleShowLine, 486 | segmentShowStroke = segmentShowStroke, 487 | segmentStrokeColor = segmentStrokeColor, 488 | segmentStrokeWidth = segmentStrokeWidth, 489 | animationEasing = animationEasing, 490 | animateRotate = animateRotate, 491 | animateScale = animateScale, 492 | legendTemplate = legendTemplate 493 | ).asInstanceOf[PolarAreaChartOptions] 494 | } 495 | } 496 | 497 | @js.native 498 | trait PieChartOptions extends js.Object { 499 | var segmentShowStroke: Boolean = js.native 500 | var segmentStrokeColor: String = js.native 501 | var segmentStrokeWidth: Double = js.native 502 | var percentageInnerCutout: Double = js.native 503 | var animationSteps: Double = js.native 504 | var animationEasing: String = js.native 505 | var animateRotate: Boolean = js.native 506 | var animateScale: Boolean = js.native 507 | var legendTemplate: String = js.native 508 | } 509 | 510 | object PieChartOptions { 511 | def apply( 512 | segmentShowStroke: Boolean = true, 513 | segmentStrokeColor: String = "#fff", 514 | segmentStrokeWidth: Double = 2, 515 | percentageInnerCutout: Double = 0, // Default is 50 for doughnut 516 | animationSteps: Double = 100, 517 | animationEasing: String = "easeOutBounce", 518 | animateRotate: Boolean = true, 519 | animateScale: Boolean = false, 520 | legendTemplate: String = "" 521 | ):PieChartOptions = { 522 | js.Dynamic.literal( 523 | segmentShowStroke = segmentShowStroke, 524 | segmentStrokeColor = segmentStrokeColor, 525 | segmentStrokeWidth = segmentStrokeWidth, 526 | percentageInnerCutout = percentageInnerCutout, 527 | animationSteps = animationSteps, 528 | animationEasing = animationEasing, 529 | animateRotate = animateRotate, 530 | animateScale = animateScale, 531 | legendTemplate = legendTemplate 532 | ).asInstanceOf[PieChartOptions] 533 | } 534 | } 535 | 536 | 537 | @js.native 538 | class Chart protected() extends js.Object { 539 | def this(context: CanvasRenderingContext2D) = this() 540 | 541 | def Line(data: LinearChartData, options: LineChartOptions = null): LinearInstance = js.native 542 | 543 | def Bar(data: LinearChartData, options: BarChartOptions = null): LinearInstance = js.native 544 | 545 | def Radar(data: LinearChartData, options: RadarChartOptions = null): LinearInstance = js.native 546 | 547 | def PolarArea(data: js.Array[CircularChartData], options: PolarAreaChartOptions = null): CircularInstance = js.native 548 | 549 | def Pie(data: js.Array[CircularChartData], options: PieChartOptions = null): CircularInstance = js.native 550 | 551 | def Doughnut(data: js.Array[CircularChartData], options: PieChartOptions = null): CircularInstance = js.native 552 | } 553 | 554 | @js.native 555 | object Chart extends js.Object { 556 | var defaults: js.Any = js.native 557 | } 558 | 559 | } 560 | --------------------------------------------------------------------------------