首页 > 其他分享 >echarts

echarts

时间:2022-09-27 17:56:00浏览次数:30  
标签:domain name image PEIS MS PhyExaManagement echarts

 // 基于准备好的dom,初始化echarts实例
    var myChart = echarts.init(document.getElementById('LeftEar'));
    // 指定图表的配置项和数据
    var option = {
        title: {
            text: '左耳'
        },

        tooltip: {
            trigger: 'axis',
            formatter: function (val) {//鼠标hover时显示的内容 val是相关对象
                var str = ""
                str += val[0].seriesName + ":" + g_RigthQD[val[0].dataIndex] + "<br>"
                str += val[1].seriesName + ":" + g_RigthGD[val[1].dataIndex]
                return str
            }
        },
        legend: {
            selectedMode: false,
            //data: ['气导', '骨导']
            data: [
                {
                    name: '气导',
                    icon: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/b2.png'
                },
                {
                    name: '骨导',
                    icon: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/g8.png'
                }
            ]
        },
        grid: {
            left: '3%',
            right: '4%',
            bottom: '5%',
            top: '50px',
            containLabel: true
        },
        //下载按钮
        //toolbox: {  
        //    feature: {
        //        saveAsImage: {}
        //    }
        //},
        xAxis: {
            type: 'category',
            boundaryGap: true,
            "axisLine": {
                "show": false  //隐藏x轴线
            },
            "axisTick": {
                "show": false //隐藏x轴刻度
            },
            splitLine: {
                show: true
            },
            data: [500, 1000, 2000, 3000, 4000, 6000]
        },
        yAxis: [{
            min: 130, //y轴的最小值
            max: -20, //y轴最大值
            interval: 10, //值之间的间隔
            ////reverse: true,
            //type: 'value',

            type: 'value',
            inverse: true,
            scale: true

        }],
        animation: false,
        series: [{
            name: '气导',
            type: 'line',
            data: g_LeftQDMount,
            itemStyle: {
                normal: {
                    color: '#00B0F0',
                    lineStyle: {
                        color: '#00B0F0'
                    }
                }
            },
            markPoint: {
                data: [{
                    name: 'QD500',
                    yAxis: g_LeftQD[0],
                    xAxis: '500',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[0] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'QD1000',
                    yAxis: g_LeftQD[1],
                    xAxis: '1000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[1] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'QD2000',
                    yAxis: g_LeftQD[2],
                    xAxis: '2000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[2] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'QD3000',
                    yAxis: g_LeftQD[3],
                    xAxis: '3000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[3] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'QD4000',
                    yAxis: g_LeftQD[4],
                    xAxis: '4000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[4] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'QD6000',
                    yAxis: g_LeftQD[5],
                    xAxis: '6000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftQDpicture[5] + '.png',
                    symbolSize: 15
                }

                ]
            },
        },
        {
            name: '骨导',
            type: 'line',
            data: g_LeftGDMount,
            itemStyle: {
                normal: {
                    color: '#5959F8',
                    lineStyle: {
                        color: '##5959F8',
                        type: 'dotted'  //'dotted'虚线 'solid'实线
                    }
                }
            },
            markPoint: {
                data: [{
                    name: 'GD500',
                    yAxis: g_LeftGD[0],
                    xAxis: '500',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[0] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'GD1000',
                    yAxis: g_LeftGD[1],
                    xAxis: '1000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[1] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'GD2000',
                    yAxis: g_LeftGD[2],
                    xAxis: '2000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[2] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'GD3000',
                    yAxis: g_LeftGD[3],
                    xAxis: '3000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[3] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'GD4000',
                    yAxis: g_LeftGD[4],
                    xAxis: '4000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[4] + '.png',
                    symbolSize: 15
                },
                {
                    name: 'GD6000',
                    yAxis: g_LeftGD[5],
                    xAxis: '6000',
                    value: '',
                    symbol: 'image://http://' + domain + '/PEIS_MS/PhyExaManagement/PhysicalExaminer/Image/' + g_LeftGDpicture[5] + '.png',
                    symbolSize: 15
                }

                ]
            },
        }
        ]
    };
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);

 

 

标签:domain,name,image,PEIS,MS,PhyExaManagement,echarts
From: https://www.cnblogs.com/Ma-YuHao/p/16735406.html

相关文章