Echarts实战案例代码(35)：股票智能跟踪分析系统

option = {
    backgroundColor: "#0f375f",
    title: {
        text: '股票智能跟踪分析系统',
        textStyle: {
            align: 'right',
            color: '#fff',
            fontSize: 20,
        },
        top: '5%',
        left: 'center',
    },
    grid: {
        top: "16%",
        bottom: "2%",
        left: "2%",
        right: "5%",
        containLabel: true
    },
    legend: {
        data: ["买入价格", "卖出价格", "收盘价", "止损价格"],
        top: "10%",
        x: "center",
        icon: "circle",
        itemWidth: 15,
        textStyle: {
            color: "#fff",
            fontSize: 12,
        }
    },
    tooltip: {
        trigger: "axis",
    },
    xAxis: {
        type: 'category',
        boundaryGap: false, //坐标轴两边留白
        data: ['2/18', '2/19', '2/20', '2/21', '2/22', '2/23', '2/24', '2/25', '2/26'],
        axisLabel: { //坐标轴刻度标签的相关设置。
            textStyle: {
                color: '#fff',
                fontStyle: 'normal',
                fontSize: 10,
            },
        },
        axisTick: { //坐标轴刻度相关设置。
            show: false,
        },
        axisLine: { //坐标轴轴线相关设置
            lineStyle: {
                color: '#fff',
                opacity: 0.2
            }
        },
        splitLine: { //坐标轴在 grid 区域中的分隔线。
            show: false,
        }
    },
    yAxis: [{
        type: 'value',
        name: '元',
        axisTick: {
            show: false
        },
        axisLine: { //  改变y轴颜色
            lineStyle: {
                color: '#fff'
            }
        },
        axisLabel: { //  改变y轴字体颜色和大小
            textStyle: {
                color: "#fff",
                fontSize: 10
            }
        },
        splitLine: {
            show: true,
            lineStyle: {
                color: "#0c2c5a" //内容线
            }
        }
    }],
    /*    dataZoom: [{
            show: false,
            start: 0,
            end: 50,
            type: "inside",
        }],*/
    series: [{
            name: "买入价格",
            type: "line",
            symbol: "circle",
            symbolSize: 8,
            itemStyle: {
                color: "yellow"
            },
            markLine: {
                symbol: "none",
                silent: true,
                lineStyle: {
                    normal: {
                        type: "dashed"
                    }
                },
                label: {
                    position: "start"
                },
                data: [{
                    yAxis: 32,
                    lineStyle: {
                        width: 1.6560000000000001,
                        color: "yellow"
                    },
                    label: {
                        show: true,
                        position: '',
                    }
                }]
            }
        },
        {
            name: "卖出价格",
            type: "line",
            symbol: "circle",
            symbolSize: 8,
            itemStyle: {
                color: "#4BC946"
            },
            markLine: {
                symbol: "none",
                silent: true,
                lineStyle: {
                    normal: {
                        type: "dashed"
                    }
                },
                label: {
                    position: "start"
                },
                data: [{
                    yAxis: 45,
                    lineStyle: {
                        width: 1.6560000000000001,
                        color: "#4BC946"
                    },
                    label: {
                        show: true,
                        position: ''
                    }
                }]
            }
        },
        {
            name: "止损价格",
            type: "line",
            symbol: "circle",
            symbolSize: 8,
            itemStyle: {
                color: 'rgba(0,77,167,1)'
            },
            markLine: {
                symbol: "none",
                silent: true,
                lineStyle: {
                    normal: {
                        type: "dashed"
                    }
                },
                label: {
                    position: "start"
                },
                data: [{
                    yAxis: 40,
                    lineStyle: {
                        width: 1.6560000000000001,
                        color: "#fff"
                    },
                    label: {
                        show: true,
                        position: ''
                    }
                }]
            }
        },
        {
            name: '收盘价',
            type: 'line',
            symbol: 'circle',
            data: [10, 20, 30, 40, 50, 54, 48, 30, 40],
            barWidth: 0,
            barGap: 0, //柱间距离
            markLine: {
                data: [{
                    type: "average"
                }],
                silent: true
            }
        },
    ]
};