How to use the vega.loader function in vega

To help you get started, we’ve selected a few vega examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github vega / vega-desktop / viewer / components / VegaRenderer.jsx View on Github external
vegaSpec = spec;
      }

      // Clear existing view
      if (this.view) {
        this.view.finalize();
      }

      this.container.innerHTML = '';

      try {
        const runtime = vg.parse(vegaSpec);

        // Tell loader to resolve data and image files
        // relative to the spec file
        const loader = vg.loader({
          baseURL: path.dirname(filePath),
          mode: 'file'
        });

        window.VEGA_DEBUG.view = null;

        this.view = new vg.View(runtime, {loader})
          .initialize(this.container)
          .renderer(renderer)
          .hover()
          .run();

        window.VEGA_DEBUG.view = this.view;
      } catch (error) {
        this.showError(`Invalid vega spec: ${error.message}`);
      }
github vega / vega-lite / site / static / index.ts View on Github external
window['runStreamingExample'] = runStreamingExample;
window['embedExample'] = embedExample;

hljs.registerLanguage('javascript', javascript);
hljs.registerLanguage('json', json);
hljs.registerLanguage('html', xml);
hljs.registerLanguage('css', css);
hljs.registerLanguage('diff', diff);

// highlight jekyll code blocks
hljs.initHighlightingOnLoad();

declare const BASEURL: string;

const loader = vega.loader({
  baseURL: BASEURL
});

const editorURL = 'https://vega.github.io/editor/';

/* Anchors */
selectAll('h2, h3, h4, h5, h6').each(function(this: d3.BaseType) {
  const sel = select(this);
  const name = sel.attr('id');
  const title = sel.text();
  sel.html(`<a class="anchor" href="#${name}"><span class="octicon octicon-link"></span></a>${title.trim()}`);
});

/* Documentation */
function renderExample($target: Selection, specText: string) {
  $target.classed('example', true);
github vega / vega / packages / vega-cli / src / render.js View on Github external
function render(spec) {
    const view = new vega.View(vega.parse(spec, config), {
        loader: vega.loader({baseURL: base}),   // load files from base path
        logger: vega.logger(loglevel, 'error'), // route all logging to stderr
        renderer: 'none'                        // no primary renderer needed
      }).finalize();                            // clear any timers, etc

    return (type === 'svg'
        ? view.toSVG(scale)
        : view.toCanvas(scale, opt)
      ).then(_ => callback(_, arg));
  }
github vega / vega-lite / test-gallery / main.ts View on Github external
function loadJSON(url: string, callback: (data: object) => void) {
  vega.loader().load(url).then(function(data: string) {
    callback(JSON.parse(data));
  });
}
github vega / voyager / src / components / data-selector / index.tsx View on Github external
private onDataUrlSubmit() {
    const loader = vega.loader();
    loader.load(this.state.dataUrl).then(data => {
      this.loadDataString(data);
    }).catch(error => {
      console.warn('Error occurred while loading data: ', error);
    });
  }
github datadotworld / chart-builder / src / components / VegaLiteEmbed.js View on Github external
async constructView() {
    const { spec, data, onViewRender } = this.props
    const loader = vega.loader()
    const logLevel = vega.Warn
    const renderer = 'svg'

    try {
      const vgSpec = vl.compile(spec).spec

      const runtime = vega.parse(vgSpec)

      const view = new vega.View(runtime, {
        loader,
        logLevel,
        renderer
      })
        .initialize(this.nodeRef.current)
        .change('source', vega.changeset().insert(data))
github datadotworld / chart-builder / src / components / VegaLiteImage.js View on Github external
async constructView() {
    let { spec, data } = this.props
    const loader = vega.loader()
    const logLevel = vega.Warn
    const renderer = 'svg'

    spec = vl.compile(spec).spec

    const runtime = vega.parse(spec)
    const view = new vega.View(runtime, {
      loader,
      logLevel,
      renderer
    }).initialize()

    view.change('source', vega.changeset().insert(data))

    const svgString: string = await view.toSVG()
github nyurik / kibana-vega-vis / public / vega_view / vega_loader.js View on Github external
min: bounds.min.valueOf(),
      max: bounds.max.valueOf()
    };
    return _timeBounds;
  }

  /**
   * ... the loader instance to use for data file loading. A
   * loader object must provide a "load" method for loading files and a
   * "sanitize" method for checking URL/filename validity. Both methods
   * should accept a URI and options hash as arguments, and return a Promise
   * that resolves to the loaded file contents (load) or a hash containing
   * sanitized URI data with the sanitized url assigned to the "href" property
   * (sanitize).
   */
  const loader = vega.loader();
  const defaultLoad = loader.load.bind(loader);
  loader.load = (uri, opts) => {
    if (typeof uri === 'object') {
      switch (opts.context) {
        case 'dataflow':
          return queryEsData(uri);
      }
      throw new Error('Unexpected url object');
    } else if (!enableExternalUrls) {
      throw new Error('External URLs have been disabled in kibana.yml');
    }
    return defaultLoad(uri, opts);
  };

  return loader;
}