ngx-echarts | An angular directive for ECharts | Chart library

by xieziyu TypeScript Version: 17.1.0 License: MIT

X-Ray Key Features Code Snippets Community Discussions(8)Vulnerabilities Install Support

kandi X-RAY | ngx-echarts Summary

ngx-echarts is a TypeScript library typically used in User Interface, Chart, Angular applications. ngx-echarts has no bugs, it has no vulnerabilities, it has a Permissive License and it has medium support. You can download it from GitHub.

An angular (ver >= 2.x) directive for ECharts (ver >= 3.x)

Support

Quality

Security

License

Reuse

Support

ngx-echarts has a medium active ecosystem.

It has 1032 star(s) with 193 fork(s). There are 37 watchers for this library.

There were 5 major release(s) in the last 6 months.

There are 133 open issues and 191 have been closed. On average issues are closed in 64 days. There are no pull requests.

It has a neutral sentiment in the developer community.

The latest version of ngx-echarts is 17.1.0

Quality

ngx-echarts has 0 bugs and 0 code smells.

Security

ngx-echarts has no vulnerabilities reported, and its dependent libraries have no vulnerabilities reported.

ngx-echarts code analysis shows 0 unresolved vulnerabilities.

There are 0 security hotspots that need review.

License

ngx-echarts is licensed under the MIT License. This license is Permissive.

Permissive licenses have the least restrictions, and you can use them in most projects.

Reuse

ngx-echarts releases are available to install and integrate.

Installation instructions, examples and code snippets are available.

It has 664 lines of code, 0 functions and 107 files.

It has low code complexity. Code complexity directly impacts maintainability of the code.

Top functions reviewed by kandi - BETA

kandi's functional review helps you automatically verify the functionalities of the libraries and avoid rework.
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of ngx-echarts

Get all kandi verified functions for this library.

ngx-echarts Key Features

No Key Features are available at this moment for ngx-echarts.

ngx-echarts Examples and Code Snippets

No Code Snippets are available at this moment for ngx-echarts.

Community Discussions

Trending Discussions on ngx-echarts

Is there a way on echarts to get the series colors

Angular 12 Compilation is not immediately happening after any html, scss, ts file save

"echarts"' has no exported member named 'EChartOption'. Did you mean 'EChartsOption' instead?

An unhandled exception occurred: Cannot find module '@angular/compiler-cli' with ng serve

typeError: Cannot destructure property 'init' of 'object null' as it is null in ngx e-charts

NullInjectorError: No provider for InjectionToken NGX_ECHARTS_CONFIG

Angular 9 Parent Child Call Function

How to set the yAxis by 5 in angular echarts

QUESTION

Is there a way on echarts to get the series colors

Asked 2022-Jan-20 at 18:48

I'm using Echarts v5.2.2 (in an Angular project, with ngx-echarts) to render a line chart using multiple series. I have a listener for the 'highlight' event. This event is giving me an object with a batch of seriesIndex and dataIndex but it doesn't provide the color of each series.

Is there a way to get the colors that were dynamically assigned by echarts?

This is what I'm trying to implement:

Listen when the mouse pointer snapped into a graph line point.
- Doing this via this.chartInstance.on('highlight', this.handleShowTip);.
Use the batch of seriesIndex & dataIndex where the mouse pointer snapped to render a table using color, x & y value as columns (the table is placed outside the graph.

I understand that I could use the tooltip's formatter option with a callback function which will provide the series colors in its arguments... and I could broadcast these arguments outside my graph component to render what I need anywhere I want, but this does not feel correct (a formatter is aimed to return HTML or string) and I wonder if there's a better way to get the generated series colors.

Thank you!

...

ANSWER

Answered 2022-Jan-20 at 11:10

The Echarts uses a built-in palette based on the theme. The easiest way to get a set of colors is this:

Source https://stackoverflow.com/questions/70780091

QUESTION

Angular 12 Compilation is not immediately happening after any html, scss, ts file save

Asked 2021-Jun-17 at 13:35

I upgraded my angular project from 8 to 12. After that I migrated to eslint. Then onwards my compilation is not immediately invoked after saving any file. If I save any file after 2min the compilation starts in the terminal.

This is the issue I'm facing. Thanks in advance. Please let me know what is causing it to be slow and time taking. Is it with vscode or Angular config issues.

Package.json

...

ANSWER

Answered 2021-Jun-17 at 13:35

This is solved. It is caused because of serve configuration doesn't have the development mode configuration set in angular.json file. May be this cofiguration is removed when im upgrading to Angular 12 but not sure.

After adding the below two code blocks, My compilation issue is fixed and its immediately recompiles when a file is saved.

Source https://stackoverflow.com/questions/68014543

QUESTION

"echarts"' has no exported member named 'EChartOption'. Did you mean 'EChartsOption' instead?

Asked 2021-Apr-16 at 12:58

I am using Angular 9 along with "ngx-echarts": "5.2.2" and "echarts": "5.0.0"

Everything works fine accept while setting icon: 'circle' for legends. It says below thing.

Type '{ icon: string; top: string; left: string; orient: "vertical"; }' is not assignable to type 'LegendOption | ScrollableLegendOption | (LegendOption | ScrollableLegendOption)[]'.

As per example in ngx-echarts I can't use import { EChartOption } from 'echarts';

I have checked that icon is available in EchartOption instead of EchartsOption

Is there anything i am missing?

After installing @types/echarts my code is working and showing legend with circle icon but have random error that it can't find EchartOption in echarts (My angular is not taking care of this and running application by ignoring this error)

RIght now i went with import { EChartsOption } from 'echarts'; and removed @types/echarts library. And i can't change legend icon for the moment :( Any help?

Thanks, Jayesh

...

ANSWER

Answered 2021-Apr-16 at 12:58

When yo use echarts 5 you MUST NOT install @types/echarts, because echarts 5 is now written in typescript: i.e. the echarts package already includes the correct types for this version.

There have been many changes between echarts 4 and echarts5 - one of them is that EchartOption is now called EchartsOption (with plural "s")

Source https://stackoverflow.com/questions/66344990

QUESTION

An unhandled exception occurred: Cannot find module '@angular/compiler-cli' with ng serve

Asked 2020-Dec-25 at 20:42

I have taken checkout of angular project and trying to run ng serve with this command I am getting the following error.

...

ANSWER

Answered 2020-Sep-11 at 06:38

it is version mismatch, just update all dependencies with npm-check-updates

Source https://stackoverflow.com/questions/63841549

QUESTION

typeError: Cannot destructure property 'init' of 'object null' as it is null in ngx e-charts

Asked 2020-Nov-17 at 04:42

I got this when I was using ngx-echarts. When using versions 4.x.x everything worked fine. After an npm i the application failed to run.

...

ANSWER

Answered 2020-Nov-17 at 04:42

The problem was because of a version update in ngxe-charts. If using versions >5.0 use this in app.module

Source https://stackoverflow.com/questions/63176047

QUESTION

NullInjectorError: No provider for InjectionToken NGX_ECHARTS_CONFIG

Asked 2020-Sep-11 at 09:43

I am working on the angular application, When I open my project it is giving me the error like below

...

ANSWER

Answered 2020-Sep-11 at 09:43

import NgxEchartsModule in your app module (or any other proper angular module):

With Dynamic import

Source https://stackoverflow.com/questions/63844164

QUESTION

Angular 9 Parent Child Call Function

Asked 2020-Apr-26 at 01:06

My parent component call function on two childs components. I have an error on the second component.

Parent Component

...

ANSWER

Answered 2020-Apr-26 at 01:06

You haven't add ngx-accordion in parent.html template. Thats why its breaking. Other component working as its available in your parent.html

Source https://stackoverflow.com/questions/61433681

QUESTION

How to set the yAxis by 5 in angular echarts

Asked 2020-Mar-19 at 06:55

here's the code:

https://stackblitz.com/edit/ngx-echarts-odv9rp?file=src/app/app.component.html

...

ANSWER

Answered 2020-Mar-19 at 06:55

Use interval:

Source https://stackoverflow.com/questions/60752169

Community Discussions, Code Snippets contain sources that include Stack Exchange Network

Vulnerabilities

No vulnerabilities reported

Install ngx-echarts

ngx-echarts is an Angular (ver >= 2.x) directive for ECharts (ver >= 3.x). A starter project on Github: https://github.com/xieziyu/ngx-echarts-starter.
v8.x for Angular >= 13
v7.x for Angular >= 11
v6.x for Angular >= 10, < 11
v5.x for Angular >= 6, < 10
v2.3.1 for Angular < 6 (Please refer to https://github.com/xieziyu/ngx-echarts/blob/v2.x/README.md)
If you need ECharts GL support, please install it first:. Import other extensions such as themes or echarts-gl in your main.ts: ECharts Extensions.
Since v5.0 # if you use npm npm install echarts -S npm install ngx-echarts -S # or if you use yarn yarn add echarts yarn add ngx-echarts
If you need ECharts GL support, please install it first: npm install echarts-gl -S # or yarn add echarts-gl
Import other extensions such as themes or echarts-gl in your main.ts: ECharts Extensions
import echarts and provide it in NgxEchartsModule.forRoot({ echarts }).
NgxEchartsCoreModule is removed.
Please refer to ECharts Documentation for more details.
Since version 5.0.1 ECharts supports Treeshaking with NPM.

Support

For any new features, suggestions and bugs create an issue on GitHub. If you have any questions check and ask questions on community page Stack Overflow .

Find more information at: