Demo - FlexChart Export

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.grapecity.com/wijmo/5.latest/styles/wijmo.min.css">
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.min.js"></script>
<script src="https://cdn.grapecity.com/wijmo/5.latest/controls/wijmo.chart.min.js"></script>
<div class="container">

  <h1>
    FlexChart Export</h1>
  <p>
    Saving charts as images for inclusion in other documents
    is a common requirement. Some browsers support this as
    a context menu option, but not all.</p>
  <p>
    The FlexChart's <b>saveImageToFile</b> method makes this
    really easy:</p>    
  
  <p id="saveButtons">
    Save as:
    <button class="btn btn-default">PNG</button>
    <button class="btn btn-default">JPEG</button>
    <button class="btn btn-default">SVG</button>
  </p>

  <div id="theChart"></div>
  
</div>

CSS

.wj-flexchart {
  height: 300px;
  width: 1100px;
  margin: 10px 0;
}
body {
  margin-bottom: 24pt;
}

JavaScript

onload = function() {

  // create the chart
  var theChart = new wijmo.chart.FlexChart('#theChart', {
  	header: 'Phase II Test Results',
    chartType: 'Scatter',
    axisY: {
      axisLine: true
    },
    series: [
    	{
      	name: 'Experiment 1', 
        itemsSource: getData(30, 0, 3),
        bindingX: 'x',
        binding: 'y' },
    	{
      	name: 'Experiment 2',
        itemsSource: getData(30, 100, 12),
        bindingX: 'x', 
        binding: 'y' },
    	{
      	name: 'Experiment 3',
        itemsSource: getData(30, -100, 24),
        bindingX: 'x', 
        binding: 'y' },
    ],
    axisX: {
      //overlappingLabels: 'Show'
      majorUnit: 3
    }
  });

	// save chart image to file
  document.getElementById('saveButtons').addEventListener('click', function(e) {
  	if (e.target instanceof HTMLButtonElement) {
    	theChart.saveImageToFile('FlexChart.' + e.target.textContent);
    }
  })
  
	// data sources
  function getData(cnt, a, b) {
  	var arr = [],
    	  x = - cnt;
    for (i = 0; i < cnt * 2 + 1; i++) {
    	var rnd = Math.random() * cnt - cnt / 2;
    	arr.push({
      	x: x,
        y: a + x * (b + rnd) + rnd
      });
      x += 1;
    }
    return arr;
  }
}