Quadrant

Scatter Chart

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height:450px;width:500px;"></div>

JavaScript

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        defaultSeriesType:'scatter',
        borderWidth:1,
        borderColor:'#ccc',
        marginLeft:90,
        marginRight:50,
        backgroundColor:'#eee',
        plotBackgroundColor:'#fff',
    },
    credits:{enabled:false},
    title:{
        text:'Chart Title'
    },
    legend:{
        enabled:false                                
    },
    tooltip: {
        formatter: function() {
            return '<b>'+ this.series.name +'</b><br/>'+
                this.x +': '+ this.y;
        }
    },
    plotOptions: {
        series: {
            shadow:false,
        }
    },
    xAxis:{
        title:{
            text:'X Axis Title'
        },
        min:-100,
        max:100,
        tickInterval:100,
        minorTickInterval:10,
        tickLength:0,
        minorTickLength:0,
        gridLineWidth:1,
        showLastLabel:true,
        showFirstLabel:false,
        lineColor:'#ccc',
        lineWidth:1,
        
    },
    yAxis:{
        title:{
            text:'Y Axis<br/>Title',
            rotation:0,
            margin:25,
        },
        min:-100,
        max:100,
        tickInterval:100,
        minorTickInterval:10,
        tickLength:3,
        minorTickLength:0,
        lineColor:'#ccc',
        lineWidth:1,
        
    },
    series: [{
        color:'#185aa9',
        data: [{x:-70,y:-70},{x:-50,y:-50},{x:-30,y:-30},{x:-10,y:-10},{x:10,y:10},{x:30,y:30},{x:50,y:50},{x:70,y:70}],
    }]
});