How to use the highcharts/modules/exporting function in highcharts

To help you get started, we’ve selected a few highcharts examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github wri / gfw-mapbuilder / src / js / utils / charts.js View on Github external
/* eslint no-unused-vars: 0 */
import analysisKeys from 'constants/AnalysisConstants';
import number from 'dojo/number';
import Highcharts from 'highcharts';
import enableExporting from 'highcharts/modules/exporting';

enableExporting(Highcharts);

Highcharts.setOptions({
  lang: {
    thousandsSep: ','
  }
});
/**
* Module to help in generating charts and also in formatting data for the charts
* Formatting functions should start with formatXXXX and return series and optionally colors
*/
export default {

	/**
	* Make a simple bar chart
	* @param {HTML Element} el
	* @param {array[string]} labels
github highcharts / highcharts-angular / src / app / app.component.ts View on Github external
import SunsetTheme from 'highcharts/themes/sunset.src.js';

const mapWorld = require('@highcharts/map-collection/custom/world.geo.json');

import * as HC_customEvents from 'highcharts-custom-events';
HC_customEvents(Highcharts);

// Alternative way of a plugin loading:
//const HC_ce = require('highcharts-custom-events');
//HC_ce(Highcharts);

StockModule(Highcharts);
MapModule(Highcharts);
GanttModule(Highcharts);
ExportingModule(Highcharts);

// Legacy way of map loading - see file at the path for more info.
//require('../../js/worldmap')(Highcharts);

SunsetTheme(Highcharts);


Highcharts.setOptions({
  title: {
    style: {
      color: 'tomato'
    }
  },
  legend: {
    enabled: false
  }
github dexma / ui-components / src / components / Chart.js View on Github external
import deepEqual from 'deep-equal';
import { withTheme } from 'styled-components';

import Highcharts from 'highcharts';
import addSankeyModule from 'highcharts/modules/sankey';
import addExportingModule from 'highcharts/modules/exporting';
import addOfflineExportingModule from 'highcharts/modules/offline-exporting';
import addExportData from 'highcharts/modules/export-data';

import boost from 'highcharts/modules/boost';

import theme from 'styles/theme';

boost(Highcharts);
addSankeyModule(Highcharts);
addExportingModule(Highcharts);
addOfflineExportingModule(Highcharts);
addExportData(Highcharts);

const propTypes = {
  options: PropTypes.objectOf(PropTypes.any),
  callback: PropTypes.func,
  theme: PropTypes.shape({}),
};

const defaultProps = {
  theme: theme,
};

const StyledChart = () => {
  const {
    backgroundColor,
github tlambert03 / FPbase / static / src / fpbase-spectra / Components / SpectraViewer / SpectraViewer.jsx View on Github external
import applyPatterns from "highcharts/modules/pattern-fill"
import applyExportingData from "highcharts/modules/export-data"
import addBoostModule from "highcharts/modules/boost"
import update from "immutability-helper"
import { css } from "@emotion/core"
import { BarLoader } from "react-spinners"
import gql from "graphql-tag"
import XRangePickers from "./XRangePickers"
import SpectrumSeries from "./SpectrumSeries"
import fixLogScale from "./fixLogScale"
import DEFAULT_OPTIONS from "./ChartOptions"
import NoData from "./NoData"
import useWindowWidth from "../useWindowWidth"
import useSpectraData from "../useSpectraData"

applyExporting(Highcharts)
applyExportingData(Highcharts)
applyPatterns(Highcharts)
addBoostModule(Highcharts)
fixLogScale(Highcharts)

const override = css`
  display: block;
  position: absolute;
  left: 40%;
  top: 50%;
  width: 20%;
  z-index: 10;
`

const calcHeight = width => {
  if (width < 600) return 275
github Azure / Azure-AppServices-Diagnostics-Portal / AngularApp / projects / diagnostic-data / src / lib / components / highcharts-graph / highcharts-graph.component.ts View on Github external
import * as momentNs from 'moment';
import { Component, Input, OnInit } from '@angular/core';
import { TimeSeriesType } from '../../models/detector';
import * as Highcharts from 'highcharts';
import HC_exporting from 'highcharts/modules/exporting';
import * as HC_customEvents_ from 'highcharts-custom-events';
import AccessibilityModule from 'highcharts/modules/accessibility';
import { DetectorControlService } from '../../services/detector-control.service';

const HC_customEvents = HC_customEvents_;
HC_exporting(Highcharts);
AccessibilityModule(Highcharts);
HC_customEvents(Highcharts);

const moment = momentNs;

@Component({
    selector: 'highcharts-graph',
    templateUrl: './highcharts-graph.component.html',
    styleUrls: ['./highcharts-graph.component.scss']
})
export class HighchartsGraphComponent implements OnInit {
    Highcharts: typeof Highcharts = Highcharts;
    options: any;

    @Input() HighchartData: any = [];
github tronscan / tronscan-frontend / src / components / common / LineCharts.js View on Github external
import 'echarts/lib/component/markPoint'
import 'echarts/lib/chart/bar'
import Highcharts from 'highcharts/highstock';
import HighchartsMore from 'highcharts/highcharts-more';
import HighchartsDrilldown from 'highcharts/modules/drilldown';
import Highcharts3D from 'highcharts/highcharts-3d';
import Exporting from 'highcharts/modules/exporting';
import Variabled from 'highcharts/modules/variable-pie.js';
import isMobile from './../../utils/isMobile';

import {cloneDeep} from "lodash";

HighchartsMore(Highcharts)
HighchartsDrilldown(Highcharts);
Highcharts3D(Highcharts);
Exporting(Highcharts);
Variabled(Highcharts)

export class SupplyAreaHighChart extends React.Component {

    constructor(props) {
        super(props)
        this.myChart = null;
        let id = ('_' + Math.random()).replace('.', '_');
        this.state = {
            areaId: 'areaBtt' + id
        }
    }
    initArea(id) {
        let total = 990000000000;
        let _config = cloneDeep(config.supplyAreaHighChart);
        let {intl, data, source, chartData} = this.props;
github tronscan / tronscan-frontend / src / components / common / RingPieChart.js View on Github external
import 'echarts/lib/component/legend'
import 'echarts/lib/component/legend/ScrollableLegendModel.js'
import 'echarts/lib/component/legend/ScrollableLegendView.js'
import 'echarts/lib/component/legend/scrollableLegendAction.js'
import {cloneDeep} from "lodash";

import Highcharts from 'highcharts/highcharts';
import HighchartsMore from 'highcharts/highcharts-more';
import HighchartsDrilldown from 'highcharts/modules/drilldown';
import Highcharts3D from 'highcharts/highcharts-3d';
import Exporting from 'highcharts/modules/exporting';

HighchartsMore(Highcharts)
HighchartsDrilldown(Highcharts);
Highcharts3D(Highcharts);
Exporting(Highcharts);


export class RingPieReact extends React.Component {

  constructor(props) {
    super(props)
    let id = ('_' + Math.random()).replace('.', '_');
    this.state = {
      pieId: 'ringPie' + id
    }
  }

  initPie(id) {
    let {intl, data, message} = this.props;

    let myChart = echarts.getInstanceByDom(document.getElementById(id));