angular2-highcharts

How to fix this error Type 'number' has no properties in common with type 'XrangePointOptionsObject'

落花浮王杯 提交于 2020-06-09 05:38:08
问题 I'm getting this error Type 'number' has no properties in common with type 'XrangePointOptionsObject'. I want to add bar chart using angular highchatrs in my angular project but I'm not able to add because of this error. So can you please help me to solve this error. Thanks. this is my component.ts file import { Chart } from 'angular-highcharts'; import * as Highcharts from 'highcharts' @Component({ selector: 'app-bar-chart', templateUrl: './bar-chart.component.html', styleUrls: ['./bar-chart

HighCharts pie chart labels not displayed properly

折月煮酒 提交于 2020-01-07 05:26:07
问题 I have taken an example Highcharts plnkr and edited it to match my requirements. Below is the plnkr that I have developed. https://plnkr.co/edit/yzXLz7AIDoWa1Pzxxl4k?p=preview Here all the labels and icons for the labels are displayed properly. But when I include it in my application, the icons for the labels are not displayed properly. It is displayed as below My label code is as below labelFormatter: function () { return '<div class="legend-label-md row" style=" border-bottom:1px solid

renderer.text not working in gevgeny/angular2-highcharts

生来就可爱ヽ(ⅴ<●) 提交于 2019-12-24 20:47:40
问题 I am using gevgeny/angular2-highcharts to use highchart in angular project. I am trying to use Highcharts.SVGRenderer#text. It work in highstock normally Woking Fiddle If same code I use in angular2-highcharts it is not working Check Plunker Snippet chart:{ events:{ load:function(){ var charts=this; charts.renderer.text('Series 1', 10, 11) .attr({ rotation: -25 }) .css({ color: '#4572A7', fontSize: '16px' }) .add(); } } }, How I can use renderer.text in angular2 highcharts? 回答1: Finally I got

Highcharts datalabel 'callout' shape not working for donut chart

折月煮酒 提交于 2019-12-14 02:43:52
问题 I've been trying to implement dynamic 'callout' shape datalabels for donut chart using Highcharts javascript library, where notch of datalabels point to respective arc. something like this: https://imgur.com/yKhWKOu I've created the 'callout' shape using highcharts renderer method, but unable to make it dynamic. This is what I'm getting right now: https://imgur.com/VMuVwdk My code is : <!DOCTYPE html> <html> <head> </head> <body> <div id="container" style="min-width: 310px; height: 400px; max

export csv from highcharts

孤人 提交于 2019-12-11 21:12:53
问题 I'm using angular-5,angular2-highcharts version 0.5.5 and highcharts version 6.0.7. I want to add in my html in not in the chart a button for download the chart in png or csv. Png one works fine, but I can't got it with csv: This is my code: downloadPng(): void { //this one works this.chart.exportChart({ type: 'image/png', filename: this.title }); } downloadCsv(): void { //this one crashes this.chart.exportChart({ type: 'text/csv', filename: this.title },{ itemDelimiter: ';', csv: this.chart

Can't bind to 'options' since it isn't a known property of 'chart'

女生的网名这么多〃 提交于 2019-12-11 16:59:12
问题 I have created a chart module using Angular2-highcharts but when I try to run the application I am getting the followoing error. ERROR Error: Uncaught (in promise): Error: Template parse errors: Can't bind to 'options' since it isn't a known property of 'chart'. (" <!-- <p text-center>Kye Info Page under construction</p> --> <chart [ERROR ->][options]="chartOptions" type="chart"></chart> </ion-content> "): ng:///KeyinfoPageModule/KeyinfoPage.html@27:9 'chart' is not a known element: 1. If

How to import exporting.js and export-data.js using angular2-highcharts and AOT compiler?

限于喜欢 提交于 2019-12-11 16:23:27
问题 I'm using angular2-highcharts and my chart works just fine, but I need to export the chart to XLS. All I need to achieve this is doing HighchartsExporting(Highcharts); HighchartsExportData(Highcharts); somewhere in the code, and the export options will show up by the chart. The problem is how to import HighchartsExporting and HighchartsExportData properly, because the standard solution @NgModule({ imports: [ BrowserModule, ChartModule.forRoot( require('highcharts'), require('highcharts

Recieve HighStock RangeSelector button event in Angular 2+ component

て烟熏妆下的殇ゞ 提交于 2019-12-11 16:04:06
问题 I want to access highstock rangeSelector button event inside my angular component.I am using the angular2-highcharts package to use the highcharts library. Tried to access it using the (afterSetExtremes) binding but without any success. The code is here. Please help. Thanks!! 回答1: Update your template as template: ` <chart type="StockChart" [options]="options" (click)="onClick($event)"> </chart> `, function onClick(e) { console.log('You clicked '+e.toElement.innerHTML+" button") } Plunker

Angular2-Highcharts: Pie chart size based on the width of the panel

核能气质少年 提交于 2019-12-04 07:13:39
问题 I have created a Pie chart and I am placing this Pie chart inside a panel. My panel width can be 600 or 400 depending on the user settings. When the size is 600 Pie and the legend is displayed properly. But when it is 400, the legend is displayed outside of the panel. Is there a way to reduce the size of the pie in that case, also the legend can be displayed at the bottom if the size is not sufficient. My plnkr https://plnkr.co/edit/yzXLz7AIDoWa1Pzxxl4k?p=preview My plot options plotOptions:

Angular2-Highcharts: Pie chart size based on the width of the panel

亡梦爱人 提交于 2019-12-02 10:56:38
I have created a Pie chart and I am placing this Pie chart inside a panel. My panel width can be 600 or 400 depending on the user settings. When the size is 600 Pie and the legend is displayed properly. But when it is 400, the legend is displayed outside of the panel. Is there a way to reduce the size of the pie in that case, also the legend can be displayed at the bottom if the size is not sufficient. My plnkr https://plnkr.co/edit/yzXLz7AIDoWa1Pzxxl4k?p=preview My plot options plotOptions: { pie: { innerSize: 120, allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: false },