ZingChart Logo
Main Menu

JSON Configuration

{
  "globals": {},
  "gui": {
    "behaviors": [{}],
    "context-menu": {
      "button": {},
      "custom-items": [{}],
      "gear": {},
      "item": {}
    }
  },
  "graphset": [{
    "3d-aspect": {},
    "arrows": [{
      "from": {},
      "to": {}
    }],
    "crosshair-x": {
      "marker": {},
      "plot-label": {},
      "scale-label": {}
    },
    "crosshair-y": {
      "scale-label": {}
    },
    "csv": {},
    "images": [{}],
    "labels": [{
      "callout-tip": {}
    }],
    "legend": {
      "footer": {},
      "header": {},
      "icon": {},
      "item": {},
      "item-off": {},
      "marker": {},
      "page-off": {},
      "page-on": {},
      "page-status": {},
      "scroll": {
        "bar": {},
        "handle": {}
      },
      "tooltip": {}
    },
    "media-rules": [{}],
    "no-data": {},
    "options": {
      "context-menu": {
        "button": {},
        "items": {}
      },
      "indicator": {
        "npv": {},
        "title": {},
        "value": {}
      },
      "style": {
        "hover-state": {},
        "tooltip": {}
      },
      "words": []
    },
    "plot": {
      "animation": {},
      "background-marker": {},
      "background-state": {},
      "error": {
        "hover-state": {}
      },
      "errors": [],
      "goal": {},
      "guide-label": {},
      "highlight-marker": {},
      "highlight-state": {},
      "hover-marker": {},
      "hover-state": {},
      "legend-item": {},
      "legend-marker": {},
      "marker": {},
      "preview": {},
      "rules": [{}],
      "selected-marker": {},
      "selected-state": {},
      "tooltip": {},
      "trend-down": {},
      "trend-equal": {},
      "trend-up": {},
      "value-box": {
        "connector": {},
        "joined": {},
        "shared": {}
      }
    },
    "plotarea": {},
    "preview": {
      "active": {},
      "handle": {},
      "handle-bottom": {},
      "handle-left": {},
      "handle-right": {},
      "handle-top": {},
      "mask": {}
    },
    "scale": {},
    "scale-k": {
      "guide": {
        "items": [{}]
      },
      "item": {},
      "tick": {},
      "tooltip": {}
    },
    "scale-r": {
      "center": {},
      "guide": {},
      "item": {},
      "markers": [{
        "label": {}
      }],
      "minor-guide": {},
      "minor-tick": {},
      "ring": {
        "items": [{}]
      },
      "tick": {}
    },
    "scale-v": {
      "guide": {
        "items": [{}]
      },
      "item": {},
      "ref-line": {},
      "tick": {},
      "tooltip": {}
    },
    "scale-x": {
      "guide": {
        "items": [{}]
      },
      "item": {},
      "label": {},
      "markers": [{
        "label": {}
      }],
      "minor-guide": {},
      "minor-tick": {},
      "ref-line": {},
      "rules": [{}],
      "tick": {},
      "tooltip": {},
      "transform": {
        "guide": {},
        "item": {}
      }
    },
    "scale-y": {
      "guide": {
        "items": [{}]
      },
      "item": {},
      "label": {},
      "markers": [{
        "label": {}
      }],
      "minor-guide": {},
      "minor-tick": {},
      "ref-line": {},
      "rules": [{}],
      "tick": {},
      "tooltip": {},
      "transform": {}
    },
    "scroll-x": {
      "bar": {},
      "handle": {}
    },
    "scroll-y": {
      "bar": {},
      "handle": {}
    },
    "series": [{
      "animation": {},
      "background-marker": {},
      "background-state": {},
      "error": {},
      "errors": [],
      "goal": {},
      "guide-label": {},
      "highlight-marker": {},
      "highlight-state": {},
      "hover-marker": {},
      "hover-state": {},
      "legend-item": {},
      "legend-marker": {},
      "marker": {},
      "preview": {},
      "rules": {},
      "selected-marker": {},
      "selected-state": {},
      "tooltip": {},
      "trend-down": {},
      "trend-equal": {},
      "trend-up": {},
      "value-box": {},
      "values": []
    }],
    "shapes": [{
      "label": {}
    }],
    "source": {},
    "subtitle": {},
    "title": {},
    "tooltip": {},
    "widgets": [],
    "zoom": {
      "label": {}
    }
  }],
  "history": {
    "item": {},
    "item-off": {}
  },
  "refresh": {
    "curtain": {}
  }
}

 Back to Docs  Back to JSON Attributes Tree

transform

[ root » graph » scaleX » transform ]

Time-Series Charts Only: Use the transform object to convert Unix timestamps into a more readable format. ZingChart accepts Unix time values in milliseconds, and timestamps can be calculated with online conversion tools such as Epoch Converter.

Attribute Type Info
all String

To format your date values. Use this attribute with the type value (set to true).

Token Description
%A Displays the ante or post meridiem time in upper case letters: AM or PM.
%a Displays the ante or post meridiem time in lower case letters: am or pm.
%D Displays the day of the week in abbreviated form: Sun, Mon, Tue, Wed, Thu, Fri and Sat.
%d Displays the day's date without a leading 0 if the date is single digit.
%dd Displays the day's date with a leading 0 if the date is single digit.
%G Displays the hour in 24-hour format without a leading 0.
%g Displays the hour in 12-hour format without a leading 0.
%H Displays the hour in 24-hour format with a leading 0 if the hour is single digit.
%h Displays the hour in 12-hour format with a leading 0 if the hour is single digit.
%i Displays the minutes.
%M Displays the month in abbreviated form: Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov and Dec.
%m Displays the month numerically without a leading 0 if the date is single digit.
%mm Display the month numerically with a leading 0 if the month is single digit.
%q Displays the milliseconds.
%s Displays the seconds.
%Y Displays the year in 4-digit format.
%y Displays the year in 2-digit format.

'%M' | '%M %d' | '%M %d %H:%i' | ...

guide Attribute

Use the guide object to add time-series guides to your chart.

{...}

item Attribute

Use the item object to add time-series items to your chart.

{...}

text String

The text of the scale label, can use tokens for day, hour, minute, year etc to add in such information, ONLY if "type"="date" has been specified in this transform object. If values for both "text" and "all" have been specified, the value in "text" will be used.

'Month of %M' | '%d' | ...

type String

To convert Unix timestamps into dates. Use this attribute with the all attribute.

'date'

uniform Boolean

To set the time-series scale to linear (uniform) or non-linear.

true | false | 1 | 0

Chart View Code View
Edit This Chart Share This Chart Start a FREE Trial
JS JSON