nuxtjs example

[timocov]

Hi!

Unfortunately, nobody from our team is familiar with nuxt.js, so please feel free to make PR!

[trungnqpro]

I have experienced with nuxtjs and integrated with tradingview successfully. if you need, i will make a project demo in PR for this features, @timocov . Please let me know if you concerned about this.

[timocov]

@trungnqpro that's great! Feel free to make PR https://github.com/tradingview/charting-library-examples/blob/master/CONTRIBUTING.md#contributing-code.

[trungnqpro]

Dear Sir, I will do it soon, and make PR Thank you,

Brgs, Trung Nguyen

Vào Th 5, 18 thg 7, 2019 vào lúc 16:21 Evgeniy Timokhov < notifications@github.com> đã viết:

@trungnqpro https://github.com/trungnqpro that's great! Feel free to make PR https://github.com/tradingview/charting-library-examples/blob/master/CONTRIBUTING.md#contributing-code .

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/tradingview/charting-library-examples/issues/30?email_source=notifications&email_token=ACN25O2DDOE74ETW2OAGZJTQAAY23A5CNFSM4FLGBVAKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD2H366I#issuecomment-512737145, or mute the thread https://github.com/notifications/unsubscribe-auth/ACN25O3LV6WX3IO4Q52T6HTQAAY23ANCNFSM4FLGBVAA .

[timocov]

@trungnqpro did you have any chance to make a PR for this?)

[trungnqpro]

Sorry man, Im so busy right now, maybe i will make PR soon.

Brgs, Trung Nguyen

Vào Th 5, 1 thg 8, 2019 vào lúc 17:18 Evgeniy Timokhov < notifications@github.com> đã viết:

@trungnqpro https://github.com/trungnqpro did you have any chance to make a PR for this?)

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/tradingview/charting-library-examples/issues/30?email_source=notifications&email_token=ACN25O6COFRT27MXFZ4PEWDQCK2APA5CNFSM4FLGBVAKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD3KDEGI#issuecomment-517222937, or mute the thread https://github.com/notifications/unsubscribe-auth/ACN25OZLNVAYMU3ESSQ4WWDQCK2APANCNFSM4FLGBVAA .

[timocov]

No problem. Thanks for the update.

[trungnqpro]

@timocov hmm, nextjs and nuxtjs is different,nextjs based on reactjs, and nuxtjs based on vuejs. please re-open this issue, thank you!

[timocov]

Oh, my bad, sorry.

[trungnqpro]

Dear sir Timokhov, I have already made PR for nuxtjs version, I structured my project as real world project on production and used our own api service to test data (our product: https://www.bcnex.net/) Please review for me and inform me if any probs.

Thank you, Trung Nguyen

Vào Th 5, 19 thg 9, 2019 vào lúc 14:54 Evgeniy Timokhov < notifications@github.com> đã viết:

Reopened #30 https://github.com/tradingview/charting-library-examples/issues/30.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/tradingview/charting-library-examples/issues/30?email_source=notifications&email_token=ACN25O74O52L4YEVEZLT5GTQKMV3FA5CNFSM4FLGBVAKYY3PNVWWK3TUL52HS4DFWZEXG43VMVCXMZLOORHG65DJMZUWGYLUNFXW5KTDN5WW2ZLOORPWSZGOTW3KFMI#event-2645992113, or mute the thread https://github.com/notifications/unsubscribe-auth/ACN25O4HY667FGGCTLK5XFTQKMV3FANCNFSM4FLGBVAA .

[timocov]

Hey @trungnqpro, thank you for your work. Please pay attention on comment in the PR.

[caiqueacct]

Hi

Have anybody created a nuxt example?

I'm receiving the following error: { "statusCode": 404, "message": "This page could not be found" } when using the vue example.

Thanks

[sefaemrahoglu]

Hi

Can anyone help me urgently? I did just like vue example and I am getting 'document is not defined'.

this is index.vue html <div class="app"><TVChartContainer /></div> this is index.vue js import TVChartContainer from '../components/TVChartContainer' export default { components : { TVChartContainer } }

this is TVChartContainer.vue html

<div class="TVChartContainer" :id="containerId" />

this is TVChartContainer.vue js

export default {
  name: 'TVChartContainer',
  props: {
    symbol: {
      default: 'AAPL',
      type: String,
    },
    interval: {
      default: 'D',
      type: String,
    },
    containerId: {
      default: 'tv_chart_container',
      type: String,
    },
    datafeedUrl: {
      default: 'https://demo_feed.tradingview.com',
      type: String,
    },
    libraryPath: {
      default: '/charting_library/',
      type: String,
    },
    chartsStorageUrl: {
      default: 'https://saveload.tradingview.com',
      type: String,
    },
    chartsStorageApiVersion: {
      default: '1.1',
      type: String,
    },
    clientId: {
      default: 'tradingview.com',
      type: String,
    },
    userId: {
      default: 'public_user_id',
      type: String,
    },
    fullscreen: {
      default: false,
      type: Boolean,
    },
    autosize: {
      default: true,
      type: Boolean,
    },
    studiesOverrides: {
      type: Object,
    }
  },
  tvWidget: null,
  mounted() {
    const widgetOptions = {
      symbol: this.symbol,
      // BEWARE: no trailing slash is expected in feed URL
      datafeed: new window.Datafeeds.UDFCompatibleDatafeed(this.datafeedUrl),
      interval: this.interval,
      container_id: this.containerId,
      library_path: this.libraryPath,

      locale: getLanguageFromURL() || 'en',
      disabled_features: ['use_localstorage_for_settings'],
      enabled_features: ['study_templates'],
      charts_storage_url: this.chartsStorageUrl,
      charts_storage_api_version: this.chartsStorageApiVersion,
      client_id: this.clientId,
      user_id: this.userId,
      fullscreen: this.fullscreen,
      autosize: this.autosize,
      studies_overrides: this.studiesOverrides,
    };

    const tvWidget = new widget(widgetOptions);
    this.tvWidget = tvWidget;

    tvWidget.onChartReady(() => {
      tvWidget.headerReady().then(() => {
        const button = tvWidget.createButton();

        button.setAttribute('title', 'Click to show a notification popup');
        button.classList.add('apply-common-tooltip');

        button.addEventListener('click', () => tvWidget.showNoticeDialog({
            title: 'Notification',
            body: 'TradingView Charting Library API works correctly',
            callback: () => {
              // eslint-disable-next-line no-console
              console.log('Noticed!');
            },
          }));

        button.innerHTML = 'Check API';
      });
    });
  },
  destroyed() {
    if (this.tvWidget !== null) {
      this.tvWidget.remove();
      this.tvWidget = null;
    }
  }
}`

[sefaemrahoglu]

I figured out how to fix the problem. for those who need nuxt.js working example of charting library. nuxt.js charting library example @timocov