New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

热力图 resize 报错 #6214

Closed
maoyr opened this Issue Jul 17, 2017 · 0 comments

Comments

Projects
None yet
1 participant
@maoyr

maoyr commented Jul 17, 2017

One-line summary [问题简述]

在 react 中封装了 ECharts,初始化时设置 { width: '100%', height: '1px' },通过 width*scale 设置正确
height 后重新渲染。

其他图表都可以正常自适应显示,但是热力图不显示,报错信息:

Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source height is 0.

HeatmapLayer.js :

 update: function(data, width, height, normalize, colorFunc, isInRange) {
        ......
            var canvas = this.canvas;
            var ctx = canvas.getContext('2d');
            var len = data.length;
            canvas.width = width;
            canvas.height = height;
       ......
            // colorize the canvas using alpha value and set with gradient
            var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);

我发现,在 div height 为 1 时,update 方法中 height 为 0.8 ,canvas.height 却为 0, 赋值的时候是只取整吗?

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]: "echarts": "^3.5.4",
  • Browser version [浏览器类型和版本]: Chrome 版本 58.0.3029.110 (64-bit)

Expected behaviour [期望结果]

请问

  1. update 方法中的 width,height 是怎么得出来的?
  2. 对于热力图的自适应有什么好的解决方法吗?

ECharts option [ECharts配置项]

option 直接使用的官方实例:热力图 - 全国主要城市空气质量

@maoyr maoyr changed the title from 热力图resize报错:Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source height is 0. to 热力图 resize 报错 Jul 17, 2017

@100pah 100pah closed this in f7f7cee Jul 18, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment