gevgeny / angular2-highcharts Goto Github PK

See screenshot

I want the chart to nicely fill up the area. Is this a bug? Or am I doing something wrong?

Thanks!

HTML

<div class="chart-wrapper">
    <chart class="chart" [options]="options"></chart>
</div>

CSS

.chart {
    border: 3px solid yellow;
    width: 100% !important;
}

.chart-wrapper {
    border: 3px solid orangered;
    width: 100% !important;
}

[]

I want to destroy chart and build it again. In jQuery I can do it like here...

chart1.destroy();
chart1 = new Highcharts.Chart(optionsChart1,highlightSer);

Code from http://stackoverflow.com/questions/7880978/highcharts-jquery-destroy-and-rebuild-chart-with-original-options

...but how can I do this in Angular 2?

Hi

How to use the highcharts exporting module for the chart directive?

Thanks in advance.

Currently i cannot find a way to bind events to the xAxis and yAxis (afterSetExtremes, pointInBreak, setExtremes). Specially the setExtremes event would be very useful to have.

You can bind them via the options, but then it seems that the event is executed in another context and I cannot access data of my component which is using the Highcharts component.

I wanted to do something like http://www.highcharts.com/demo/synchronized-charts. While I had my npm compiler running and listening for file changes (npm start which is “npm run tsc:w” and “npm run lite”), everything works well (with following errors ... but works great). However, when I restart my “npm start” and it goes through the compiler again, I get

[0] app/station-dashboard.component.ts(249,10): error TS2345: Argument of type '
{ chart: { marginLeft: number; zoomType: string; spacingTop: number; spacingBott
om: number; }; ti...' is not assignable to parameter of type 'HighchartsOptions'
.
[0] Types of property 'series' are incompatible.
[0] Type '{ data: any; name: any; color: any; fillOpacity: number; tooltip:
{ valueSuffix: string; }; }[]' is not assignable to type 'HighchartsIndividualSe
riesOptions[]'.
[0] Type '{ data: any; name: any; color: any; fillOpacity: number; tooltip
: { valueSuffix: string; }; }' is not assignable to type 'HighchartsIndividualSe
riesOptions'.
[0] Object literal may only specify known properties, and 'color' does n
ot exist in type 'HighchartsIndividualSeriesOptions'.

It’s not liking where I say :

$('<chart class="stationChart col-md-12">')
.appendTo('#container')
.highcharts({
chart: {
marginLeft: 80, // Keep all charts left aligned
zoomType: 'x',
spacingTop: 20,
spacingBottom: 20
},

How can I make it so I can call .highcharts ( ) and pass in options there?

could you please upgrate to angular 2 rc 2 and publish to the npm repository?

I'm following this example to create a dynamic chart but I'm having the error above.

Here's what I'm trying to do:

this.service
  .getData()
    .then(res => {
      this.chart.series[0].setData(this.chartData(res));
    })
    .catch(error => this.error = error);

Any hints on what I'm missing here?

Hello, I'm using your chart directives in our project and I love it so much.

I'm using Highstocks and I need to know when user changes range of the chart and put these extremes in two variables (like in your example). I've tried your example with (selection) event emitter, but it doesn't work with navigator (editing range and panning) and range selector buttons (1M, 3M, YTD, ALL). It works only with editing the area in the chart (zooming and panning). That's probably because this event is made for Highcharts, not Highstocks.

I wanted to ask if there is (or will be) any way to access the xAxis.events.setExtremes event. I tried it through console.log and it worked like a charm, but I cannot assign these values to angular2's model variables.

I also thought that would be a nice thing to present in your examples, for users who need to use highstocks.

I appreciate your great work, thank you in advance.

//EDIT
Just for completation, you can see desired behavior here. Just check the console log.

Hi,

Love the wrapper. Very simple to get up and working.

I was wondering if you had any advise on the 'Angular 2' way towards scaling a chart based on a parent container. After some googling, the recommended way is to add something like

<div id="container"

... and in my options object something along the lines of:

chart: {
             renderTo: 'container'
}

But this doesn't seem very 'Angular 2' . Is there a recommended method, using this directive, that you would advise me to use?

Furthermore I was wondering if you had advise towards a chart being scaled as its parent container is scaled. I'm rendering charts inside an angular2 grid directive. This enables me to move around and scale the containers holding my charts.

Unfortunately the charts don't actually scale alongside the containers until I resize the window itself. Once the window itself is resized it will snap to fill the white area below. Bare in mind this only works when I have the rendorTo: 'container' enabled.

I've tried a few hacks here and there to try bind the redraw method of highcharts to my containers resize() event but have been unsuccessful. Advise here would be appreciated too.

Cheers,
Max

Hello,

can you help me on how can I render 3D charts with this library?
When I put 3D options in this.options it renders chart correctly but not in 3D.

Thanks

I am trying to import no-data module. I have read the readme file but still haven't manage to make it work.

I have the following in the systemjs.config.js

        'highcharts/noData': '/js/no-data-to-display.src.js'

and then in the .ts the following

import {NoData}             from 'highcharts/noData';

and I get cannot find module 'highcharts/noData';

Do you have any idea what am I doing wrong?

If you create a line chart with data on it, zoom in, then try to delete the lines and axes, the following occurs.

Calling:
this.chart.yAxis[0].remove()

Throws the following error:
TypeError: Cannot read property 'pos' of undefined

This works flawlessly when the chart is not zoomed in.

Passing options with multiple y-axis' as an array no longer works in 0.2.1. Debugging the code, the axis array is transformed into an object before being passed into the highcharts javascript code, and fails to iterate because of that. It may have something to do with this update which initializes the axis' as objects.

0cfdb60

Example options: http://www.highcharts.com/demo/combo-multi-axes

If you simply add a duplicate series to the config, unlike other highcharts examples, this one captures the mouse events from the underlying series instead of the one on top (in front).

Hello Eugene,

I've transformed your files to work with Angular2-beta.16 however the boxplot doesn't work giving me error 17, which means series or chart type is not defined. Maybe you could provide me with a working example?

Thanks in advance,
Regards

How to implement heatmap ? heatmap.js has to be included for it to work. Where to include it?

Hi,

I have created a plnkr example http://plnkr.co/edit/JRvp68r9PpPTpx3Tj1tA?p=info.

I am trying to refresh the chart view when the chart options get updated through a rest call that I am faking with a setTimeout for simplicity.

In the app.component the is a method called _renderChart.

The chart does refresh if you uncomment the NO REST CALL code where the chart options get updated without a faked rest call.

In a setTimeout the chart fails to update the view.

This Angular 2 example shows that faking the rest call with setInterval successfully updates the view http://plnkr.co/edit/wEmO8R45p8mwwxqN7vRJ.

I don't know if it's a bug, but I would really appreciate if you could help/advice.

Thank you for any help.

I get the following error when trying to configure angular2-highcharts with RC5

product:15 Error: TypeError: Cannot read property 'type' of null(…)(anonymous function) @ product:15ZoneDelegate.invoke @ zone.js:332Zone.run @ zone.js:225(anonymous function) @ zone.js:586ZoneDelegate.invokeTask @ zone.js:365Zone.runTask @ zone.js:265drainMicroTaskQueue @ zone.js:491ZoneTask.invoke @ zone.js:435

My systemjs is as follows

/**
 * System configuration for Angular 2 samples
 * Adjust as necessary for your application needs.
 */
(function(global) {
  // map tells the System loader where to look for things
  var map = {
    'app':                        'app', // 'dist',
    '@angular':                   'node_modules/@angular',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    'rxjs':                       'node_modules/rxjs',
    'angular2-highcharts':        'node_modules/angular2-highcharts/dist',
    'highcharts/highstock.src':   'node_modules/highcharts/highstock.js'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { main: 'index.js', defaultExtension: 'js' },
    'angular2-highcharts' :       { main: 'index', defaultExtension: 'js' }
  };
  var ngPackageNames = [
    'common',
    'compiler',
    'core',
    'forms',
    'http',
    'platform-browser',
    'platform-browser-dynamic',
    'router',
    'router-deprecated',
    'upgrade',
  ];
  // Individual files (~300 requests):
  function packIndex(pkgName) {
    packages['@angular/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }
  // Bundled (~40 requests):
  function packUmd(pkgName) {
    packages['@angular/'+pkgName] = { main: '/bundles/' + pkgName + '.umd.js', defaultExtension: 'js' };
  }
  // Most environments should use UMD; some (Karma) need the individual index files
  var setPackageConfig = System.packageWithIndex ? packIndex : packUmd;
  // Add package entries for angular packages
  ngPackageNames.forEach(setPackageConfig);
  var config = {
    map: map,
    packages: packages
  };
  System.config(config);
})(this);

angular2-polyfills.js:332 Error: Error: XHR error (404 Not Found) loading http://localhost:3000/highcharts/highstock.src(…)

The app is trying to load /highcharts/highstock.src

In, node_modules/angular2-highcharts/dist/Highcharts.js
I change the reference to: var Highcharts = require('/node_modules/highcharts/highstock.src.js');
Then it works

Hey,

i try to use it in my ionic2 App.
Graph is showing but unfortunatly, it is not resizing based on screen size.
Screenshot:

Any advise?
Greetings

I am trying to implement the drill down functionality, But I am facing a problem when changing the options variable, the web page scrolls up.
On the point click event, I am getting new data from the server and rebuilding the options variable. The web page scrolls up.

Hi, can you answer me a question? How do you make the width of responsive chart? I've tried to set the css to width = 100% in Highcharts-container class and svg component, but it did not work. I've tried also set a class on the chart component with width = 100% and did not work: - /
Note: Of the two ways I tried, the graph to be responsive, but a part of the chart figure is cut right.

Hi Guys

In my case I'm using Angular2. When I try to change the chart.type of my chart ('line', 'column',etc) it doesn't work.

Is it necessary to do something else than calling the redraw or is a problem?.

Thanks in advance,

J

Hi guys

Did you try to use the highcharts exporting tool (Client side export) ?

I'm following the higcharts documentation :
http://www.highcharts.com/docs/export-module/client-side-export
jsfiddle:
http://goo.gl/yeKhh4

But it doesn't work.

Thanks in advance.

I am trying to use angular2-highcharts within a project based on angular2-seed, but get the following errors when starting the application:

C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(8,14): error TS2300: Duplicate identifier 'PropertyKey'.
C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(11,5): error TS2300: Duplicate identifier 'done'.
C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(12,5): error TS2300: Duplicate identifier 'value'.
C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(250,5): error TS2300: Duplicate identifier 'EPSILON'.
C:/Projekte/angular2-seed2/node_modules/angular2-highcharts/typings/browser/ambient/es6-shim/index.d.ts(285,5): error TS2300: Duplicate identifier 'MAX_SAFE_INTEGER'.
[...]
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(8,14): error TS2300: Duplicate identifier 'PropertyKey'.
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(11,5): error TS2300: Duplicate identifier 'done'.
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(12,5): error TS2300: Duplicate identifier 'value'.
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(250,5): error TS2300: Duplicate identifier 'EPSILON'.
C:/Projekte/angular2-seed2/typings/browser/ambient/es6-shim/index.d.ts(285,5): error TS2300: Duplicate identifier 'MAX_SAFE_INTEGER'.
[...]

The same messages show up for jasmine typings.

Steps to reproduce:

1. Checkout angular2-seed: https://github.com/mgechev/angular2-seed.git

2. Add to package.json under dependencies: "angular2-highcharts": "^0.0.6"

3. Add simple.chart.ts under src/home/components/:

   import { Component } from 'angular2/core';
       import { CHART_DIRECTIVES } from 'angular2-highcharts';
   
       @Component({
           selector: 'simple-chart-example',
           directives: [CHART_DIRECTIVES],
           template: `
               <chart [options]="options"></chart>
           `
       })
       export class SimpleChartExample {
           constructor() {
               this.options = {
                   title : { text : 'simple chart' },
                   series: [{
                       data: [29.9, 71.5, 106.4, 129.2],
                   }]
               };
           }
           options: Object;
       }
   

4. Run npm install and npm start.

Any idea how to make it work?

Hi i am using this latest version of this and i keep hitting the browser.d.ts typings error which looking at the commits seems to be fixed but the npm package isn't updated

Hi, maybe the typings directory in the root angular2-highcharts should be removed?

Hi all,

I'm trying to display a highcharts solidgauge and I'm getting error #17.

My typescript looks like this

import {CHART_DIRECTIVES} from "angular2-highcharts/index";
...
constructor() {
this.options = {
chart: { type: 'solidgauge' },
series: [ { name: 'test', data: [1] } ]
};
}

and my html look like that

<chart [options]="options"></chart>

so nothing fancy.

BTW running these options in a JSFiddle from the Highcharts website works.

Any idea what I'm missing or doing wrong?
Thanks for the help!

Hi all

Trying to install the lib in an angular2-rc5 application I'm getting some errors:

1) npm install angular2-highcharts --save

2) ...
node-pre-gyp ERR! Tried to download: https://node-zopfli.s3.amazonaws.com/Release/zopfli-v1.4.0-node-v48-linux-x64.tar.gz (This line fails because an "Access Denied" message)
node-pre-gyp ERR! Pre-built binaries not found for [email protected] and [email protected] (node-v48 ABI) (falling back to source compile with node-gyp)
...
CXX(target) Release/obj.target/zopfli/src/zopfli-binding.o
CXX(target) Release/obj.target/zopfli/src/png/zopflipng.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/blocksplitter.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/cache.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/deflate.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/gzip_container.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/hash.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/katajainen.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/lz77.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/squeeze.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/tree.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/util.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/zlib_container.o
CC(target) Release/obj.target/zopfli/zopfli/src/zopfli/zopfli_lib.o
CXX(target) Release/obj.target/zopfli/zopfli/src/zopflipng/zopflipng_lib.o
CXX(target) Release/obj.target/zopfli/zopfli/src/zopflipng/lodepng/lodepng.o
CXX(target) Release/obj.target/zopfli/zopfli/src/zopflipng/lodepng/lodepng_util.o
SOLINK_MODULE(target) Release/obj.target/zopfli.node
COPY Release/zopfli.node
...

├─┬ [email protected]
│ ├─┬ [email protected]
│ │ └─┬ [email protected]
│ │ ├── [email protected]
│ │ └─┬ [email protected]
│ │ ├── [email protected]
│ │ ├─┬ [email protected]
│ │ │ └── [email protected]
│ │ ├── [email protected]
│ │ └─┬ [email protected]
│ │ ├── [email protected]
│ │ └── [email protected]
│ └─┬ [email protected]
│ ├── [email protected]
│ ├─┬ [email protected]
│ │ └── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ └─┬ [email protected]
│ └─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ └─┬ [email protected]
│ └─┬ [email protected]
│ └─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
└── UNMET PEER DEPENDENCY [email protected]

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: [email protected]
npm WARN @angular/[email protected] requires a peer of typescript@^1.9.0-dev but none was installed.
npm WARN [email protected] requires a peer of typescript@^1.8.0 || ^1.9.0-dev but none was installed.

3) I tried updating the typscript module to the latest
tsc -v
Version 2.1.0-dev.20160817

4) At this point there is an entry in the package.json with angular2-highcharts. But if I try o use it in my app.module file, I get an error:

.//angular2-highcharts/dist/index.js
Cannot find source file '../src/index.ts': Error: Can't resolve '../.../charts-test/node_modules/angular2-highcharts/dist'
@ .//angular2-highcharts/index.js 4:9-32
@ ./src/app/app.module.ts
@ ./src/app/index.ts
@ ./src/main.ts
@ multi main

Any idea ?.

Thanks in advance.

workaround:

put this in webpack config file

    module: {
        preLoaders: [
            {
                test: /\.js$/,
                loader: 'source-map-loader',
                exclude: [
                    // these packages have problems with their sourcemaps
                    path.join(__dirname, 'node_modules', 'angular2-highcharts')
                ]
            }
        ],
        noParse: []
    }

list of warnings:

webpack: bundle is now INVALID.
chunk    {0} app.bundle.js, app.map (app) 1.54 MB {2} [rendered]
chunk    {1} polyfills.bundle.js, polyfills.map (polyfills) 485 kB
chunk    {2} vendor.bundle.js, vendor.map (vendor) 1.79 MB {1}

WARNING in ./~/angular2-highcharts/dist/index.js
Cannot find source file '../src/index.ts': Error: Cannot resolve 'file' or 'directory' ../src/index.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/ChartComponent.js
Cannot find source file '../src/ChartComponent.ts': Error: Cannot resolve 'file' or 'directory' ../src/ChartComponent.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/ChartSeriesComponent.js
Cannot find source file '../src/ChartSeriesComponent.ts': Error: Cannot resolve 'file' or 'directory' ../src/ChartSeriesComponent.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/ChartPointComponent.js
Cannot find source file '../src/ChartPointComponent.ts': Error: Cannot resolve 'file' or 'directory' ../src/ChartPointComponent.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/Highcharts.js
Cannot find source file '../src/Highcharts.ts': Error: Cannot resolve 'file' or 'directory' ../src/Highcharts.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/HighchartsService.js
Cannot find source file '../src/HighchartsService.ts': Error: Cannot resolve 'file' or 'directory' ../src/HighchartsService.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/initChart.js
Cannot find source file '../src/initChart.ts': Error: Cannot resolve 'file' or 'directory' ../src/initChart.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/createBaseOpts.js
Cannot find source file '../src/createBaseOpts.ts': Error: Cannot resolve 'file' or 'directory' ../src/createBaseOpts.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/deepAssign.js
Cannot find source file '../src/deepAssign.ts': Error: Cannot resolve 'file' or 'directory' ../src/deepAssign.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist

WARNING in ./~/angular2-highcharts/dist/ChartEvent.js
Cannot find source file '../src/ChartEvent.ts': Error: Cannot resolve 'file' or 'directory' ../src/ChartEvent.ts in /Volumes/Data/Dropbox/Development/Node/ng2-seed/node_modules/angular2-highcharts/dist
webpack: bundle is now VALID.

Hi,

I'm pretty new to TypeScript, so this may well be something I don't understand correctly, but I've hit a bit of a wall.

I want to do this:

for (var series of this.chart.series) {
            series.remove();
}

But I get

Type 'ChartSeriesComponent' is not an array type or a string type

I would have expected to see something more like

series: ChartSeriesComponent[] in ChartComponent.d.ts.

Thoughts? Thank you!

I've got the data for each series coming down from a call to the database. They get added to a javascript object and that gets attached to the chart element as the options attribute. Whichever comes back first is the only one that is displayed.

I see in highcharts there is a redraw function and see how with your repository to handle when that function is called, but unless there is some way to call it I think there is a problem for dynamic series.

Please see issue #18

** I added details there **

Could you provide an example of how to create a Highmap? I am not getting the plugin loading to work based off the examples provided. I am guessing I won't be the only one struggling to get this working for Highmaps

We have observed that the angular2-highcharts library uses highstock internally, as it supports Highcharts and Highstock both.
But we have only license for Highcharts library.
So is there any way to exclude highstock library while using angular2-highcharts?

Hi,

Can you please update to @angular/2.0.0-rc.0?

Thank you!!

When i use this w/ highcharts...i pull the data in ngOnInit (1 to N series of data) thru an API and set the options.

I have a form above my chart to set data variables...and when submitted, i get new data for the chart. The new data could again, be 1 to N series of data.

I need a way to update the current chart (gracefully). How do i reset (all) the data at once, or update to new options (which includes new series data, new xAxis categories).

Here's a simplified example (click me button) of what i'm trying to do:
http://plnkr.co/edit/uEaaTcfciT9OlUtwJWuC?p=preview

Hi,

i am trying to figure out the way to add custom tooltip formatter to the chart but if i am using typescript i cant access http://api.highcharts.com/highcharts#tooltip.formatter objects that 'this' poits to. while using plain JavaScript it works http://plnkr.co/edit/VkhPpxKlRtHKEyg2t5TS?p=preview (in maint.ts i added custom formatter).

it might be a stupid question, but i would appreciate the help :) or should i just use plain JavaScript and dont think about it?

Hello, first of all thanks for creating this library.

I was trying to recreate an example from the highcharts website which includes drilldown. But it seems that drilldown isn't working. I've loaded both the data and drilldown module and the data module from the regular highcharts npm module.

This is the example:
http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/pie-drilldown/

I don't know how to set the width and height of chart, I tried to pass width, height settings and set css attribute , both dosen't work , maybe it's hard coded? I always get width:600px; height: 400px;

I followed the example given on the README but I am getting compiler errors (in Visual Studio Code) saying that series[0] does not exist on the chart object ==> this.chart.series[0] gives me an error line under series.

What do I do to make it ignore this problem since it should be resolved at run time?

I should note that unlike the example given, I have my template code in a separate file whereas the demo has the template code in the same file as the component code.

When I play with the plnkr demo I notice that if I console.log(this.chart); I get undefined but when I console.log(this.chart); inside the setInterval() it gives me the chart object with all of its values.

My project is using Angular version rc.1

Hi,

Can you please update to @angular/2.0.0-rc.1?

Thank you!!

I currently have it such that the data displayed in my charts needs to change based on a button click. I may have to add or delete a series, change the date ranges displayed, or display new data altogether.

I've found that by editing
this.options.series
I can easily manipulate the data displayed.

However, since the chart isn't automatically redrawn on change, the changes to the series aren't reflected in the charts.

How do I redraw a chart using this library?

Hi,
I am learning angular2 and some associated graphing tools. I seem to be having a problem using angular2-highcharts. When I try to run using npm start, the following error occurs(for multiple lines):

typings/globals/highcharts/index.d.ts... getting error TS2300: Duplicate identifier.....

I went through a few solutions suggested in similar issues. I modified the tsconfig file to include an exclude portion to exclude node_modules, but that didn't work. Since am new to angular and typescript, I am not sure if I am missing something very basic here.

I am using Angular2 and Webpack from https://github.com/AngularClass/angular2-webpack-starter

I followed your readme instructions but I get:

Cannot find source file '../src/ChartEvent.ts': Error: Cannot resolve 'file' or 'directory' ../src/ChartEvent.ts in /Users/username/Dev/angular2-webpack-starter/node_modules/angular2-highcharts/dist