Skip to content
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

E 应用中 绘图属性无效 #486

Closed
cuibeihong opened this issue Jan 11, 2019 · 5 comments
Closed

E 应用中 绘图属性无效 #486

cuibeihong opened this issue Jan 11, 2019 · 5 comments
Milestone

Comments

@cuibeihong
Copy link

渐变色,阴影相关属性都无法生效

@simaQ
Copy link
Contributor

simaQ commented Jan 11, 2019

E 应用是基于钉钉小程序的,首先要确定 E 应用的 canvas 上下文是否支持渐变色、阴影等属性,如果支持,但是使用 F2 却绘制不了,那么请提供使用的 F2 版本以及可以复现和运行的代码,否则,我无法帮助你进行排查,请理解。

@cuibeihong
Copy link
Author

cuibeihong commented Jan 11, 2019

不好意思,我没描述清楚
首先,已经确认E应用canvas支持渐变、阴影等,但是设置的方式与html上不太一样
比如:
E应用阴影设置:
2019-01-11 2 38 39
E 应用颜色线性渐变设置:
2019-01-11 2 32 13

示例需要使用E应用的小程序开发工具
这是E应用引入图表方式

示例:(或者你给我一个联系方式,我直接发给你)
.axml 中

<view  style="width:400px;height:400px;">
  <dd-charts canvasId="ddchart-dom-bar" onDraw="onDraw"></dd-charts>
</view>

.js 中

const chartDataNew = [{
  name: '芳华',
  percent: 0.4,
  a: '1'
}, {
  name: '妖猫传',
  percent: 0.2,
  a: '1'
}, {
  name: '其他',
  percent: 0.4,
  a: '1'
}]

let app = getApp()

Page({
    data:{
       width:200,
       height:200,
       chart: null,
    },
    onLoad(){
        let sysInfo = app.globalData.sysInfo
        this.setData({
            width: sysInfo.screenWidth,
            height: sysInfo.screenHeight,
        })
    },
    onReady(){
    },
    onDraw ( ddChart ){
    //dd-charts组件内部会回调此方法,返回图表实例ddChart
    //提示:可以把异步获取数据及渲染图表逻辑放onDraw回调里面
    ddChart.clear()
    ddChart.source( chartDataNew1, {
      percent: {
        formatter: function formatter ( val )
        {
          return val * 100 + '%';
        }
      }
    } )
    ddChart.legend( {
      position: 'right'
    } )
    ddChart.tooltip( false )
    ddChart.coord( 'polar', {
      transposed: true,
      radius: 0.85,
      innerRadius: 0.618
    } )
    ddChart.axis( false );
    //渐变无效
    ddChart.interval().position( 'a*percent' ).color( 'name', [ 'l(0) 0:#EEBE11 1:#EEAC11', '#67A463', '#ccc' ] ).size( 'name', [20, 15, 10] ).adjust( 'stack' ).style( {
      lineWidth: 1,
      stroke: '#fff',
      lineJoin: 'round',
      lineCap: 'round',
      shadowColor: '#000', //无效
      shadowBlur: 10, //无效
    } )
    ddChart.render();
  }
})

@simaQ
Copy link
Contributor

simaQ commented Jan 11, 2019

渐变的问题,你确认下 E 应用下 F2 的版本,F2 在 3.2.1 版本开始支持的,如果版本符合,按理应该支持的。

至于阴影的问题,是因为 my-f2 没有对阴影这一块接口做适配,就是在小程序环境下目前不支持阴影

@cuibeihong
Copy link
Author

多谢多谢,我看了下,确实是F2版本低了,那么阴影方面后续有考虑适配吗

@simaQ
Copy link
Contributor

simaQ commented Jan 11, 2019

到这里:https://www.npmjs.com/package/@antv/my-f2 提个 issue 吧,我支持一下

@simaQ simaQ added this to the 3.3.5 milestone Feb 11, 2019
@simaQ simaQ closed this as completed in b558ead Feb 11, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants