ember-highcharts - npm Package Compare versions

Comparing version 0.4.3 to 0.4.4

addon/components/high-charts.js

@@ -47,7 +47,2 @@ import Ember from 'ember';
 
-    let noData = chart.get('noData');
-    if (noData != null) {
-      noData.remove();
-    }
-
     const isStockChart = mode === 'StockChart';
@@ -54,0 +49,0 @@

CHANGELOG.md

 # Changelog
 
+## 0.4.4
+
+- Add test for 'noData' use case and remove unused code
+- Add highmaps demo
+- Cleanup documentation
+- Add chart drilldown demo
+- Add solid gauge demo
+- Add sales funnel demo
+- Add heat map demo
+- Add waterfall demo
+- Standardize components in dummp app
+- Update to ember-cli 2.5.1
+- Fix import boost module before hightchart-3d
+- Add scatter chart demo
+
 ## 0.4.3
@@ -4,0 +19,0 @@

index.js

@@ -18,3 +18,3 @@ /* jshint node: true */
 
-    if (options.includeHighCharts || options.includeHighCharts3D) {
+    if (options.includeHighCharts) {
       app.import(path.join(highchartsPath, 'highcharts.src.js'));
@@ -36,2 +36,11 @@ }
     if (options.includeHighCharts3D) {
+      // boost module need to be imported before highcharts-3d
+      if (options.includeModules) {
+        var boostIndex = options.includeModules.indexOf('boost');
+        if (boostIndex !== -1) {
+          app.import(path.join(highchartsPath, 'modules', 'boost.src.js'));
+          options.includeModules.splice(boostIndex, 1);
+        }
+      }
+
       app.import(path.join(highchartsPath, 'highcharts-3d.src.js'));
@@ -38,0 +47,0 @@ }

package.json

 {
   "name": "ember-highcharts",
-  "version": "0.4.3",
+  "version": "0.4.4",
   "description": "A Highcharts, HighStock and HighMaps component for ember cli",
@@ -23,14 +23,15 @@ "directories": {
     "broccoli-merge-trees": "^1.1.1",
-    "ember-cli-babel": "^5.1.5",
+    "ember-cli-babel": "^5.1.6",
     "ember-getowner-polyfill": "1.0.1"
   },
   "devDependencies": {
-    "broccoli-asset-rev": "^2.2.0",
-    "ember-cli": "2.4.2",
+    "broccoli-asset-rev": "^2.4.2",
+    "ember-cli": "2.5.1",
     "ember-cli-app-version": "^1.0.0",
     "ember-cli-dependency-checker": "^1.2.0",
-    "ember-cli-htmlbars": "^1.0.1",
+    "ember-cli-htmlbars": "^1.0.3",
     "ember-cli-htmlbars-inline-precompile": "^0.3.1",
-    "ember-cli-inject-live-reload": "^1.3.1",
-    "ember-cli-qunit": "^1.2.1",
+    "ember-cli-inject-live-reload": "^1.4.0",
+    "ember-cli-jshint": "^1.0.0",
+    "ember-cli-qunit": "^1.4.0",
     "ember-cli-release": "0.2.8",
@@ -41,6 +42,6 @@ "ember-cli-sri": "^2.1.0",
     "ember-disable-proxy-controllers": "^1.0.1",
-    "ember-export-application-global": "^1.0.4",
+    "ember-export-application-global": "^1.0.5",
     "ember-load-initializers": "^0.5.1",
     "ember-resolver": "^2.0.3",
-    "ember-try": "~0.1.2",
+    "ember-try": "^0.2.2",
     "highcharts": "^4.2.4",
@@ -47,0 +48,0 @@ "loader.js": "^4.0.1"

README.md

@@ -6,6 +6,16 @@ [![Build Status](https://travis-ci.org/ahmadsoe/ember-highcharts.svg?branch=master)](https://travis-ci.org/ahmadsoe/ember-highcharts)
 
+
 # Ember-highcharts
 
-A [Highcharts](http://www.highcharts.com/products/highcharts), [Highstock](http://www.highcharts.com/products/highstock) and [Highmaps](http://www.highcharts.com/products/highmaps) component for [Ember CLI](http://www.ember-cli.com/).
+A [Highcharts](http://www.highcharts.com/products/highcharts), [Highstock](http://www.highcharts.com/products/highstock),
+and [Highmaps](http://www.highcharts.com/products/highmaps) component for [Ember CLI](http://www.ember-cli.com/).
 
+
+## Requirements
+
+* Ember CLI
+* Ember >= 1.13.0
+* If you need support for Ember < 1.13.0, use ember-highcharts v0.1.3
+
+
 ## Installation
@@ -17,34 +27,42 @@
 
-This addon will use Highcharts by default, if you want to use Highstocks, Highmaps, Highcharts-more, Highcharts-3D and/or additional modules, add this options to your `ember-cli-build.js`:
 
-```javascript
-var app = new EmberApp({
-  ---
-  emberHighCharts: {
-    includeHighCharts: false,
-    includeHighStock: true,
-    includeHighMaps: true,
-    includeHighChartsMore: true,
-    includeHighCharts3D: true,
-    includeModules: ['broken-axis', 'heatmap', ... ] // available modules: broken-axis, canvas-tools, data, drilldowm, exporting, funnel, heatmap, no-data-to-display, solid-gauge, treemap
-  }
-  ---
-});
-```
-
-## Requirements
-* Ember >= 1.13.0
-  * If you need support for < Ember 1.13.0, use ember-highcharts v0.1.3
-
 ## Usage
 
-In your template:
+This component takes in four arguments:
 
 ```handlebars
-{{high-charts mode=chartMode content=chartData chartOptions=chartOptions theme=theme}}
+{{high-charts mode=mode chartOptions=chartOptions content=content theme=theme}}
 ```
+### mode
 
-Then in a controller you can set the `chartMode`, `chartData`, `chartOptions` and `theme` values:
+The `mode` argument is optional and it determines whether to use Highcharts, Highstock, or Highmaps.
+The possible values are:
 
-```javascript
+| Value          | Description                 |
+| -------------- | --------------------------- |
+| falsy value    | defaults to Highcharts mode |
+| "StockChart"   | uses Highstock mode         |
+| "Map"          | uses Highmaps mode          |
+
+### chartOptions
+
+The `chartOptions` argument is a generic object for setting different options with Highcharts/Highstock/Highmaps.
+Use this option to set things like the chart title and axis settings.
+
+### content
+
+The `content` argument matches up with the `series` option in the Highcharts/Highstock/Highmaps API.
+Use this option to set the series data for your chart.
+
+### theme
+
+The `theme` argument is optional and it allows you to pass in a
+[Highcharts theme](http://www.highcharts.com/docs/chart-design-and-style/themes).
+
+### Example Bar Chart
+
+Here's an example of how to create a basic bar chart:
+
+```js
+// controller
 import Ember from 'ember';
@@ -54,10 +72,6 @@ import defaultTheme from '../themes/default-theme';
 export default Ember.Controller.extend({
-  chartMode: 'StockChart', // Available options: a falsy value, 'StockChart', 'Map'.
-                           // If `mode` is not provided or is a falsy value, the chart is initialized in Charts mode.
-                           // If `mode` is a string, it is passed to Highcharts as the first argument.
-                           // When Highcharts introduces a new mode, you will be able to use it here right away.
 
   chartOptions: {
     chart: {
-        type: 'bar'
+      type: 'bar'
     },
@@ -72,3 +86,3 @@ title: {
       title: {
-          text: 'Fruit eaten'
+        text: 'Fruit eaten'
       }
@@ -78,35 +92,103 @@ }
 
-  chartData: [
-    {
-      name: 'Jane',
-      data: [1, 0, 4]
-    }, {
-      name: 'John',
-      data: [5, 7, 3]
-    }
-  ],
+  chartData: [{
+    name: 'Jane',
+    data: [1, 0, 4]
+  }, {
+    name: 'John',
+    data: [5, 7, 3]
+  }],
 
   theme: defaultTheme
+
 });
 ```
 
-### Configuring Default Styles
+```handlebars
+{{high-charts chartOptions=chartOptions content=chartData theme=theme}}
+```
 
-Ember-highcharts provides its own set of default configurations in
-`addon/utils/option-loader.js`.  At runtime you can optionally configure custom
-styles by providing a `app/highcharts-configs/application.js` file.  This
-file should provide a hook that returns the final configuration.
+Check out more chart examples in the [tests/dummy app](tests/dummy/app) in this repo.
 
-```javascript
- // app/highcharts-configs/application.js
 
- export default function(defaultOptions) {
-   defaultOptions.credits.href = 'http://www.my-great-chart.com';
-   defaultOptions.credits.text = 'great charts made cheap';
-   defaultOptions.credits.enabled = true;
+## Configuration
 
-   return defaultOptions;
- }
+This addon will load Highcharts by default. Highcharts has many optional features like Highstock and Highmaps.
+You can add the `emberHighCharts` option to your `ember-cli-build.js` file to load these optional features:
+
+```js
+// all possible options
+var app = new EmberApp({
+  emberHighCharts: {
+    includeHighCharts: false,
+    includeHighStock: true,
+    includeHighMaps: false,
+    includeHighChartsMore: true,
+    includeHighCharts3D: true,
+    includeModules: ['map', 'broken-axis', 'heatmap', ... ]
+    /* available modules:
+      boost, broken-axis, canvas-tools, data, drilldown, exporting, funnel,
+      heatmap, map, no-data-to-display, offline-exporting, solid-gauge, treemap
+    */
+  }
+});
 ```
 
+### Highstock
+
+Highcharts is already included in Highstock, so it is not necessary to load both.
+Using the following configuration to load Highstock:
+
+```js
+var app = new EmberApp({
+  emberHighCharts: {
+    includeHighCharts: false,
+    includeHighStock: true
+  }
+});
+```
+
+
+### Highmaps
+
+Highcharts is not included in Highmaps. If you only need to use Highmaps use the following configuration:
+
+```js
+var app = new EmberApp({
+  emberHighCharts: {
+    includeHighCharts: false,
+    includeHighMaps: true
+  }
+});
+```
+
+If you need to use Highmaps and Highcharts then use the following configuration:
+
+```js
+var app = new EmberApp({
+  emberHighCharts: {
+    includeHighCharts: true,
+    includeModules: ['map']
+  }
+});
+```
+
+
+### Global Highcharts Config Options
+
+Ember-highcharts provides its own set of default configurations in `addon/utils/option-loader.js`.
+At runtime you can optionally configure custom styles by providing a `app/highcharts-configs/application.js` file.
+This file should provide a hook that returns the final configuration.
+
+```js
+// app/highcharts-configs/application.js
+
+export default function(defaultOptions) {
+  defaultOptions.credits.href = 'http://www.my-great-chart.com';
+  defaultOptions.credits.text = 'great charts made cheap';
+  defaultOptions.credits.enabled = true;
+
+  return defaultOptions;
+}
+```
+
 ### Generating Chart Components
@@ -127,3 +209,3 @@
 
-```javascript
+```js
 // components/dynamic-high-charts.js
@@ -151,12 +233,17 @@ import Ember from 'ember';
 
+
 ## Contributing
 
-see [contributing guidelines](CONTRIBUTING.md).
+See [contributing guidelines](CONTRIBUTING.md).
 
+
 ## Changelog
 
-see [CHANGELOG.md](CHANGELOG.md).
+See [CHANGELOG.md](CHANGELOG.md).
 
+
 ## Credit
 
-This add-on is built based on the [gist](https://gist.github.com/poteto/cd2bb47e77bf87c94d33) and [medium](https://medium.com/delightful-ui-for-ember-apps/using-highcharts-js-in-an-ember-app-18a65d611644) by [@poteto](https://github.com/poteto)
+This add-on is built based on the [gist](https://gist.github.com/poteto/cd2bb47e77bf87c94d33) and
+[medium](https://medium.com/delightful-ui-for-ember-apps/using-highcharts-js-in-an-ember-app-18a65d611644)
+by [@poteto](https://github.com/poteto)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1117880

increased by9.43%

Lines of code

3837

increased by10.07%

Number of lines in readme file

243

increased by55.77%

Worsened metrics

Dev dependency count

20

increased by5.26%

Number of low supply chain risk alerts

7

increased by75%

Dependency changes

• Updatedember-cli-babel@^5.1.6