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

Sets the chart refresh/feed system.
Attribute Type Info
adjust-scale
adjustScale
Boolean

Sets how initial data from a feed is displayed as it is loaded. The default false value will maintain a fixed width for each node as it loads and will start painting the nodes from the right. The width of a node in a bar chart is the width of an individual bar, while the width of a node on a line chart determines the distance between two points with respect to the x-axis. The true option will fill the entire width of the chart as new data is loaded. That is, if up to a point a single bar has been loaded on a bar chart, that bar will fit the entire width of the graph. Once two bars have been loaded, each will fill up half of the width of the graph, etc.

true | false | 1 | 0

adjust-scale
adjustScale
Boolean

 

true | false | 1 | 0

curtain Object

An object that covers the portion of the graph that has not been plotted yet. Commonly used with real time feeds to show a loading screen that opens like a "curtain" to reveal the fully populated graph. When this attribute is used, it will create a box to the left of the data being loaded from the right displaying information desired to be displayed to the user.

{...}

interval Numeric

Sets the timeout between two refresh operations. If value is smaller than 50, seconds are assumed, otherwise milliseconds are assumed.

5 | 10 | ...

max-ticks
maxTicks
Numeric

When dynamically feeding data, the number of data elements that are fit across the x-axis is increasing. This number input here defines the maximum number of such data points that are allowed to fit before elements are just subtracted off of the left side as they are added to the right.

5 | 10 | ...

method String

 

"push" | "pull"

reset-timeout
resetTimeout
Numeric

Determines how long before the graph reloads all data from the data feed, removing previous data from the feed. For values smaller than 50 seconds are assumed, otherwise milliseconds are assumed.

5 | 10 | ...

stop-timeout
stopTimeout
Numeric

The amount of time that data is accepted from a feed or the graph updates from source before it stops. For values less than 50 seconds are assumed, otherwise milliseconds are assumed.

5 | 10 | ...

storage Boolean

 

true | false | 1 | 0

storage-size
storageSize
Numeric

 

5 | 10 | ...

transport String

 

"http" | "websocket"

type String

Sets the type of data refresh. full reloads the entire chart from the chart's original data source. feed accepts series data differences from the url provided as a data source, under the url attribute.

"full" | "feed"

url String

Sets the url for the data feed, if feed is specified under the "type" attribute.

"mydatafeed.php" | "http://www.domain.com/mydatafeed.php" | ...

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