在baidu中看到你的关于Highcharts 中后台添加series的答案,有点不明白,想请教下。可以加好友么?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在baidu中看到你的关于Highcharts 中后台添加series的答案,有点不明白,想请教下。可以加好友么?相关的知识,希望对你有一定的参考价值。

既然你会通过后台数据转换成json,然后在前台用<%=%>来绑定后台的值的方式获得。那么多组的其实也是一样的,就是绑定的还是json值,只不过json的值是 [
name: 'John',
data: [5, 3, 4, 7, 2]
,
name: 'Jane',
data: [2, 2, 3, 2, 1]
] 这种格式。就行了。这个在后台组好。
参考技术A 数据(只是举个例子,重点是数据格式)
var datetimeCom = '[';
var growth='[';
$.each(rows, function (v1, v2)
datetimeCom += "\'" + v2.MonitorTime + "\',";
growth += v2.Add + ",";
);
if (datetimeCom != '[')
datetimeCom = datetimeCom.substr(0, datetimeCom.length - 1)+"]";
growth = growth.substr(0, growth.length - 1)+"]";


绑定赋值:(chart为var chart= new Highcharts.Chart......)
chart.xAxis[0].setCategories(eval(datetimeCom));
chart.series[0].setData(eval(growth));
参考技术B 你用过ajax么 你可以用一下这个试试 写一个后台程序从数据库中读取数据 再用ajax请求到前台显示追问

我有用过通过后台数据转换成json,然后在前台用来绑定后台的值的方式获得。但是我只会单组的数据,如果像这种series: [
name: 'John',
data: [5, 3, 4, 7, 2]
,
name: 'Jane',
data: [2, 2, 3, 2, 1]
]
多组的就不会了,求教。。

参考技术C [name:value,name:value,...]

如何在highcharts中调整自定义按钮的宽度和高度

我尝试在highcharts中调整自定义按钮的宽度和高度,但是我找不到任何关于此的演示或教程。

http://jsfiddle.net/Murali_Kaliappan/2F4pJ/1029/是我的小提琴

   $(function () {
      var chart = new Highcharts.Chart({

      chart: {
          renderTo: 'container'
      },       

      xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
      },

      series: [{
         data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
      }],

      exporting: {
          buttons: {
              customButton: {
                  x: -62,
                  onclick: function () {
                      alert('Clicked');
                  },
                  symbol: 'url(https://png.icons8.com/metro/1600/expand.png)',
                  height:18,
                  width:18
              }
           }
       }
   });
});
答案

customButton.symbol应该与SVG对象一起使用 - 这就是heightwidth等配置选项不起作用的原因。

您可以使用Highcharts defs为按钮定义图像背景:

JS:

defs: {
  custombtnbg: {
    tagName: 'pattern',
    id: 'custom-btn-bg',
    x: 0,
    y: 0,
    width: 24,
    height: 24,
    children: [{
      tagName: 'image',
      width: 24,
      height: 24,
      href: 'https://png.icons8.com/metro/1600/expand.png'
    }]
  }
},

(...)

exporting: {
  buttons: {
    customButton: {
      x: -62,
      id: 'btn',
      onclick: function() {
        alert('Clicked');
      },
      text: '',
      className: 'custom-btn',
      theme: {
        'stroke-width': 0
      }
    }
  }
}

CSS:

@import 'https://code.highcharts.com/css/highcharts.css';

.custom-btn  {
   fill: url(#custom-btn-bg);
}

现场演示:http://jsfiddle.net/BlackLabel/u4Lx71by/


关于defs的文章:https://www.highcharts.com/docs/chart-design-and-style/gradients-shadows-and-patterns

以上是关于在baidu中看到你的关于Highcharts 中后台添加series的答案,有点不明白,想请教下。可以加好友么?的主要内容,如果未能解决你的问题,请参考以下文章

HighCharts 饼图背景色透明

热图值在Highcharts中萎缩

关于Highcharts数据量超过1000时无法显示问题

如何从 Highcharts 中删除按钮

如何设置 highcharts X轴和Y轴值

如何在php中使用highcharts插件实现柱状图效果 求源码