Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <title>Test iOS and VoiceOver</title>
</head>
<body>
    <h1>Defect demo</h1>
    <p><a href="#" class="remove-highchart">Remove the Highchart</a></p>
    <form>
        <fieldset>
            <legend>Which fruit do you prefer?</legend>
            <input type="radio" id="fruit_apples" name="fruit" value="apples">
            <label for="fruit_apples">Apples</label>
​
            <input type="radio" id="fruit_oranges" name="fruit" value="oranges">
            <label for="fruit_oranges">Oranges</label>
        </fieldset>
​
        <fieldset>
            <legend>Which vegetable do you prefer?</legend>
            <input type="radio" id="vegetable_cucumbers" name="vegetable" value="cucumbers">
            <label for="vegetable_cucumbers">Cucumbers</label>
​
            <input type="radio" id="vegetable_pumpkins" name="vegetable" value="pumpkins">
            <label for="vegetable_pumpkins">Pumpkins</label>
        </fieldset>
    </form>
​
    <div id="highcharts"></div>
​
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/highcharts/4.1.1/highcharts.js"></script>
    <script>
        var highchart = new Highcharts.Chart({
            chart: {
                renderTo: 'highcharts',
                type: 'bar'
            },
            title: {
                text: 'Fruit Consumption'
            },
            xAxis: {
                categories: ['Apples', 'Bananas', 'Oranges']
            },
            yAxis: {
                title: {
                    text: 'Fruit eaten'
                }
            },
            series: [{
                name: 'Jane',
                data: [1, 0, 4]
            }, {
                name: 'John',
                data: [5, 7, 3]
            }]
        });
      
        $('.remove-highchart').click(function(e) {
          e.preventDefault();
          if (highchart !== null) {
            highchart.destroy();
            highchart = null;
          }
        });
    </script>
</body>
</html>
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
keeganstreetpro
0viewers