Echart 直方图和折线计算残差率

<template>
  <div>
    <div class="bar-vertical-pic" style="width: 100%">
      <div id="distributeMathBar" style="width: 100%;height: 270px"></div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'DistributeMathBar',
    description: '残差分布图',
    mixins: [],
    components: {},
    props: {
      objInfo: Object
    },
    data() {
      return {
        seriesValuedata: [{ 'value': '-1.2' }, { 'value': '-0.8' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '-0.7' }, { 'value': '0.5' }, { 'value': '0.2' }, { 'value': '-1.0' }, { 'value': '-0.5' }, { 'value': '-0.5' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '0.5' }, { 'value': '-1.2' }, { 'value': '-0.3' }, { 'value': '0.2' }, { 'value': '-0.5' }, { 'value': '0.0' }, { 'value': '-1.1' }, { 'value': '-0.2' }, { 'value': '-0.3' }, { 'value': '-0.6' }, { 'value': '-0.5' }, { 'value': '-0.8' }, { 'value': '-0.6' }, { 'value': '0.8' }, { 'value': '0.3' }, { 'value': '0.5' }, { 'value': '-0.7' }, { 'value': '-0.3' }, { 'value': '1.1' }, { 'value': '-0.3' }, { 'value': '0.1' }, { 'value': '-0.7' }, { 'value': '-0.7' }, { 'value': '0.0' }, { 'value': '-0.6' }, { 'value': '0.0' }, { 'value': '0.1' }, { 'value': '-0.4' }, { 'value': '0.5' }, { 'value': '1.1' }, { 'value': '0.6' }, { 'value': '0.8' }, { 'value': '0.2' }, { 'value': '-0.3' }, { 'value': '-0.7' }, { 'value': '-1.1' }, { 'value': '1.2' }, { 'value': '-0.3' }, { 'value': '-0.8' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '0.7' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '-0.4' }, { 'value': '0.1' }, { 'value': '0.4' }, { 'value': '0.2' }, { 'value': '-0.4' }, { 'value': '-0.2' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '-1.2' }, { 'value': '-0.2' }, { 'value': '0.0' }, { 'value': '-1.0' }, { 'value': '-1.9' }, { 'value': '0.4' }, { 'value': '0.3' }, { 'value': '0.4' }, { 'value': '-1.0' }, { 'value': '-0.5' }, { 'value': '-0.3' }, { 'value': '0.1' }, { 'value': '1.3' }, { 'value': '0.5' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '0.6' }, { 'value': '-0.4' }, { 'value': '-1.0' }, { 'value': '-0.8' }, { 'value': '-0.6' }, { 'value': '0.4' }, { 'value': '-0.4' }, { 'value': '-0.9' }, { 'value': '-1.8' }, { 'value': '-0.6' }, { 'value': '-1.1' }, { 'value': '-0.7' }, { 'value': '1.1' }, { 'value': '-0.6' }, { 'value': '0.0' }, { 'value': '-0.7' }, { 'value': '0.1' }, { 'value': '-0.5' }, { 'value': '0.5' }, { 'value': '0.0' }, { 'value': '0.0' }, { 'value': '-0.4' }, { 'value': '0.3' }, { 'value': '0.3' }, { 'value': '-0.5' }, { 'value': '1.0' }, { 'value': '0.8' }, { 'value': '0.1' }, { 'value': '0.9' }, { 'value': '0.3' }, { 'value': '0.0' }, { 'value': '-0.2' }, { 'value': '0.6' }, { 'value': '-1.3' }, { 'value': '0.9' }, { 'value': '0.4' }, { 'value': '0.5' }, { 'value': '-0.8' }, { 'value': '-0.5' }, { 'value': '1.2' }, { 'value': '-0.2' }, { 'value': '-0.5' }, { 'value': '0.5' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '-1.1' }, { 'value': '0.3' }, { 'value': '1.1' }, { 'value': '-0.5' }, { 'value': '0.5' }, { 'value': '-0.5' }, { 'value': '0.1' }, { 'value': '0.0' }, { 'value': '0.8' }, { 'value': '-1.0' }, { 'value': '0.8' }, { 'value': '-1.6' }, { 'value': '-0.4' }, { 'value': '0.2' }, { 'value': '-0.5' }, { 'value': '-0.5' }, { 'value': '-1.0' }, { 'value': '0.6' }, { 'value': '0.8' }, { 'value': '0.3' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '-0.5' }, { 'value': '-0.9' }, { 'value': '0.4' }, { 'value': '0.9' }, { 'value': '1.1' }, { 'value': '0.7' }, { 'value': '-0.7' }, { 'value': '-0.5' }, { 'value': '-0.1' }, { 'value': '0.3' }, { 'value': '0.5' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '0.3' }, { 'value': '0.7' }, { 'value': '0.7' }, { 'value': '-1.0' }, { 'value': '-0.3' }, { 'value': '-0.9' }, { 'value': '0.1' }, { 'value': '0.4' }, { 'value': '-0.4' }, { 'value': '-0.9' }, { 'value': '-0.6' }, { 'value': '0.5' }, { 'value': '0.0' }, { 'value': '0.4' }, { 'value': '-0.2' }, { 'value': '-0.7' }, { 'value': '0.9' }, { 'value': '0.0' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '1.3' }, { 'value': '0.2' }, { 'value': '0.6' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '-0.8' }, { 'value': '0.4' }, { 'value': '0.4' }, { 'value': '0.1' }, { 'value': '0.0' }, { 'value': '1.2' }, { 'value': '-0.4' }, { 'value': '-1.3' }, { 'value': '-0.5' }, { 'value': '-0.3' }, { 'value': '0.6' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '1.0' }, { 'value': '1.4' }, { 'value': '-0.5' }, { 'value': '-0.7' }, { 'value': '-0.2' }, { 'value': '-0.3' }, { 'value': '0.2' }, { 'value': '-0.7' }, { 'value': '-0.4' }, { 'value': '-0.4' }, { 'value': '0.7' }, { 'value': '0.1' }, { 'value': '-0.3' }, { 'value': '0.0' }, { 'value': '0.5' }, { 'value': '0.8' }, { 'value': '1.0' }, { 'value': '0.3' }, { 'value': '0.1' }, { 'value': '1.1' }, { 'value': '0.4' }, { 'value': '0.2' }, { 'value': '-0.8' }, { 'value': '0.7' }, { 'value': '-0.4' }, { 'value': '-0.2' }, { 'value': '-0.3' }, { 'value': '-0.2' }, { 'value': '0.7' }, { 'value': '-0.4' }, { 'value': '0.4' }, { 'value': '0.0' }, { 'value': '-0.4' }, { 'value': '-0.8' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '-1.2' }, { 'value': '1.5' }, { 'value': '0.1' }, { 'value': '-0.5' }, { 'value': '0.7' }, { 'value': '-1.0' }, { 'value': '-0.3' }, { 'value': '0.3' }, { 'value': '0.2' }, { 'value': '0.2' }, { 'value': '-0.6' }, { 'value': '1.1' }, { 'value': '0.6' }, { 'value': '-0.5' }, { 'value': '-0.3' }, { 'value': '0.5' }, { 'value': '0.6' }, { 'value': '-0.5' }, { 'value': '1.8' }, { 'value': '0.7' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '0.8' }, { 'value': '1.0' }, { 'value': '-0.1' }, { 'value': '0.0' }, { 'value': '-0.2' }, { 'value': '-0.5' }, { 'value': '-0.7' }, { 'value': '0.6' }, { 'value': '0.1' }, { 'value': '0.1' }, { 'value': '-1.1' }, { 'value': '-0.5' }, { 'value': '0.4' }, { 'value': '-1.4' }, { 'value': '-0.5' }, { 'value': '0.0' }, { 'value': '1.0' }, { 'value': '-1.2' }, { 'value': '0.6' }, { 'value': '1.2' }, { 'value': '0.4' }, { 'value': '0.5' }, { 'value': '0.5' }, { 'value': '0.9' }, { 'value': '0.8' }, { 'value': '0.5' }, { 'value': '-0.4' }, { 'value': '0.0' }, { 'value': '1.0' }, { 'value': '-1.0' }, { 'value': '0.6' }, { 'value': '0.3' }, { 'value': '0.7' }, { 'value': '0.6' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '-1.4' }, { 'value': '-0.1' }, { 'value': '-0.7' }, { 'value': '-0.7' }, { 'value': '-0.2' }, { 'value': '1.1' }, { 'value': '0.5' }, { 'value': '-0.7' }, { 'value': '-0.6' }, { 'value': '1.1' }, { 'value': '-0.2' }, { 'value': '0.2' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '1.2' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '1.4' }, { 'value': '-0.1' }, { 'value': '-0.6' }, { 'value': '-0.8' }, { 'value': '-0.4' }, { 'value': '-0.8' }, { 'value': '-0.2' }, { 'value': '-0.2' }, { 'value': '0.4' }, { 'value': '-0.6' }, { 'value': '0.3' }, { 'value': '0.3' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '0.5' }, { 'value': '0.4' }, { 'value': '0.6' }, { 'value': '-0.3' }, { 'value': '0.4' }, { 'value': '1.0' }, { 'value': '-0.8' }, { 'value': '1.0' }, { 'value': '0.7' }, { 'value': '0.8' }, { 'value': '-0.1' }, { 'value': '0.0' }, { 'value': '0.1' }, { 'value': '0.2' }, { 'value': '0.0' }, { 'value': '0.9' }, { 'value': '1.3' }, { 'value': '-0.7' }, { 'value': '-0.3' }, { 'value': '-1.3' }, { 'value': '-0.8' }, { 'value': '1.4' }, { 'value': '1.2' }, { 'value': '0.3' }, { 'value': '-0.7' }, { 'value': '0.0' }, { 'value': '-0.4' }, { 'value': '1.5' }, { 'value': '0.8' }, { 'value': '-0.1' }, { 'value': '-0.5' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '-1.3' }, { 'value': '1.1' }, { 'value': '-0.3' }, { 'value': '-0.8' }, { 'value': '-0.9' }, { 'value': '1.2' }, { 'value': '-0.1' }, { 'value': '0.5' }, { 'value': '-0.3' }, { 'value': '-0.7' }, { 'value': '-0.8' }, { 'value': '-0.7' }, { 'value': '-0.4' }, { 'value': '-0.2' }, { 'value': '-0.5' }, { 'value': '0.3' }, { 'value': '-0.5' }, { 'value': '0.5' }, { 'value': '-1.4' }, { 'value': '0.2' }, { 'value': '-0.2' }, { 'value': '0.5' }, { 'value': '0.0' }, { 'value': '-0.4' }, { 'value': '0.4' }, { 'value': '0.3' }, { 'value': '-0.3' }, { 'value': '-0.8' }, { 'value': '-0.4' }, { 'value': '1.1' }, { 'value': '0.0' }, { 'value': '-1.6' }, { 'value': '-0.2' }, { 'value': '0.1' }, { 'value': '0.6' }, { 'value': '-0.3' }, { 'value': '0.3' }, { 'value': '0.9' }, { 'value': '1.7' }, { 'value': '0.9' }, { 'value': '-0.1' }, { 'value': '-0.7' }, { 'value': '-0.7' }, { 'value': '0.3' }, { 'value': '0.8' }, { 'value': '0.1' }, { 'value': '1.0' }, { 'value': '-0.2' }, { 'value': '0.7' }, { 'value': '-0.4' }, { 'value': '-0.6' }, { 'value': '0.1' }, { 'value': '1.4' }, { 'value': '-0.3' }, { 'value': '0.4' }, { 'value': '-0.9' }, { 'value': '0.5' }, { 'value': '-0.5' }, { 'value': '-0.4' }, { 'value': '0.9' }, { 'value': '0.3' }, { 'value': '0.6' }, { 'value': '0.3' }, { 'value': '-0.5' }, { 'value': '0.2' }, { 'value': '1.1' }, { 'value': '1.1' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '0.2' }, { 'value': '-0.7' }, { 'value': '-0.8' }, { 'value': '1.2' }, { 'value': '0.8' }, { 'value': '1.6' }, { 'value': '0.2' }, { 'value': '-0.6' }, { 'value': '-0.1' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '0.3' }, { 'value': '-1.1' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '-0.4' }, { 'value': '-0.4' }, { 'value': '-1.2' }, { 'value': '0.4' }, { 'value': '0.0' }, { 'value': '-0.2' }, { 'value': '1.0' }, { 'value': '0.0' }, { 'value': '0.5' }, { 'value': '-0.3' }, { 'value': '-0.9' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '-0.2' }, { 'value': '0.6' }, { 'value': '-0.9' }, { 'value': '0.3' }, { 'value': '0.1' }, { 'value': '-0.5' }, { 'value': '-0.9' }, { 'value': '-0.7' }, { 'value': '-0.1' }, { 'value': '0.7' }, { 'value': '0.3' }, { 'value': '-0.6' }, { 'value': '0.7' }, { 'value': '0.6' }, { 'value': '-0.1' }, { 'value': '-1.0' }, { 'value': '-1.0' }, { 'value': '0.6' }, { 'value': '-0.2' }, { 'value': '-0.8' }, { 'value': '0.1' }, { 'value': '-0.3' }, { 'value': '0.8' }, { 'value': '0.8' }, { 'value': '-0.3' }, { 'value': '-1.4' }, { 'value': '-1.0' }, { 'value': '-0.6' }, { 'value': '1.4' }, { 'value': '-0.9' }, { 'value': '-0.9' }, { 'value': '-1.1' }, { 'value': '-0.8' }, { 'value': '0.4' }, { 'value': '-1.0' }, { 'value': '0.0' }, { 'value': '0.0' }, { 'value': '0.5' }, { 'value': '-0.2' }, { 'value': '-0.4' }, { 'value': '0.4' }, { 'value': '1.7' }, { 'value': '-0.8' }, { 'value': '1.3' }, { 'value': '-0.7' }, { 'value': '-1.0' }, { 'value': '0.8' }, { 'value': '1.6' }, { 'value': '-0.1' }, { 'value': '0.9' }, { 'value': '0.4' }, { 'value': '0.2' }, { 'value': '-0.4' }, { 'value': '-0.1' }, { 'value': '0.4' }, { 'value': '1.2' }, { 'value': '0.4' }, { 'value': '-0.9' }, { 'value': '0.4' }, { 'value': '1.1' }, { 'value': '0.3' }, { 'value': '0.4' }, { 'value': '0.6' }, { 'value': '-0.1' }, { 'value': '0.6' }, { 'value': '-1.1' }, { 'value': '0.8' }, { 'value': '-0.4' }, { 'value': '0.4' }, { 'value': '0.4' }, { 'value': '-0.1' }, { 'value': '0.0' }, { 'value': '-0.5' }, { 'value': '1.0' }, { 'value': '-1.0' }, { 'value': '-0.7' }, { 'value': '-0.1' }, { 'value': '-0.8' }, { 'value': '0.5' }, { 'value': '0.6' }, { 'value': '-1.0' }, { 'value': '-1.0' }, { 'value': '-0.6' }, { 'value': '0.1' }, { 'value': '1.4' }, { 'value': '-0.6' }, { 'value': '-1.0' }, { 'value': '0.3' }, { 'value': '1.0' }, { 'value': '1.3' }, { 'value': '0.3' }, { 'value': '0.5' }, { 'value': '-0.4' }, { 'value': '0.0' }, { 'value': '-0.5' }, { 'value': '1.2' }, { 'value': '0.0' }, { 'value': '-0.1' }, { 'value': '-0.7' }, { 'value': '-0.4' }, { 'value': '0.3' }, { 'value': '1.0' }, { 'value': '-0.1' }, { 'value': '-0.7' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '-0.6' }, { 'value': '0.0' }, { 'value': '-0.5' }, { 'value': '0.3' }, { 'value': '-0.1' }, { 'value': '-0.4' }, { 'value': '0.6' }, { 'value': '0.0' }, { 'value': '-0.6' }, { 'value': '-0.6' }, { 'value': '-0.8' }, { 'value': '-0.6' }, { 'value': '0.4' }, { 'value': '0.7' }, { 'value': '1.1' }, { 'value': '-0.4' }, { 'value': '-0.2' }, { 'value': '-0.8' }, { 'value': '0.9' }, { 'value': '0.6' }, { 'value': '1.4' }, { 'value': '-0.1' }, { 'value': '0.0' }, { 'value': '0.0' }, { 'value': '0.1' }, { 'value': '0.4' }, { 'value': '-0.9' }, { 'value': '-0.9' }, { 'value': '-0.2' }, { 'value': '-0.4' }, { 'value': '0.1' }, { 'value': '-1.0' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '1.1' }, { 'value': '-0.4' }, { 'value': '-0.7' }, { 'value': '-0.2' }, { 'value': '0.5' }, { 'value': '0.0' }, { 'value': '1.1' }, { 'value': '-0.7' }, { 'value': '0.0' }, { 'value': '-1.0' }, { 'value': '-0.9' }, { 'value': '0.8' }, { 'value': '0.6' }, { 'value': '0.1' }, { 'value': '0.4' }, { 'value': '1.5' }, { 'value': '0.4' }, { 'value': '0.7' }, { 'value': '0.1' }, { 'value': '-0.3' }, { 'value': '0.0' }, { 'value': '1.4' }, { 'value': '-0.4' }, { 'value': '-0.1' }, { 'value': '0.5' }, { 'value': '-0.8' }, { 'value': '0.6' }, { 'value': '-0.7' }, { 'value': '-1.2' }, { 'value': '0.4' }, { 'value': '-0.9' }, { 'value': '-0.4' }, { 'value': '0.5' }, { 'value': '0.7' }, { 'value': '-0.8' }, { 'value': '-1.0' }, { 'value': '0.4' }, { 'value': '-0.3' }, { 'value': '-0.1' }, { 'value': '-0.8' }, { 'value': '-1.5' }, { 'value': '-1.2' }, { 'value': '-0.6' }, { 'value': '0.9' }, { 'value': '-0.2' }, { 'value': '-0.7' }, { 'value': '0.8' }, { 'value': '-0.3' }, { 'value': '0.4' }, { 'value': '-0.1' }, { 'value': '0.4' }, { 'value': '1.3' }, { 'value': '-0.5' }, { 'value': '0.4' }, { 'value': '0.9' }, { 'value': '-0.7' }, { 'value': '0.2' }, { 'value': '-0.6' }, { 'value': '-1.2' }, { 'value': '0.3' }, { 'value': '-0.3' }, { 'value': '0.4' }, { 'value': '-0.5' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '0.0' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '0.8' }, { 'value': '1.8' }, { 'value': '0.6' }, { 'value': '-1.0' }, { 'value': '0.6' }, { 'value': '-0.7' }, { 'value': '-0.7' }, { 'value': '0.5' }, { 'value': '1.2' }, { 'value': '-0.9' }, { 'value': '-0.6' }, { 'value': '-0.8' }, { 'value': '-0.9' }, { 'value': '-0.2' }, { 'value': '1.2' }, { 'value': '-0.6' }, { 'value': '0.8' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '-1.1' }, { 'value': '0.6' }, { 'value': '0.3' }, { 'value': '0.8' }, { 'value': '0.7' }, { 'value': '-0.1' }, { 'value': '-0.7' }, { 'value': '-0.3' }, { 'value': '0.3' }, { 'value': '0.7' }, { 'value': '0.4' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '-0.3' }, { 'value': '-0.5' }, { 'value': '-1.0' }, { 'value': '0.6' }, { 'value': '-0.2' }, { 'value': '-0.4' }, { 'value': '-0.1' }, { 'value': '-0.4' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '1.1' }, { 'value': '1.0' }, { 'value': '0.4' }, { 'value': '1.0' }, { 'value': '-0.5' }, { 'value': '1.4' }, { 'value': '-0.4' }, { 'value': '0.3' }, { 'value': '1.3' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '0.5' }, { 'value': '1.1' }, { 'value': '0.3' }, { 'value': '0.7' }, { 'value': '-0.3' }, { 'value': '-1.3' }, { 'value': '-0.7' }, { 'value': '0.2' }, { 'value': '-0.7' }, { 'value': '0.5' }, { 'value': '0.4' }, { 'value': '-0.4' }, { 'value': '0.0' }, { 'value': '-0.6' }, { 'value': '0.2' }, { 'value': '0.3' }, { 'value': '0.2' }, { 'value': '-0.1' }, { 'value': '1.2' }, { 'value': '-0.5' }, { 'value': '-0.2' }, { 'value': '-0.9' }, { 'value': '-0.7' }, { 'value': '-1.1' }, { 'value': '0.7' }, { 'value': '-0.1' }, { 'value': '0.6' }, { 'value': '1.2' }, { 'value': '1.0' }, { 'value': '-1.1' }, { 'value': '1.2' }, { 'value': '-0.4' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '0.4' }, { 'value': '0.5' }, { 'value': '-0.7' }, { 'value': '0.9' }, { 'value': '-0.7' }, { 'value': '0.9' }, { 'value': '-1.2' }, { 'value': '-0.2' }, { 'value': '-0.8' }, { 'value': '-0.8' }, { 'value': '-0.5' }, { 'value': '-0.6' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '-1.3' }, { 'value': '0.2' }, { 'value': '-0.3' }, { 'value': '0.1' }, { 'value': '-1.0' }, { 'value': '-1.1' }, { 'value': '0.8' }, { 'value': '0.9' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '0.8' }, { 'value': '0.3' }, { 'value': '-1.6' }, { 'value': '-0.2' }, { 'value': '0.9' }, { 'value': '0.1' }, { 'value': '0.8' }, { 'value': '-0.8' }, { 'value': '-0.7' }, { 'value': '1.0' }, { 'value': '-0.8' }, { 'value': '0.0' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '-0.1' }, { 'value': '0.9' }, { 'value': '0.3' }, { 'value': '-0.6' }, { 'value': '0.5' }, { 'value': '1.7' }, { 'value': '0.1' }, { 'value': '0.2' }, { 'value': '0.1' }, { 'value': '0.2' }, { 'value': '-0.8' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '1.5' }, { 'value': '0.1' }, { 'value': '0.6' }, { 'value': '2.0' }, { 'value': '-0.2' }, { 'value': '-0.4' }, { 'value': '-1.2' }, { 'value': '-0.6' }, { 'value': '0.1' }, { 'value': '1.3' }, { 'value': '0.1' }, { 'value': '0.1' }, { 'value': '0.7' }, { 'value': '0.5' }, { 'value': '-0.5' }, { 'value': '-0.7' }, { 'value': '0.9' }, { 'value': '0.2' }, { 'value': '0.6' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '-0.4' }, { 'value': '0.7' }, { 'value': '-0.3' }, { 'value': '0.1' }, { 'value': '0.6' }, { 'value': '0.5' }, { 'value': '-0.5' }, { 'value': '-0.3' }, { 'value': '-0.7' }, { 'value': '-0.3' }, { 'value': '-0.3' }, { 'value': '-0.7' }, { 'value': '0.8' }, { 'value': '0.0' }, { 'value': '-0.9' }, { 'value': '0.9' }, { 'value': '0.0' }, { 'value': '0.2' }, { 'value': '1.3' }, { 'value': '0.5' }, { 'value': '-0.1' }, { 'value': '1.4' }, { 'value': '-0.1' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '-0.2' }, { 'value': '0.5' }, { 'value': '0.8' }, { 'value': '0.2' }, { 'value': '-0.5' }, { 'value': '-0.5' }, { 'value': '0.6' }, { 'value': '0.2' }, { 'value': '1.2' }, { 'value': '-0.2' }, { 'value': '1.3' }, { 'value': '0.7' }, { 'value': '0.7' }, { 'value': '-0.6' }, { 'value': '0.0' }, { 'value': '-0.2' }, { 'value': '-0.5' }, { 'value': '1.6' }, { 'value': '0.9' }, { 'value': '0.4' }, { 'value': '0.9' }, { 'value': '0.5' }, { 'value': '0.0' }, { 'value': '0.0' }, { 'value': '-0.8' }, { 'value': '-0.1' }, { 'value': '-1.0' }, { 'value': '-0.7' }, { 'value': '-0.5' }, { 'value': '-0.8' }, { 'value': '-1.0' }, { 'value': '-0.7' }, { 'value': '0.4' }, { 'value': '-0.9' }, { 'value': '0.1' }, { 'value': '-0.1' }, { 'value': '0.5' }, { 'value': '-0.1' }, { 'value': '0.1' }, { 'value': '0.0' }, { 'value': '-0.4' }, { 'value': '-0.5' }, { 'value': '-0.4' }, { 'value': '-0.8' }, { 'value': '-0.4' }, { 'value': '-0.5' }, { 'value': '0.3' }, { 'value': '0.1' }, { 'value': '0.1' }, { 'value': '-1.0' }, { 'value': '-1.5' }, { 'value': '-0.9' }, { 'value': '1.3' }, { 'value': '1.3' }, { 'value': '0.5' }, { 'value': '1.5' }, { 'value': '0.3' }, { 'value': '0.3' }, { 'value': '0.5' }, { 'value': '0.8' }, { 'value': '0.4' }, { 'value': '-1.2' }, { 'value': '0.6' }, { 'value': '1.2' }, { 'value': '0.7' }, { 'value': '-0.3' }, { 'value': '0.8' }, { 'value': '1.1' }, { 'value': '0.9' }, { 'value': '0.5' }, { 'value': '0.1' }, { 'value': '-0.2' }, { 'value': '0.3' }, { 'value': '1.4' }, { 'value': '-0.8' }, { 'value': '-0.1' }, { 'value': '0.7' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '0.3' }, { 'value': '1.4' }, { 'value': '0.0' }, { 'value': '-0.6' }, { 'value': '0.2' }, { 'value': '-0.1' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '1.0' }, { 'value': '-0.3' }, { 'value': '0.2' }, { 'value': '-0.7' }, { 'value': '-0.1' }, { 'value': '0.0' }, { 'value': '-1.2' }, { 'value': '-0.4' }, { 'value': '-0.9' }, { 'value': '0.4' }, { 'value': '-0.4' }, { 'value': '-0.3' }, { 'value': '1.1' }, { 'value': '0.1' }, { 'value': '-0.4' }, { 'value': '-1.3' }, { 'value': '0.3' }, { 'value': '0.9' }, { 'value': '-0.5' }, { 'value': '-0.3' }, { 'value': '-0.3' }, { 'value': '-0.5' }, { 'value': '0.7' }, { 'value': '0.4' }, { 'value': '0.5' }, { 'value': '-0.3' }, { 'value': '1.8' }, { 'value': '-0.5' }, { 'value': '0.0' }, { 'value': '-0.7' }, { 'value': '1.4' }, { 'value': '0.0' }, { 'value': '1.4' }, { 'value': '0.4' }, { 'value': '-0.1' }, { 'value': '-0.3' }, { 'value': '-0.6' }, { 'value': '-0.4' }, { 'value': '-0.9' }, { 'value': '-0.4' }, { 'value': '0.4' }, { 'value': '0.3' }, { 'value': '-0.3' }, { 'value': '-0.4' }, { 'value': '-0.5' }, { 'value': '-0.5' }, { 'value': '0.6' }, { 'value': '0.1' }, { 'value': '1.8' }, { 'value': '0.8' }, { 'value': '-0.1' }, { 'value': '1.1' }, { 'value': '-1.1' }, { 'value': '1.0' }, { 'value': '0.8' }, { 'value': '-0.3' }, { 'value': '-0.5' }],
        Xname: [],//X轴名称
        data1Arr: [],//数据1 柱子的数据
        data2Arr: [], //数据2 折线的数据
        dataName: ['实际分布', '标准化残差曲线'] //类别
      }
    },
    //监听,解决第一次加载页面时无法渲染第一个echart图,和切换图例时,点击搜索按钮无法加载数据问题
    watch: {
      objInfo() {
        this.initFailureBarVertical()
      }
    },
    mounted() {

      this.initFailureBarVertical()
    },
    methods: {
      /**
       * js生成1到100的随机数
       * @param min
       * @param max
       * @returns {*}
       */
      random(min, max) {

        return Math.floor(Math.random() * (max - min)) + min

      },
      initFailureBarVertical() {
        for (let i = 1; i <= 1000; i++) {
          this.data1Arr.push(this.random(1, 100))
          this.data2Arr.push(this.random(1, 100))
        }
        this.seriesValuedata.forEach((item, index) => {
          this.Xname.push(item.value)
        })

        const that = this
        console.log('数组大小', that.Xname.length)
        let myChart = that.$echarts.init(document.getElementById('distributeMathBar'))
        let option = {
          backgroundColor: '#fff',
          tooltip: {
            trigger: 'axis',
            textStyle: {
              fontSize: 14
            },
            axisPointer: {
              type: 'shadow'
            },
            formatter: function(params) {
              // 重定义marker值
              let marker1 = '<span style=\'display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:rgba(139,143,235,1);\'></span>'
              let marker2 = '<span style=\'display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:rgba(255,107,132,1);\'></span>'
              let res = '标准化残差:' + params[0].name + '<br/>'
              let index = that.Xname.indexOf(params[0].name) //定位到悬浮的名称在横坐标的位置
              for (var i = 1; i < params.length; i++) { //只有一个系列
                res += marker1 + '实际分布频数:' + that.data1Arr[index] + '<br/>'
                res += marker2 + '标准化残差曲线频数:' + that.data2Arr[index] + '<br/>'
              }
              return res
            }

          },
          //区域缩放
          dataZoom: [
            {
              type: 'inside',
              show: false,
              xAxisIndex: [0], //设置 dataZoom-inside 组件控制的 x轴
              start: 0, //数据窗口范围的起始百分比
              end: 5, //数据窗口范围的结束百分比。范围是:0 ~ 100。
              borderColor: '#F5A9D0',
              backgroundColor: '#F5A9D0'
            },
            {
              show: false,
              type: 'slider',
              xAxisIndex: [0], //设置 dataZoom-inside 组件控制的 x轴
              start: 0,
              end: 5
            }
          ],
          legend: {
            data: that.dataName,
            left: 'center',
            itemWidth: 20, // 设置宽度
            itemHeight: 15, // 设置高度
            top: 10,
            textStyle: {
              color: '#333',
              fontSize: 14,
              padding: [2, 0, 0, 0]
            }
          },
          grid: {
            show: false,
            top: '15%',
            bottom: '5%',
            left: '5',
            right: '15%',
            containLabel: true
          },

          xAxis: [{
            type: 'category',
            name: '标准化残差',
            nameTextStyle: {
              align: 'left',
              fontSize: 14,
              fontFamily: 'Microsoft YaHei',
              fontWeight: 400,
              color: '#989DAA'
            },
            // boundaryGap: false, //坐标轴两边留白策略
            axisLine: {
              show: false,
              lineStyle: {
                color: '#333'
              }
            },
            axisTick: {
              show: false
            },
            axisLabel: {
              textStyle: {
                fontSize: 14
              }
            },
            data: that.Xname
          }],
          yAxis: [{
            type: 'value',
            name: '频数',
            nameTextStyle: {
              align: 'right',
              fontSize: 14,
              fontFamily: 'Microsoft YaHei',
              fontWeight: 400,
              color: '#989DAA'
            },
            splitLine: { //y轴网格线
              lineStyle: {
                color: '#eee'
              }
            },
            axisLabel: { //y轴文本
              showMinLabel: false, //y轴是否设置最小刻度0
              color: '#333',
              textStyle: {
                fontSize: 14
              }
            },
            axisTick: {
              show: false
            },
            axisLine: { //y轴线
              lineStyle: {
                color: '#333'
              }
            }
          }],
          series: [
            {
              type: 'bar',
              name: that.dataName[0],
              color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [
                  {
                    offset: 0,
                    color: '#79c7f3FF' // 0% 处的颜色
                  },
                  {
                    offset: 1,
                    color: '#7E7CEB' // 100% 处的颜色
                  }
                ],
                global: false // 缺省为 false
              },
              barGap: '0%', /*多个并排柱子设置柱子之间的间距*/
              barCategoryGap: '0%', /*多个并排柱子设置柱子之间的间距*/
              // barWidth: '5%', //柱型宽度
              data: that.data1Arr
            },
            {
              name: that.dataName[1],
              type: 'line',
              symbol: 'none',
              color: {
                type: 'linear',
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [
                  {
                    offset: 0,
                    color: '#FD723CFF' // 0% 处的颜色
                  },
                  {
                    offset: 0.45,
                    color: '#FD723CFF' // 45% 处的颜色
                  },
                  {
                    offset: 0.85,
                    color: '#FF5B82FF' // 85% 处的颜色
                  },
                  {
                    offset: 1,
                    color: '#FF5B82FF' // 100% 处的颜色
                  }
                ],
                global: false // 缺省为 false
              },
              smooth: true,
              data: that.data2Arr
            }
          ]
        }

        that.myChart = myChart
        myChart.setOption(option)
      }

    }

  }
</script>
<style lang="scss" scoped>

  .bar-vertical-pic {
    padding: 0 10px;
  }

</style>

在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值