Echarts在线免费图表

 
            option = {
            title : {
                text : '类目坐标散点图',
                subtext : 'dataZoom支持'
            },
            tooltip : {
                trigger: 'axis',
                axisPointer:{
                    show: true,
                    type : 'cross',
                    lineStyle: {
                        type : 'dashed',
                        width : 1
                    }
                }
            },
            //右上按钮设置
            toolbox: {
                show : true,
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
            //滑动条设置
            dataZoom: {
                show: true,
                start : 40,
                end : 50
            },
            legend : {
                data : ['series1','series2']
            },
            /*dataRange: {
                min: 0,
                max: 50,
                orient: 'horizontal',
                y: 30,
                x: 'center',
                //text:['高','低'],           // 文本，默认为数值文本
                color:['lightgreen','orange'],
                splitNumber: 1
            },*/
            xAxis : [
                {
                    type : 'category',
                    axisLabel: {
                        formatter : function(v) {
                            return '类' + v
                        }
                    },
                    //X轴长度
                    data : function (){
                        var list = [];
                        var len = 0;
                        while (len++ < 80) {
                            list.push(len);
                        }
                        return list;
                    }()
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            animation: false,
            series : [
                {               //详情
                    name:'series1',
                    type:'scatter',
                    tooltip : {
                        trigger: 'item',
                        formatter : function (params) {
                            return params.seriesName + ' （'  + '类' + params.value[0] + '）<br/>'
                                    + params.value[1] + ', '
                                    + params.value[2];
                        },
                        axisPointer:{
                            show: true
                        }
                    },
                    //series1圆大小
                    symbolSize: function (value){
                        //return Math.round(value[2]/10);
                        return 20;
                    },

                    data: (function () {
                        //len为X坐标   ，Y轴坐标，位置
                        
                        var d = [];
                        var len = 0;
                        var value;
                        while (len++ < 100) {
                            d.push([
                                len,5,500
                            ]);
                            d.push([
                                len,5+4,50
                            ]);
                        }
                        return d;
                    })(),
                    label: {
                        normal: {
                            position: 'inside',
                            show: true,
                            formatter: function(param) {
                                // 在这里改变成你要的值
                                return param.value;
                            }
                        }
                    }
                },
                {
                    name:'series2',
                    type:'scatter',
                    tooltip : {
                        trigger: 'item',
                        formatter : function (params) {
                            return params.seriesName + ' （'  + '类' + params.value[0] + '）<br/>'
                                    + params.value[1] + ', '
                                    + params.value[2];
                        },
                        axisPointer:{
                            show: true
                        }
                    },
                    symbolSize: function (value){
                        //return Math.round(value[2]/10);
                        return 20;
                    },
                    data: (function () {
                        var d = [];
                        var len = 0;
                        var value;
                        while (len++ < 20) {
                            d.push([
                                len,40,50
                            ]);
                            d.push([
                                len,50,50
                            ]);
                        }
                        return d;
                    })()
                }
            ]
        };