text: webpackJsonp([1], {
    0(t, a, e) { t.exports = e('NHnr'); },
    '0Xea': function (t, a) {},
    '7zck': function (t, a) {},
    NHnr(t, a, e) {
      Object.defineProperty(a, '__esModule', { value: !0 }); let n = e('/5sW'),
        i = e('3EgV'),
        r = e.n(i),
        s = (e('SldL'), e('7hDC')),
        o = e.n(s),
        c = (e('n12u'), e('Z60a')),
        l = e.n(c),
        u = e('C9uT'),
        d = e.n(u),
        h = e('Icdr'),
        v = (e('GbHy'), e('Oq2I'), e('FBwb'), 'macarons'),
        f = {
          bar: {
            color: ['#FFAB00'],
            tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } },
            grid: {
              top: '15%', left: '3%', right: '4%', bottom: '10%', containLabel: !0,
            },
            series: [],
          },
          wordCloud: { series: [] },
        },
        p = (function () {
          function t(a) { l()(this, t), this.echats = h.init(a); } return d()(t, [{
            key: 'setOption',
            value(t) {
              let a = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : 'bar',
                e = Object.assign({}, f[a], t); this.echats.setOption(e, v);
            },
          }]), t;
        }()),
        m = p,
        x = {
          title: 'FrequencyChart',
          props: { data: Object },
          data() { return { chart: null }; },
          methods: {
            initOpt() {
              let t = this.data.detail,
                a = this.formateData(t.splice(0, 10)); this.chart.setOption(a);
            },
            formateData(t) {
              let a = [],
                e = []; return t.forEach((t) => { a.push(t.word), e.push(t.count); }), {
                color: ['#3398DB'],
                xAxis: [{ type: 'category', axisTick: { alignWithLabel: !0 }, data: a }],
                yAxis: [{ type: 'value' }],
                series: [{
                  name: 'Count', type: 'bar', barWidth: '60%', data: e,
                }],
              };
            },
            initChart() { this.chart = new m(this.$el); },
          },
          mounted() { this.initChart(); },
          watch: { data(t) { t && this.initOpt(); } },
        },
        g = function () {
          let t = this,
            a = t.$createElement,
            e = t._self._c || a; return e('div', { staticClass: 'word-frequency-chart' });
        },
        w = [],
        y = e('XyMi'); function b(t) { e('0Xea'); } let C = !1,
        _ = b,
        O = null,
        D = null,
        j = Object(y.a)(x, g, w, C, _, O, D),
        M = j.exports,
        S = e('fKPv'),
        k = e.n(S),
        z = {
          title: 'WordCloud',
          props: { data: Object },
          data() { return { chart: null }; },
          methods: {
            initOpt() { const t = this.formateData(this.data.detail); this.chart.setOption(t, 'wordCloud'); },
            formateData(t) {
              let a,
                e = t.map(t => ({ name: t.word, value: t.count })); return {
                series: [(a = {
                  name: 'Word', type: 'wordCloud', shape: 'pentagon', size: ['80%', '80%'], autoSize: { enable: !0, minSize: 14 }, textRotation: [0, 45, 90, -45], textPadding: 0,
                }, k()(a, 'autoSize', { enable: !0, minSize: 14 }), k()(a, 'textStyle', { normal: { fontFamily: 'sans-serif', color() { return 'rgb('.concat([Math.round(160 * Math.random()), Math.round(160 * Math.random()), Math.round(160 * Math.random())].join(','), ')'); } }, emphasis: { shadowBlur: 10, shadowColor: '#333' } }), k()(a, 'data', e), a)],
              };
            },
            initChart() { this.chart = new m(this.$el); },
          },
          mounted() { this.initChart(); },
          watch: { data(t) { t && this.initOpt(); } },
        },
        W = function () {
          let t = this,
            a = t.$createElement,
            e = t._self._c || a; return e('div', { staticClass: 'word-cloud' });
        },
        $ = []; function E(t) { e('tGia'); } let F = !1,
        P = E,
        q = null,
        B = null,
        I = Object(y.a)(z, W, $, F, P, q, B),
        A = I.exports,
        G = {
          name: 'home', data() { return { data: {}, interval: null }; }, methods: { fetchData: (function () { const t = o()(regeneratorRuntime.mark(function t() { let a; return regeneratorRuntime.wrap(function (t) { while (1) switch (t.prev = t.next) { case 0: return t.next = 2, fetch('data/view'); case 2: return a = t.sent, t.next = 5, a.json(); case 5: this.data = t.sent; case 6: case 'end': return t.stop(); } }, t, this); })); return function () { return t.apply(this, arguments); }; }()) }, beforeDestroy() { clearInterval(this.interval); }, mounted() { this.fetchData(), this.interval = setInterval(this.fetchData, 1e3); }, components: { WordFrenquency: M, WordCloud: A },
        },
        H = function () {
          let t = this,
            a = t.$createElement,
            e = t._self._c || a; return e('v-card', [e('v-container', { staticStyle: { height: '95vh' }, attrs: { fluid: '', 'grid-list-lg': '' } }, [e('v-layout', { attrs: { row: '', wrap: '' } }, [e('v-flex', { attrs: { xs3: '' } }, [e('v-card', { staticClass: 'white--text', attrs: { color: 'teal accent-4', height: '250px' } }, [e('v-card-title', { attrs: { 'primary-title': '' } }, [e('div', { staticClass: 'headline' }, [t._v('总单词数')])]), t._v(' '), e('v-card-text', { staticClass: 'text-md-center display-3' }, [t._v(`\n            ${t._s(t.data && t.data.total)}\n          `)])], 1)], 1), t._v(' '), e('v-flex', { attrs: { xs9: '' } }, [e('v-card', { staticClass: 'white--text', attrs: { color: 'blue-grey lighten-3', height: '250px' } }, [e('v-container', { attrs: { fluid: '', 'grid-list-lg': '' } }, [e('v-layout', { attrs: { column: '' } }, [e('v-flex', { attrs: { xs12: '' } }, [e('div', [e('div', { staticClass: 'headline' }, [t._v('出现频率最高的单词')])])]), t._v(' '), e('v-flex', { attrs: { xs12: '' } }, [e('word-frenquency', { attrs: { data: t.data } })], 1)], 1)], 1)], 1)], 1), t._v(' '), e('v-flex', { attrs: { xs12: '' } }, [e('v-card', { staticClass: 'white--text', attrs: { color: 'blue lighten-3', height: '400px' } }, [e('v-container', { attrs: { fluid: '', 'grid-list-lg': '' } }, [e('v-layout', { attrs: { column: '' } }, [e('v-flex', { attrs: { xs12: '' } }, [e('div', [e('div', { staticClass: 'headline' }, [t._v('词云')])])]), t._v(' '), e('v-flex', { attrs: { xs12: '' } }, [e('word-cloud', { attrs: { data: t.data } })], 1)], 1)], 1)], 1)], 1)], 1)], 1)], 1);
        },
        L = [],
        R = !1,
        T = null,
        X = null,
        K = null,
        N = Object(y.a)(G, H, L, R, T, X, K),
        J = N.exports,
        V = { name: 'app', data() { return { items: [{ title: 'Display' }] }; }, components: { MainContent: J } },
        Z = function () {
          let t = this,
            a = t.$createElement,
            e = t._self._c || a; return e('div', { attrs: { id: 'app' } }, [e('div', { staticClass: 'grey lighten-3', staticStyle: { 'max-width': '100%', margin: 'auto' }, attrs: { id: 'e3' } }, [e('v-toolbar', { attrs: { color: 'indigo' } }, [e('v-toolbar-title', { staticClass: 'white--text' }, [t._v('Kafka Streaming Dashboard')]), t._v(' '), e('v-spacer'), t._v(' '), e('v-btn', { attrs: { icon: '' } })], 1), t._v(' '), e('main-content')], 1)]);
        },
        Q = []; function U(t) { e('od4P'); } let Y = !1,
        tt = U,
        at = null,
        et = null,
        nt = Object(y.a)(V, Z, Q, Y, tt, at, et),
        it = nt.exports; e('7zck'); n.a.config.productionTip = !1, n.a.use(r.a), new n.a({ render(t) { return t(it); } }).$mount('#app');
    },
    od4P(t, a) {},
    tGia(t, a) {},
  }, [0]);
  // # sourceMappingURL=app.ee35738c.js.map
  