highcharts多条数据线设置不同的数据单位

用highcharts显示数据时，会有不同数据的单位不一样的问题。如下设置数据单位时会把所有数据的单位（标签）设置成一样的：

$('#charts').highcharts({chart: {type: 'column'},title: {text: "传感器数据"},tooltip: {valueSuffix: '°C'},plotOptions:{column:{dataLabels:{enabled:true, //是否显示数据标签formatter: function() {return this.y + '°C';}}}},subtitle: {text: null,},xAxis: {categories: [1,2,3,4]},yAxis: {title: {text: '值'}},series: [{name: '温度',data: [23,21,24,20]},{name: '湿度',data: [32,40,45,33]}]});</span>

显示效果:

此时应将tooltip,formatter（其中tooltip用于鼠标悬浮显示的标签，formatter用于显示出来的数据的标签）设置到每个数据项中:

$('#charts').highcharts({chart: {type: 'column'},title: {text: "传感器数据"},plotOptions:{column:{dataLabels:{enabled:true //是否显示数据标签}}},subtitle: {text: null,},xAxis: {//categories: sensorUnitcategories: [1,2,3,4]},yAxis: {title: {text: '值'}},series: [{name: '温度',data: [23,21,24,20],tooltip: {valueSuffix: '°C'},dataLabels:{enabled:true, //是否显示数据标签formatter: function() {return this.y + '°C';}}},{name: '湿度',data: [32,40,45,33],tooltip: {valueSuffix: '%'},dataLabels:{enabled:true, //是否显示数据标签formatter: function() {return this.y + '%';}}}]});</span>

highcharts多条数据线设置不同的数据单位相关推荐

图表插件Highcharts的动态化赋值，实现图表数据的动态化设置显示
在很早之前就介绍过图表插件Highcharts的使用了,在2014年的随笔<基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts>,这里基本上都介绍 ...
解决ECharts两条条折线图数据一样时，拐点处数据重合（设置ECharts两条折线图拐点处数据一上一下）
解决办法:在series里选择一条数据,给其label的position赋值为"top"或"bottom",与另一个进行区分. 示例代码如下: option = ...
android 多数据图表,Android统计图表MPAndroidChart：为多条统计折线动态更新数据，以高温低温曲线为例【7】...
Android统计图表MPAndroidChart:为多条统计折线动态更新数据,以高温低温曲线为例[7] 本文在附录文章6的基础上,为Android统计图表MPAndroidChart的同一个L ...
KikaGO：一条数据线的AI之旅
李根发自 Vegas 量子位报道 | 公众号 QbitAI 万万没想到,一条数据线火了. 在2018 CES现场,这根线成为关注的热点之一,它被华尔街日报评价"Best of CES ...
Saiku设置展示table数据不隐藏空的行数据信息（二十六）
Saiku设置展示table数据不隐藏空的行数据信息 saiku有个非空的字段按钮,点击这个后,会自动的把空的行数据信息给隐藏掉,这里我们来设置一下让其行数据不隐藏,为空的就为空. 主要更改两个文 ...
python中使用squarify包可视化treemap图：treemap将分层数据显示为一组嵌套矩形，每一组都用一个矩形表示，该矩形的面积与其值成正比、自定义设置每一个数据格的颜色
python中使用squarify包可视化treemap图:treemap将分层数据显示为一组嵌套矩形,每一组都用一个矩形表示,该矩形的面积与其值成正比.自定义设置每一个数据格的颜色目录
pandas使用pd.concat纵向合并多个dataframe实战：纵向合并(ignore_index参数)、为纵向合并的多个dataframe设置标识符指定数据来源(通过字典方式设置数据来源键)
pandas使用pd.concat纵向合并多个dataframe实战:多个dataframe的纵向合并(ignore_index参数).为纵向合并的多个dataframe设置标识符指定数据来源(通过字 ...
pandas使用pd.concat纵向合并多个dataframe实战：多个dataframe的纵向合并、为纵向合并的多个dataframe设置标识符指定数据来源
pandas使用pd.concat纵向合并多个dataframe实战:多个dataframe的纵向合并.为纵向合并的多个dataframe设置标识符指定数据来源目录
web元件库、axure元件库、通用元件库、常用web组件、常用表单、框架、数据表单、导航栏、边框、图标、列表、日期时间选择器、评分组件、穿梭框、输入框、步骤条、图表组件、数据可视化、后台模板、时间轴
web元件库.axure元件库.通用元件库.常用web组件.常用表单.框架.数据表单.导航栏.边框.图标.列表.日期时间选择器.评分组件.穿梭框.输入框.步骤条.图表组件.数据可视化.后台模板.时间轴 ...

highcharts多条数据线设置不同的数据单位

highcharts多条数据线设置不同的数据单位相关推荐

最新文章

热门文章