@gravity-ui/chartkit 5.5.0 → 5.6.0

package/build/i18n/keysets/en.json

@@ -36,7 +36,8 @@
     "label_invalid-series-type": "It seems you haven't defined \"series.type\" property, or defined it incorrectly. Available values: [{{types}}].",
     "label_invalid-series-property": "It seems you are trying to use inappropriate value for \"{{key}}\", or defined it incorrectly. Available values: [{{values}}].",
     "label_invalid-treemap-redundant-value": "It seems you are trying to set \"value\" for container node. Check node with this properties: { id: \"{{id}}\", name: \"{{name}}\" }",
-    "label_invalid-treemap-missing-value": "It seems you are trying to use node without \"value\". Check node with this properties: { id: \"{{id}}\", name: \"{{name}}\" }"
+    "label_invalid-treemap-missing-value": "It seems you are trying to use node without \"value\". Check node with this properties: { id: \"{{id}}\", name: \"{{name}}\" }",
+    "label_invalid-y-axis-index": "It seems you are trying to use inappropriate index for Y axis: \"{{index}}\""
   },
   "highcharts": {
     "reset-zoom-title": "Reset zoom",

package/build/i18n/keysets/ru.json

@@ -7,13 +7,10 @@
     "error": "Ошибка",
     "legend-series-hide": "Скрыть все линии",
     "legend-series-show": "Показать все линии",
-
     "loading": "Загрузка",
-
     "tooltip-point-format-size": "Размер",
     "tooltip-sum": "Сумма",
     "tooltip-rest": "Остальные",
-
     "error-incorrect-key-value-intro": "Некорректный формат объекта переданного как значение в",
     "error-incorrect-key": ", ключи объекта должны быть преобразуемы в целое число",
     "error-incorrect-value": ", значением объекта может быть либо строка, либо функция возвращающая строку"
@@ -38,7 +35,8 @@
     "label_invalid-series-type": "Похоже, что вы не указали значение \"series.type\" или указали его неверно. Доступные значения: [{{types}}].",
     "label_invalid-series-property": "Похоже, что вы пытаетесь использовать недопустимое значение для \"{{key}}\", или указали его неверно. Доступные значения: [{{values}}].",
     "label_invalid-treemap-redundant-value": "Похоже, что вы пытаетесь установить значение \"value\" для узла, используемого в качестве контейнера. Проверьте узел с этими свойствами: { id: \"{{id}}\", name: \"{{name}}\" }",
-    "label_invalid-treemap-missing-value": "Похоже, что вы пытаетесь использовать узел без значения \"value\". Проверьте узел с этими свойствами: { id: \"{{id}}\", name: \"{{name}}\" }"
+    "label_invalid-treemap-missing-value": "Похоже, что вы пытаетесь использовать узел без значения \"value\". Проверьте узел с этими свойствами: { id: \"{{id}}\", name: \"{{name}}\" }",
+    "label_invalid-y-axis-index": "Похоже, что вы пытаетесь использовать некорректный индекс для оси Y: \"{{index}}\""
   },
   "highcharts": {
     "reset-zoom-title": "Сбросить увеличение",

package/build/plugins/d3/examples/area/TwoYAxis.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TwoYAxis: () => React.JSX.Element;

package/build/plugins/d3/examples/area/TwoYAxis.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { dateTime } from '@gravity-ui/date-utils';
+import { ChartKit } from '../../../../components/ChartKit';
+import { ExampleWrapper } from '../ExampleWrapper';
+import marsWeatherData from '../mars-weather';
+export const TwoYAxis = () => {
+    const data = marsWeatherData;
+    const pressureData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.pressure,
+    }));
+    const tempData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.max_temp - d.min_temp,
+    }));
+    const widgetData = {
+        series: {
+            data: [
+                {
+                    type: 'area',
+                    data: pressureData,
+                    name: 'Pressure',
+                    yAxis: 0,
+                },
+                {
+                    type: 'area',
+                    data: tempData,
+                    name: 'Temperature range',
+                    yAxis: 1,
+                },
+            ],
+        },
+        yAxis: [
+            {
+                title: {
+                    text: 'Pressure',
+                },
+            },
+            {
+                title: {
+                    text: 'Temperature range',
+                },
+            },
+        ],
+        xAxis: {
+            type: 'datetime',
+            title: {
+                text: 'Terrestrial date',
+            },
+            ticks: { pixelInterval: 200 },
+        },
+        title: {
+            text: 'Mars weather',
+        },
+    };
+    return (React.createElement(ExampleWrapper, null,
+        React.createElement(ChartKit, { type: "d3", data: widgetData })));
+};

package/build/plugins/d3/examples/bar-x/TwoYAxis.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TwoYAxis: () => React.JSX.Element;

package/build/plugins/d3/examples/bar-x/TwoYAxis.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { dateTime } from '@gravity-ui/date-utils';
+import { ChartKit } from '../../../../components/ChartKit';
+import { ExampleWrapper } from '../ExampleWrapper';
+import marsWeatherData from '../mars-weather';
+export const TwoYAxis = () => {
+    const data = marsWeatherData;
+    const pressureData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.pressure,
+    }));
+    const tempData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.max_temp - d.min_temp,
+    }));
+    const widgetData = {
+        series: {
+            data: [
+                {
+                    type: 'bar-x',
+                    data: pressureData,
+                    name: 'Pressure',
+                    yAxis: 0,
+                },
+                {
+                    type: 'bar-x',
+                    data: tempData,
+                    name: 'Temperature range',
+                    yAxis: 1,
+                },
+            ],
+        },
+        yAxis: [
+            {
+                title: {
+                    text: 'Pressure',
+                },
+            },
+            {
+                title: {
+                    text: 'Temperature range',
+                },
+            },
+        ],
+        xAxis: {
+            type: 'datetime',
+            title: {
+                text: 'Terrestrial date',
+            },
+            ticks: { pixelInterval: 200 },
+        },
+        title: {
+            text: 'Mars weather',
+        },
+    };
+    return (React.createElement(ExampleWrapper, null,
+        React.createElement(ChartKit, { type: "d3", data: widgetData })));
+};

package/build/plugins/d3/examples/line/TwoYAxis.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TwoYAxis: () => React.JSX.Element;

package/build/plugins/d3/examples/line/TwoYAxis.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { dateTime } from '@gravity-ui/date-utils';
+import { ChartKit } from '../../../../components/ChartKit';
+import { ExampleWrapper } from '../ExampleWrapper';
+import marsWeatherData from '../mars-weather';
+export const TwoYAxis = () => {
+    const data = marsWeatherData;
+    const minTempData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.min_temp,
+    }));
+    const maxTempData = data.map((d) => ({
+        x: dateTime({ input: d.terrestrial_date, format: 'YYYY-MM-DD' }).valueOf(),
+        y: d.max_temp,
+    }));
+    const widgetData = {
+        series: {
+            data: [
+                {
+                    type: 'line',
+                    data: minTempData,
+                    name: 'Min Temperature',
+                    yAxis: 0,
+                },
+                {
+                    type: 'line',
+                    data: maxTempData,
+                    name: 'Max Temperature',
+                    yAxis: 1,
+                },
+            ],
+        },
+        yAxis: [
+            {
+                title: {
+                    text: 'Min',
+                },
+            },
+            {
+                title: {
+                    text: 'Max',
+                },
+            },
+        ],
+        xAxis: {
+            type: 'datetime',
+            title: {
+                text: 'Terrestrial date',
+            },
+            ticks: { pixelInterval: 200 },
+        },
+        title: {
+            text: 'Mars weather',
+        },
+    };
+    return (React.createElement(ExampleWrapper, null,
+        React.createElement(ChartKit, { type: "d3", data: widgetData })));
+};

package/build/plugins/d3/examples/mars-weather.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    id: string;
+    terrestrial_date: string;
+    sol: number;
+    ls: number;
+    season: string;
+    min_temp: number;
+    max_temp: number;
+    pressure: number;
+    wind_speed: null;
+    atmo_opacity: string;
+}[];
+export default _default;