2015-08-11 6 views
4

Я хочу полностью удалить, а не скрывать оси x и y в моих Zingcharts. У меня есть график, который не нуждается в оси x или y, и хотя я могу скрыть их, они занимают ценное пространство, что приводит к сжатому графику. Есть какой-либо способ сделать это?Удалить ось x и ось y из Zingchart

ответ

7

Похоже, что вы можете устанавливать шкалы на видимые: false, но по всему графику, где эти элементы раньше были, по-прежнему много места.

Вы можете устранить это пространство, устанавливая элементы видимым: ложь, установка связана линия цвета атрибуты «нет» и добавив:

"plotarea":{ "margin":"0 0" }

к вашему JSON. Ниже приведен пример удаления этого интервала с использованием метода, описанного выше. Нажмите кнопку «Считать фрагмент кода», чтобы увидеть итоговую диаграмму.

var myConfig = { 
 
    "type": "line", 
 
    "scale-x":{ 
 
    "line-color":"none", 
 
    "item":{ 
 
     "visible":false 
 
    }, 
 
    "tick":{ 
 
     "line-color":"none" 
 
    } 
 
    }, 
 
    "scale-y":{ 
 
    "line-color":"none", 
 
    "item":{ 
 
     "visible":false 
 
    }, 
 
    "tick":{ 
 
     "line-color":"none" 
 
    } 
 
    }, 
 
    "plotarea":{ 
 
    "margin":"0 0" 
 
    }, 
 
    "series": [ 
 
    { 
 
     "values":[20,40,25,50,15,45,33,34] 
 
    }, 
 
    { 
 
     "values":[5,30,21,18,59,50,28,33] 
 
    }, 
 
    { 
 
     "values":[30,5,18,21,33,41,29,15] 
 
    }, 
 
    ] 
 
}; 
 

 
zingchart.render({ 
 
\t id : 'myChart', 
 
\t data : myConfig, 
 
\t height: 400, 
 
\t width: 600 
 
});
<html> 
 
\t <head> 
 
\t <!--Assets will be injected here on compile. Use the assets button above--> 
 
\t \t <script src= 'https://cdn.zingchart.com/2.1.2/zingchart.min.js'></script> 
 
\t \t <script> zingchart.MODULESDIR = 'https://cdn.zingchart.com/2.1.2/modules/';</script> 
 
\t 
 
\t <!--Inject End--> 
 
\t </head> 
 
\t <body> 
 
\t \t <div id='myChart'></div> 
 
\t </body> 
 
</html>

Если вы устанавливаете весы на видимый: ложные, что может создать некоторые проблемы. Вместо этого, корректируя стиль, чтобы они просто не видели, можно предотвратить конфликты с другими функциями. Я нахожусь в команде ZingChart, поэтому, пожалуйста, дайте мне знать, если это ответит на ваш вопрос или если вы хотите получить дополнительные разъяснения.

+0

Уверенная вещь: добавьте объект-направляющую к scale-x и scale-y, а затем внутри объекта установите ширину линии на 0. Вот демонстрация - http://demos.zingchart.com/view/ F7B6LX6Y Как хэдз-ап, вы можете получить все элементы, связанные с масштабами в синтаксисе атрибутов JSON в документах ZingChart - http://www.zingchart.com/docs/json-attributes-syntax/ – Merrily

Смежные вопросы