项目中如何具体使用wx-charts

[xiaolin3303]

myAppPage.js

// 路径是wxCharts文件相对于本文件的相对路径
var wxCharts = require('./utils/wxcharts.js');
Page({
    ...
    onLoad: function() {
        new wxCharts({
            ...
        });
    }
});

[xiaolin3303]

访问wx-charts-demo查看在微信开发工具中直接运行的例子

[czh628]

请问一下，我想从返回的json数据中，取出数据画出折线图，这个该怎么实现，能给点思路吗？

[xiaolin3303]

@czh628 把数据处理成wxCharts需要的类型和结构传进去即可

[czh628]

能给个例子吗，新手还是不太懂呢，谢谢

[xiaolin3303]

可以查看wx-charts-demo中line.js中如何动态的配置categories和data的

[czh628]

在line.js这个文件，怎么处理json文件呢？传到categories和data，网上的很多例子，都是在js文件获取到后直接到wxml显示？

[czh628]

这个插件能不能同时显示三幅图啊？

[xiaolin3303]

@czh628 支持同一页面上多个图表的绘制，一个图表调用一次new wxCharts即可

[czh628]

谢谢。再问下那个曲线上的触摸时显示每个点的值的动画效果可以实现吗？

[czh628]

曲线的颜色，是在wx-charts 设置好像不行啊，显示没有这个属性？

[xiaolin3303]

@czh628 请不要在这个issue里讨论其他的问题，如果有新的问题请先查看历史issue里面有没有相关的内容，如果没有请单独针对问题提对应的issue

[miaojia90]

请问下line绘制的时候,数据较多X轴刻度间隔可以自动控制么，通过什么方式处理呢？

[xiaolin3303]

@miaojia90 目前是系统自行对X轴做抽稀处理，当然如果你想某些刻度不显示，可以把不需要显示的刻度在categories中对应项设置为空字符串即可

[kingrome2017]

您好，lineCanvas 的name 我想让它在y轴显示 请问怎么设置

[xiaolin3303]

@kingrome2017 有没有一个大概的示意图，没太理解意思

[CooperWen]

大佬有没有从Json拿数据做表格的DEMO。我试了一阵试不出来。

[CooperWen]

@czh628 请问你获取Json显示在图表完成了吗。可以分享一下DEMO吗？

[MartinQAQ]

请问line和column可以做成双坐标吗？在Y轴描绘一条竖线

[lee0218]

现在圆环图的中心是白色的，请问如何给其增加透明度？

[JumpyWizard]

我和上面一些的人一样，我用wx.request的success回调方法中获取到的值，我无法放进图表中。
log显示先走了画图表的方法，后执行了wx.request，可是我明明wx.request方法是写在前面的，（全局变量）猜想因为wx.request是个异步方法。
而如果我在回调方法success中画图表，则图表不显示，这个可能是我哪里写的有问题。
以上可能是我js语法基础不足吧，所以想求一个wx.request获取json并画图表的完整例子。

[liukunxiaohuozi]

数据太多的时候怎么让柱状图溢出显示隐藏，手指左右滑动的时候图表跟随左右滑动呢？

[15711358160]

柱状图只显示X轴或Y轴，怎么做?????????????????????????????????????

[ZhuRuiHeng]

我一个页面绘制3个图表，直方图会报错，雷达图和饼状图不报错，动态数据报错，静态数据就不报错，在线等，急急急

[havebear]

请问饼图显示数据只能为百分比吗？

[449241526]

若有3个图，怎么分别控制呢，比如左右滑动的时候，怎么设置才能让3个图不相互影响，各滑动各的

[hjskevin]

我把canvas设置了垂直水平居中，为什么在canvas里绘制的图表没有跟着canvas走，要么偏移了，要么就特别小。

[weiweiyue]

@xiaolin3303 大神 请问数据量过大 用的SrcollLine 可以使x轴不做抽稀处理么

[songfenzhe]

@JumpyWizard 请问您的问题解决了吗，我也遇到这个问题了。

[ZhuRuiHeng]

解决了，你遇到什么问题了 在 2018-04-23 13:51:16，"Zihao Li" <[email protected]> 写道： @JumpyWizard 请问您的问题解决了吗，我也遇到这个问题了。 — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[songfenzhe]

@ZhuRuiHeng 您能给一个调用接口后，绘制图表的demo吗？我总是失败。QQ773596053

[mryuyangli]

曲线图怎样使用tooltip动态加载数据

[fangming666]

你好，我在使用的时候把数据缓存进了起来，但是再次取缓存绘制图标的时候会出现图表不显示，请问是什么原因呢？

[KeepGoDerek]

你好，在小程序里一个页面同时创建两个图表，高度超出手机屏幕，在真机上不能上下滑动，这个是什么原因呀？应该怎么解决呢？

[xyzdata]

good to go!

[yijiajia]

@JumpyWizard 您好，请问您的问题解决了吗，我也遇到这个问题了。。。

[huangguangda]

这个在真机上预览的时候会跟着左右滑动,这个环形会跳转第二个页面,第一个页面的这个环也会跟着变动位置,不会固定,如何解决呢? 问题:
https://bbs.csdn.net/topics/392482361

[huangguangda]

.chart{ width: 100%; text-align: center; } .canvas{ /* position: absolute; top: 10%; */ width: 100%; height: 600rpx; transform: scale(0.7) }
js文件里设置了
width: windowWidth, height: 300, dataLabel: true
开发工具里也显示好了布局，为啥到真机就是乱的？？
已解决：去掉transform scale缩放
js.
new wxCharts({
canvasId: 'ringCanvas',
type: 'ring',
legend: false,
extra: {
ringWidth: 15, //圆环的宽度
pie: {
offsetAngle: -45 //圆环的角度
}
},
series: [{
data: res.data.data.normalNum,
}, {
data: res.data.data.beLateNum,
}, {
data: res.data.data.leaveNum,
}, {
data: res.data.data.uncheckedNum,
}],
width: 320,
height: 200,
dataLabel: false
});
wxml.

wxss. .canvas { z-index: 1; position: absolute; left: 64rpx; top: 120rpx; height: 350rpx; } 还是会乱,如何解决?

[rankleZ]

第二次传入空数据怎么清掉第一次传入的数据显示的饼状图？

[chenyanqing]

早点支持bar类型的图啊

[FireChow]

请问可以将 label 直接显示在饼图上吗？比如饼图有五六个label，都得在下面找什么颜色，然后再回到图上看对应的值，比较影响用户体验

[bestvayne]

请问，在支付宝小程序中如何使用呢？和在微信小程序中一样吗？

[jiangji1]

图标在可以拖动的情况下，外层不要是scroll-view，不然bindtouchstart="touchHandler" bindtouchmove="moveHandler" bindtouchend="touchEndHandler"中.getCurrentDataIndex(e)都获取不到index