简体   繁体   English

使用C3JS仅显示Y轴上的MIN / MAX值

[英]Show only the MIN/MAX value on Y-AXIS with C3JS

I would like to have the y-axis only with the min/max values of my data. 我只想让y轴显示我的数据的最小值/最大值。 I tried to use the d3 directive but without results. 我尝试使用d3指令,但没有结果。

I had a look at google but I didn't find an answer to achieve this behaviour. 我看过Google,但没有找到实现此行为的答案。

Below the code: 代码下方:

 $.getJSON('assets/json/chartc3.json', function(data) 
{ 

    scene=data;
    var chart = c3.generate({
    bindto: '#chartc3',
    data: 
        {

            json: scene,
            keys: 
            {
                    x: 'round',
                    value: ['Marketable', 'Total Requested Capacity', 'Your Bid'],
            },
            types: {
                Marketable: 'area'
            },
            colors: {
                Marketable: '#A09FA2',
                'Total Requested Capacity': '#272E80',
                'Your Bid': '#8EBF60'
            }
        },
    axis: 
    {
        x: {
            tick: 
            {
                culling: 
                {
                    max: 10
                }
            },
          type: 'category'
        },
        y: 
        {

            min: 0,
             padding : {
              bottom : 0
            },
            tick: 
            {
                values: [[0], [***d3.max(scene)]***],

                format:  function (d) { return d3.format(',f')(d) +' kWh/h' }
      //or format: function (d) { return '$' + d; }
            }
        }
      }.........

How could I achieve the result described above ? 如何获得上述结果? d3.max(scene) returns NaN. d3.max(scene)返回NaN。

Well the problem is scene is not an array its a json object. 好了,问题是场景不是其json对象的数组。

var k = d3.max([1,5,2])
k will be 5

so you will need to pass an array of elements which constitute your y ordinals. 因此您将需要传递构成y序数的元素数组。

you need to use 你需要使用

d3.max(arr, function(d){return numberic value});

or 要么

var arr = scene.map(function(d){return ...the number value..})
y:{
    min:d3.min(arr),
    max:d3.max(arr)
},

the function depends on the array element of your data. 函数取决于数据的数组元素。

I used a little function to calculate the max by myself. 我使用了一个小函数自己计算最大值。

var maxs=0;
    for (var j=0; j<scene.length; j++) {
        var maxtemp=Math.max(scene[j].Marketable, scene[j]['Your Bid'], scene[j]['Total Requested Capacity']);
        maxs=Math.max(maxs, maxtemp);
    }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM