收藏
回答

在小程序中使用echarts显示图表,不能显示英文数字,怎么办?

代码如下:

// 1、引入依赖脚本
import * as echarts from '../../ec-canvas/echarts';
 
let chart = null;
 
// 2、进行初始化数据
function initChart(canvas, width, height{
  chart = echarts.init(canvas, null, {
    width: width,
    height: height
  });
  canvas.setChart(chart);
 
  var option = {
    color: ['#37a2da''#32c5e9''#67e0e3'],
    tooltip: {
      trigger: 'axis',
      axisPointer: {            // 坐标轴指示器,坐标轴触发有效
        type'shadow'        // 默认为直线,可选为:'line' | 'shadow'
      }
    },
    legend: {
      data: ['热度''正面''负面']
    },
    grid: {
      left: 20,
      right: 20,
      bottom: 15,
      top: 40,
      containLabel: true
    },
    xAxis: [
      {
        type'value',
        axisLine: {
          lineStyle: {
            color: '#999'
          }
        },
        axisLabel: {
          color: '#666'
        }
      }
    ],
    yAxis: [
      {
        type'category',
        axisTick: { show: false },
        data: ['汽车之家''今日头条''百度贴吧''一点资讯''微信''微博''知乎'],
        axisLine: {
          lineStyle: {
            color: '#999'
          }
        },
        axisLabel: {
          color: '#666'
        }
      }
    ],
    series: [
      {
        name: '热度',
        type'bar',
        label: {
          normal: {
            show: true,
            position: 'inside'
          }
        },
        data: [300270340344300320310],
        itemStyle: {
          // emphasis: {
          //   color: '#37a2da'
          // }
        }
      },
      {
        name: '正面',
        type'bar',
        stack: '总量',
        label: {
          normal: {
            show: true
          }
        },
        data: [120102141174190250220],
        itemStyle: {
          // emphasis: {
          //   color: '#32c5e9'
          // }
        }
      },
      {
        name: '负面',
        type'bar',
        stack: '总量',
        label: {
          normal: {
            show: true,
            position: 'left'
          }
        },
        data: [-20-32-21-34-90-130-110],
        itemStyle: {
          // emphasis: {
          //   color: '#67e0e3'
          // }
        }
      }
    ]
  };
 
  chart.setOption(option);
  return chart;
}
 
Page({
  onShareAppMessage: function (res{
    return {
      title: 'ECharts',
      path: '/pages/index/index',
      success: function () { },
      fail: function () { }
    }
  },
  data: {
    ec: {
      onInit: initChart // 3、将数据放入到里面
    }
  },
 
  onReady() {
    setTimeout(function () {
      // 获取 chart 实例的方式
      console.log(chart)
    }, 2000);
  }
});
 
显示效果:

热度,正面,负面后面都是XXXX,不知道怎么解决,请教,谢谢!

回答关注问题邀请回答
收藏

1 个回答

登录 后发表内容
问题标签