angularshowcase / angular2-seed-ng2-highcharts Goto Github PK
View Code? Open in Web Editor NEWAn example showing an integration with Highcharts. http://www.highcharts.com/
License: MIT License
An example showing an integration with Highcharts. http://www.highcharts.com/
License: MIT License
Hi,
Did a clean checkout and npm install and npm start got this error:
src\client\app+charts\components\charts.component.ts(3,57): error TS2307: Cannot find module 'ng2-highcharts/ng2-highcharts'.
Browser just displayed Loading ....
Did I miss something in the install, it installed without errors.
Windows, Node Version v4.4.7
Steps to reproduce and a minimal demo of the problem
run - npm run build.prod
What steps should we try in your demo to see the problem?
npm install
npm run build.prod
Current behavior
Working fine in dev mode but not working for prod mode.
Expected/desired behavior
It should have created complete dist. But fails while creating index.html in dist.
Other information
I am using typings 1.3.1 as 2.0 is not supported.
This issue is only coming up in my company's Windows System Environment.
Working fine in my personal MacBook.
Could there be examples of showing multiple charts on a page? There maybe cases where charts need to be dynamically generated based on some conditions, along with the number of charts to be rendered.
The seed has evolved a lot... we could update this repo applying the seed improvements to be a better learning place.
How to update bar series data in highcharts?
I know you can replace the entire config option but that causes an entire re-render.
I am interested in updating just several bars...
In the original API you do
series.setData(value)
but of course with ng2 there is no reference to the template element so I am wondering what's the proper method...
tx
Sean.
I am starting to use ng2-highcharts.
I have been able to use the component within my TestApp but I am not able to get any chart type different from the default one.
For instance, if I change the type of chart to 'column' in the home.ts component of yours, I still get the same chart.
What am I doing wrong?
Thanks in advance
Enrico
I'm trying to get the highchart js object the same as we do in js
var chart = $('#container').highcharts();
And set the xAxis extremes
chart.xAxis[0].setExtremes(
startTime * 1000,
endTime * 1000
);
Is it possible create one graph like this:
http://www.highcharts.com/demo/gauge-solid ?
And combinations of graphs?
http://www.highcharts.com/demo/combo
Thanks
Hi,
I am trying to handle click events in Ng2HighCharts. HighChart allows me to specify a callback function. However, execution context of this function is different and I can no longer access properties of Angular2 component in the callback function.
IMPORTANT: This repository's issues are reserved for feature requests and bug reports. Do not submit support requests here.
I copied the source into my install and when i run it i get an error.
Steps to reproduce and a minimal demo of the problem
Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'ng2-highcharts' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highcharts]="chartOptions" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@16:8
Can't bind to 'ng2-highcharts' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highcharts]="chartBar" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@19:8
Can't bind to 'ng2-highstocks' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highstocks]="chartStock" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@24:8
Can't bind to 'ng2-highmaps' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highmaps]="chartMap" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@27:8
Error: Template parse errors:
Can't bind to 'ng2-highcharts' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highcharts]="chartOptions" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@16:8
Can't bind to 'ng2-highcharts' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highcharts]="chartBar" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@19:8
Can't bind to 'ng2-highstocks' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highstocks]="chartStock" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@24:8
Can't bind to 'ng2-highmaps' since it isn't a known property of 'div'. ("
<div [ERROR ->][ng2-highmaps]="chartMap" class="graph">
"): ng:///PlcgraphModule/PlcgraphComponent.html@27:8
at syntaxError (compiler.es5.js:1540)
at TemplateParser.webpackJsonp.../../../compiler/@angular/compiler.es5.js.TemplateParser.parse (compiler.es5.js:12031)
at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileTemplate (compiler.es5.js:25782)
at compiler.es5.js:25706
at Set.forEach ()
at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileComponents (compiler.es5.js:25706)
at createResult (compiler.es5.js:25591)
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run (zone.js:141)
at zone.js:817
at syntaxError (compiler.es5.js:1540)
at TemplateParser.webpackJsonp.../../../compiler/@angular/compiler.es5.js.TemplateParser.parse (compiler.es5.js:12031)
at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileTemplate (compiler.es5.js:25782)
at compiler.es5.js:25706
at Set.forEach ()
at JitCompiler.webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._compileComponents (compiler.es5.js:25706)
at createResult (compiler.es5.js:25591)
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.run (zone.js:141)
at zone.js:817
at resolvePromise (zone.js:769)
at resolvePromise (zone.js:740)
at zone.js:817
at ZoneDelegate.webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:424)
at Zone.webpackJsonp.../../../../zone.js/dist/zone.js.Zone.runTask (zone.js:191)
at drainMicroTaskQueue (zone.js:584)
at
api.onUnhandledError @ zone.js:644
handleUnhandledRejection @ zone.js:666
_loop_1 @ zone.js:657
api.microtaskDrainDone @ zone.js:661
drainMicroTaskQueue @ zone.js:592
Promise resolved (async)
scheduleMicroTask @ zone.js:567
webpackJsonp.../../../../zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:413
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:235
webpackJsonp.../../../../zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:255
scheduleResolveOrReject @ zone.js:815
ZoneAwarePromise.then @ zone.js:904
ZoneAwarePromise.all @ zone.js:884
webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler._loadModules @ compiler.es5.js:25638
webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAndComponents @ compiler.es5.js:25589
webpackJsonp.../../../compiler/@angular/compiler.es5.js.JitCompiler.compileModuleAsync @ compiler.es5.js:25551
webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef.bootstrapModuleWithZone @ core.es5.js:4811
webpackJsonp.../../../core/@angular/core.es5.js.PlatformRef.bootstrapModule @ core.es5.js:4797
../../../../../src/main.ts @ main.ts:12
webpack_require @ bootstrap 7ddea8ec2ad85c442cf3:54
0 @ main.bundle.js:6843
webpack_require @ bootstrap 7ddea8ec2ad85c442cf3:54
webpackJsonpCallback @ bootstrap 7ddea8ec2ad85c442cf3:25
(anonymous) @ main.bundle.js:1
What steps should we try in your demo to see the problem?
Current behavior
Expected/desired behavior
Other information
@angular/cli: 1.4.7
node: 6.11.2
os: win32 x64
@angular/animations: 4.1.3
@angular/common: 4.1.3
@angular/compiler: 4.1.3
@angular/core: 4.1.3
@angular/forms: 4.1.3
@angular/http: 4.1.3
@angular/platform-browser: 4.1.3
@angular/platform-browser-dynamic: 4.1.3
@angular/router: 4.1.3
@angular/cli: 1.4.7
@angular/compiler-cli: 4.1.3
typescript: 2.3.3
I wanna deploy to a VPS like Digital ocean,.
[yargs@^3.32.0] existed at /Users/white/angular2-seed-ng2-highcharts/node_modules/yargs
Error: [email protected] sha1:f098972797a9ce64136fcc249b366799064c9aac not equal to 8e47d91e146a5b70c5f71483301727a1163d38ef ([email protected])
Error: [email protected] sha1:f098972797a9ce64136fcc249b366799064c9aac not equal to 8e47d91e146a5b70c5f71483301727a1163d38ef ([email protected])
at ReadStream.readstream.on (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/download/npm.js:220:24)
at emitNone (events.js:91:20)
at ReadStream.emit (events.js:185:7)
at endReadableNT (_stream_readable.js:926:12)
at _combinedTickCallback (internal/process/next_tick.js:74:11)
at process._tickCallback (internal/process/next_tick.js:98:9)
$ node -v
v6.0.0
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.