amcharts / amcharts3-react

Official amCharts V3 React component
Apache License 2.0
118 stars 50 forks source link

d.clear is not a function #59

Open hrspandya opened 7 years ago

hrspandya commented 7 years ago

I am using Multiple panel chart with react using amCharts-react.

My Multiple panel chart works fine during first load.

But i also get this error, How do i fix this error? I am also not able to zoom in this chart because of previous error i suppose.

Exception has occurred: TypeError TypeError: d.clear is not a function

Here is my Exact code , for normal charts everything works, but amStock always have this issue,

import React, { Component } from 'react'; import { graphql } from 'react-apollo'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import { autobind } from 'core-decorators';

import AmCharts from '@amcharts/amcharts3-react'; import { allEventsQuery } from './queries'; import css from './issueDetails.scss';

require('amstock3/amcharts/amstock');

const config = { type: 'stock', theme: 'light', dataSets: [ { title: 'first data set', fieldMappings: [ { fromField: 'value', toField: 'value', }, { fromField: 'volume', toField: 'volume', }, ], dataProvider: [ { date: '2016-05-17T07:00:00.000Z', value: 109 }, { date: '2016-05-18T07:00:00.000Z', value: 114 }, { date: '2016-05-19T07:00:00.000Z', value: 138 }, { date: '2016-05-20T07:00:00.000Z', value: 113 }, { date: '2016-05-21T07:00:00.000Z', value: 145 }, { date: '2016-05-22T07:00:00.000Z', value: 141 }, { date: '2016-05-23T07:00:00.000Z', value: 150 }, { date: '2016-05-24T07:00:00.000Z', value: 110 }, { date: '2016-05-25T07:00:00.000Z', value: 153 }, { date: '2016-05-26T07:00:00.000Z', value: 134 }, ], categoryField: 'date', }, { title: 'second data set', fieldMappings: [ { fromField: 'value', toField: 'value', }, { fromField: 'volume', toField: 'volume', }, ], dataProvider: [ { date: '2016-05-17T07:00:00.000Z', value: 233 }, { date: '2016-05-18T07:00:00.000Z', value: 260 }, { date: '2016-05-19T07:00:00.000Z', value: 229 }, { date: '2016-05-20T07:00:00.000Z', value: 248 }, { date: '2016-05-21T07:00:00.000Z', value: 240 }, { date: '2016-05-22T07:00:00.000Z', value: 291 }, { date: '2016-05-23T07:00:00.000Z', value: 223 }, { date: '2016-05-24T07:00:00.000Z', value: 213 }, { date: '2016-05-25T07:00:00.000Z', value: 213 }, { date: '2016-05-26T07:00:00.000Z', value: 227 }, ], categoryField: 'date', compared: true, }, ], panels: [ { showCategoryAxis: false, title: 'Value', stockGraphs: [ { id: 'g1', valueField: 'value', comparable: true, compareField: 'value', lineThickness: 2, balloonText: '[[title]]:[[value]]', compareGraph: { lineThickness: 2, balloonText: '[[title]]:[[value]]', }, }, ], stockLegend: { periodValueTextComparing: '[[percents.value.close]]%', periodValueTextRegular: '[[value.close]]', }, }, ], chartScrollbarSettings: { graph: 'g1', }, chartCursorSettings: { valueBalloonsEnabled: true, fullWidth: true, cursorAlpha: 0.1, valueLineBalloonEnabled: true, valueLineEnabled: true, valueLineAlpha: 0.5, }, periodSelector: { position: 'bottom', periods: [ { period: 'MM', selected: true, count: 1, label: '1 month', }, { period: 'YYYY', count: 1, label: '1 year', }, { period: 'YTD', label: 'YTD', }, { period: 'MAX', label: 'MAX', }, ], }, };

<div className={css.mainContainer}> <AmCharts.React style={{ width: '100%', height: '500px', }} options={config} /> </div>

As you can see Zoom does not work in any Multiple Panel Charts , and other issues.

Other stock charts are working and zoom works too.

image

image

image

ravithb commented 6 years ago

Seems this can be solved by re ordering the Githubissues.

  • Githubissues is a development platform for aggregating issues.