{"version":3,"sources":["webpack:///./src/components/miniapp/gold/GoldGraphNav.vue?7946","webpack:///./node_modules/querystring-es3/decode.js","webpack:///./src/components/miniapp/gold/GoldGraphNav.vue?dda6","webpack:///src/components/miniapp/gold/GoldGraphNav.vue","webpack:///./src/components/miniapp/gold/GoldGraphNav.vue?f4fc","webpack:///./src/components/miniapp/gold/GoldGraphNav.vue","webpack:///./node_modules/querystring-es3/index.js","webpack:///./node_modules/querystring-es3/encode.js"],"names":["hasOwnProperty","obj","prop","Object","prototype","call","module","exports","qs","sep","eq","options","length","regexp","split","maxKeys","len","i","kstr","vstr","k","v","x","replace","idx","indexOf","substr","decodeURIComponent","isArray","push","Array","xs","toString","render","_vm","this","_h","$createElement","_c","_self","attrs","staticClass","ref","on","onScroll","dataAssetname","getGoldPeriod","range","getGoldCurrentPeriod","choosePeriod","_e","tradingviewDataTag","callProfessionalGraph","_v","staticRenderFns","TH","d3","decimal","thousands","grouping","currency","dateTime","date","time","periods","days","shortDays","months","shortMonths","numberFormat","parts","num","join","announcementFormate","period","changeFormat","parseDate","getDate","colorTheme","pl","constants","profit","loss","iconPriceChange","graphMarginPercentage","grey","stable","graphColor","margin","top","left","right","bottom","bgTop","focusStroke","lineStroke","axisStroke","circleRadius","tooltipDayWidth","tooltipDayHeight","tooltipWidth","tooltipHeight","driftRightMargin","driftTopMargin","tickMoveFactor","components","PeriodNavigation","props","id","type","String","default","data","firstPaint","watch","computed","goldType","$route","query","gold_detail","checkNavData","getGoldHistoryGraph","yAxisFormatTitle","helpers","format","yAxisFormatTick","methods","periodScroll","scrollLeft","$refs","periodNavigation","classList","remove","add","periodList","offsetWidth","graphHeight","graphWidth","graphRatio","renderGraph","drawGraph","formattedLineData","d","svgWidth","clientWidth","svgHeight","spaceNavLineElem","style","height","xRange","graphMargin","yMax","yMin","yRange","xAxis","yAxis","sizeUpdate","rangeUpdate","axisUpdate","make_y_axis","generateTooltipDay","tooltip","generateTooltip","isFirst","vis","focusCircle","append","attr","select","selectAll","bisectDate","mouseOver","elemFocusLine","elemFocusCircle","elemFocusTooltip","mouseOut","mouseMove","mouseEvent","handleMove","touchMove","d0","d1","x0","xPad","yPad","elemFocusTooltipNav","text","elemFocusTooltipDate","elemFocusTooltipCreatedAt","t","elemFocusTooltipChange","c","elemFocusTooltipChangeIcon","fontSize","document","getElementById","tickUpdate","lineGen","updateAxisAndGraph","$emit","component","decode","parse","encode","stringify","stringifyPrimitive","isFinite","name","undefined","map","objectKeys","ks","encodeURIComponent","f","res","keys","key"],"mappings":"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BAAV,IAEA,2CAIA,aACQ,IAAR,4DACQC,EAAWC,GAA4B,EACvCC,EAAY,EAApB,cACQC,EAAiBC,MAAMC,OAASH,EAAY,MAGpD,aACQI,EAAS7F,EAAjB,OAEA,8CAEA,iCAGU8F,EADV,MAAY,EAAZ,qBACA,GAAwB,EAAxB,KAEyBC,EAAOC,GAAQxE,EAAUI,sBAG1CqE,EAASjG,EAAjB,OAEA,wCACA,sBAGA,aACQkG,EAAQlG,EAAhB,KACA,GACA,+BAEA,yBAEQmG,EAAQnG,EAAhB,KACA,GACA,cACA,UAGMoG,IACAC,IACAC,IAGA,IAAN,WAEA,cACA,eAAQ,OAAR,UACA,eAAQ,OAAR,UAGUC,EAAc,WAChB,OAAOvG,EAAf,kBAGUwG,EAAqB,WAEvB,IAAR,IACA,YACA,kCACA,wBAGQC,EACR,eACA,6BACA,gCACA,kCACA,aACA,aAGQA,EACR,eACA,aACA,aACA,6BACA,2BACA,oBACA,iBAGQA,EACR,eACA,6BACA,aACA,aACA,oBACA,2CACA,yBACA,UAGQA,EACR,eACA,mCACA,aACA,aACA,2BACA,uBACA,yBAGQA,EACR,eACA,aACA,aACA,4BACA,2BACA,gBAGQA,EACR,eACA,+BACA,aACA,aACA,cAGQA,EACR,eACA,oCACA,aACA,aACA,2CACA,yBACA,4BAGUC,EAAkB,WAGpB,IAAR,IACA,YACA,8BACA,wBAEQD,EACR,eACA,6BACA,6BACA,+BACA,aACA,aAGQA,EACR,eACA,aACA,aACA,6BACA,2BACA,oBACA,iBAGQA,EACR,eACA,6BACA,aACA,aACA,oBACA,2CACA,yBACA,UAGQA,EACR,eACA,aACA,aACA,4BACA,2BACA,iBAGM,GAAIE,EAAS,CACXC,EACR,gBACA,uBACA,QAEQA,EACR,gBACA,uBACA,uCACA,oBACA,QAEQA,EACR,YACA,qBACA,sBACA,oCACA,+BACA,KACA,IACA,kBACA,gBAIQA,EACR,eACA,0BACA,aACA,cACA,eACA,4BACA,kCACA,oBAGQA,EACR,cACA,6BACA,oBACA,QACA,QACA,iBACA,uBAAU,OAAV,UACA,uBAAU,OAAV,UACA,yBACA,0BACA,6BAEA,uEAGQA,EACR,eACA,2BACA,wBACA,6BACA,mCACA,yBACA,wBAGQ,IAAR,IACA,YACA,6BACA,wBAGQC,EAAYC,OAAO,UAAUC,KAAK,IAAKvF,EAAUiB,aAAe,GAGhEoE,EACR,iBACA,6BACA,yBAGA,iCACQH,SAIAE,EAAII,OAAO,MAAMnK,KAAKqJ,GAEtBU,EAAIK,UAAU,eAAetB,MAAM,UAAW,QAE9CiB,EAAIK,UAAU,iBAAiBtB,MAAM,UAAW,QAEhDiB,EAAIK,UAAU,sBAAsBtB,MAAM,UAAW,QAErDiB,EAAIK,UAAU,kBAAkBtB,MAAM,UAAW,QAEjDiB,EAAIK,UAAU,iBAAiBrC,SAEvC,iCACUgC,EACV,wBACA,oBACA,QACA,QACA,iBACA,uBAAY,OAAZ,UACA,uBAAY,OAAZ,UACA,yBACA,0BACA,6BAIQA,EACR,aACA,oBACA,QAGQA,EACR,gBACA,qBACA,sBACA,qCACA,KACA,IACA,kBACA,gBAIQA,EACR,qBACA,aACA,cACA,aACA,eACA,4BACA,kCACA,oBAMM5G,EAAN,wCAKM,IAAN,0BACA,4BACA,EACA,6DACA,+BACA,2BACA,+BACA,8BACA,kCACA,8BACA,mCAGA,GACQkH,WAAY,WAApB,OACA,oBACY,OAAO5B,EAAEA,KACrB,MACQ6B,UAAW,WACTC,EAAczB,MAAM,UAAW,MAC/B0B,EAAgB1B,MAAM,UAAW,MACjC2B,EAAiB3B,MAAM,UAAW,OAEpC4B,SAAU,WACRH,EAAczB,MAAM,UAAW,QAC/B0B,EAAgB1B,MAAM,UAAW,QACjC2B,EAAiB3B,MAAM,UAAW,SAEpC6B,UAAW,WACTC,EAAWC,WAAW1H,EAAhC,gCAEQ2H,UAAW,WACTF,EAAWC,WAAW1H,EAAhC,sCAEQ0H,WAAY,SAApB,KACUN,EAAczB,MAAM,UAAW,MAC/B0B,EAAgB1B,MAAM,UAAW,MACjC2B,EAAiB3B,MAAM,UAAW,MAElC,IAAV,cACA,wBACA,SACA,OAEU,GAAU,MAANiC,GAAoB,MAANC,EAAY,CAC5B,IAAZ,YACgC,GAAhBhC,EAAO+B,EAAGtC,IAAWO,EAAOiC,GAAMjC,EAAOgC,EAAGvC,GAAK,IACnDA,EAAIsC,GAGNR,EAAcL,KAAK,YAAa,aAAelB,EAAOP,EAAEA,GAAK,OAC7D+B,EACZ,qDACA,0BAGY,IAAZ,IACA,IACgB9B,EAAWM,EAAOP,EAAEA,GAAK9D,EAAUoB,eACrCmF,GAAQvG,EAAUoB,aAA4C,EAA7BpB,EAAUsB,kBAGzC2C,EAAYjE,EAAUQ,OAAOI,OAASZ,EAAUQ,OAAOK,MAAQ4D,EAAOX,EAAEzH,GAAK2D,EAAUqB,gBACzFmF,GAAQxG,EAAUqB,cAAgB,GAGhCoD,EAAOX,EAAEzH,GAAK2D,EAAUqB,gBAC1BmF,EAAOxG,EAAUqB,cAAgB,GAInCoF,EAAoBC,KAAK/D,EAAQtD,aAAayE,EAAEzH,IAEhDsK,EAAqBD,KAAK/D,EAAQ9C,QAAQiE,EAAEA,IAC5C8C,EAA0BF,KAAK/D,EAAQlD,oBAAoBqE,EAAE+C,EAAG,EAA5E,uBAEYC,EAAuBJ,KAAK/D,EAAQhD,aAAamE,EAAEiD,IAAIxB,KAAK,OAAQ5C,EAAQ7C,WAAWgE,EAAEiD,IACzFC,EAA2BN,KAAK/D,EAAQxC,gBAAgB2D,EAAEiD,IAAIxB,KAAK,OAAQ5C,EAAQ7C,WAAWgE,EAAEiD,IAIhGjB,EAAiBP,KAC7B,YACA,cACA,6BACA,KACA,2BACA,QAMWJ,GACHC,EAAII,OAAO,qBAAqBpC,SAIlCgC,EACN,eACA,iCACA,oBACA,6BACA,yBACA,gBACA,gDACA,4BACA,0BACA,4BACA,+BAIM,IAAN,aACQ,IAAI6B,EAEFA,EADElD,EAAW,IACF,OAEA,OAEbqB,EACR,wBACA,2BACA,aACA,qCACA,qBACA,oBAEQA,EAAIK,UAAU,iBAAiBF,KAAK,IAAK,GAGzCH,EAAIK,UAAU,iBAAiBF,KAAK,IAAK,EAAjD,eAEQH,EAAIK,UAAU,iBAAiBtB,MAAM,YAAa8C,GAElD7B,EACR,0BACA,aACA,aACA,aACA,aACA,qBAEQA,EACR,yBACA,wBACA,aAEQ8B,SAASC,eAAe,sBAAsBhD,MAAMC,OAAS,EAArE,uBAGMgD,IAGAhC,EAAII,OAAO,iBAAiBD,KAAK,OAAQ,SAGzC,IAAN,aACQH,EAAII,OAAO,MAAMnK,KAAKqJ,GAEtBU,EACR,aACA,oBACA,sCACA,QAGQA,EAAII,OAAO,cAAcD,KAAK,IAAK8B,EAAQxD,IAEnD,MAAY,EAAZ,qBAEUuB,EACV,2BACA,QACA,uBACY,OAAZ,UAEA,uBACY,OAAZ,UAIUA,EAAIK,UAAU,iBAAiBF,KAAK,UAAW,QAGjDH,EACR,gBACA,qBACA,sBACA,qCACA,KACA,IACA,kBACA,iBAIWD,GACH3G,EAAR,+BAGMA,EAAN,qCACQoG,IACAC,IACAC,IACAwC,IACAF,QAGJhJ,sBA9mBJ,WA+mBMjB,KAAKoK,MAAM,oBAAoB,OCt1B+U,I,wBCQhXC,EAAY,eACd,EACAvK,EACAqB,GACA,EACA,KACA,KACA,MAIa,aAAAkJ,E,2CCjBfjM,EAAQkM,OAASlM,EAAQmM,MAAQ,EAAQ,QACzCnM,EAAQoM,OAASpM,EAAQqM,UAAY,EAAQ,S,yDCoB7C,IAAIC,EAAqB,SAASxL,GAChC,cAAeA,GACb,IAAK,SACH,OAAOA,EAET,IAAK,UACH,OAAOA,EAAI,OAAS,QAEtB,IAAK,SACH,OAAOyL,SAASzL,GAAKA,EAAI,GAE3B,QACE,MAAO,KAIbf,EAAOC,QAAU,SAASN,EAAKQ,EAAKC,EAAIqM,GAOtC,OANAtM,EAAMA,GAAO,IACbC,EAAKA,GAAM,IACC,OAART,IACFA,OAAM+M,GAGW,kBAAR/M,EACFgN,EAAIC,EAAWjN,IAAM,SAASmB,GACnC,IAAI+L,EAAKC,mBAAmBP,EAAmBzL,IAAMV,EACrD,OAAIkB,EAAQ3B,EAAImB,IACP6L,EAAIhN,EAAImB,IAAI,SAASC,GAC1B,OAAO8L,EAAKC,mBAAmBP,EAAmBxL,OACjDmD,KAAK/D,GAED0M,EAAKC,mBAAmBP,EAAmB5M,EAAImB,QAEvDoD,KAAK/D,GAILsM,EACEK,mBAAmBP,EAAmBE,IAASrM,EAC/C0M,mBAAmBP,EAAmB5M,IAF3B,IAKpB,IAAI2B,EAAUE,MAAMF,SAAW,SAAUG,GACvC,MAA8C,mBAAvC5B,OAAOC,UAAU4B,SAAS3B,KAAK0B,IAGxC,SAASkL,EAAKlL,EAAIsL,GAChB,GAAItL,EAAGkL,IAAK,OAAOlL,EAAGkL,IAAII,GAE1B,IADA,IAAIC,EAAM,GACDrM,EAAI,EAAGA,EAAIc,EAAGnB,OAAQK,IAC7BqM,EAAIzL,KAAKwL,EAAEtL,EAAGd,GAAIA,IAEpB,OAAOqM,EAGT,IAAIJ,EAAa/M,OAAOoN,MAAQ,SAAUtN,GACxC,IAAIqN,EAAM,GACV,IAAK,IAAIE,KAAOvN,EACVE,OAAOC,UAAUJ,eAAeK,KAAKJ,EAAKuN,IAAMF,EAAIzL,KAAK2L,GAE/D,OAAOF","file":"js/chunk-52016527.9e13d078.js","sourcesContent":["import mod from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GoldGraphNav.vue?vue&type=style&index=0&lang=scss&\"; export default mod; export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/@vue/cli-service/node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GoldGraphNav.vue?vue&type=style&index=0&lang=scss&\"","// Copyright Joyent, Inc. and other Node contributors.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a\n// copy of this software and associated documentation files (the\n// \"Software\"), to deal in the Software without restriction, including\n// without limitation the rights to use, copy, modify, merge, publish,\n// distribute, sublicense, and/or sell copies of the Software, and to permit\n// persons to whom the Software is furnished to do so, subject to the\n// following conditions:\n//\n// The above copyright notice and this permission notice shall be included\n// in all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS\n// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\n// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN\n// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,\n// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR\n// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE\n// USE OR OTHER DEALINGS IN THE SOFTWARE.\n\n'use strict';\n\n// If obj.hasOwnProperty has been overridden, then calling\n// obj.hasOwnProperty(prop) will break.\n// See: https://github.com/joyent/node/issues/1707\nfunction hasOwnProperty(obj, prop) {\n  return Object.prototype.hasOwnProperty.call(obj, prop);\n}\n\nmodule.exports = function(qs, sep, eq, options) {\n  sep = sep || '&';\n  eq = eq || '=';\n  var obj = {};\n\n  if (typeof qs !== 'string' || qs.length === 0) {\n    return obj;\n  }\n\n  var regexp = /\\+/g;\n  qs = qs.split(sep);\n\n  var maxKeys = 1000;\n  if (options && typeof options.maxKeys === 'number') {\n    maxKeys = options.maxKeys;\n  }\n\n  var len = qs.length;\n  // maxKeys <= 0 means that we should not limit keys count\n  if (maxKeys > 0 && len > maxKeys) {\n    len = maxKeys;\n  }\n\n  for (var i = 0; i < len; ++i) {\n    var x = qs[i].replace(regexp, '%20'),\n        idx = x.indexOf(eq),\n        kstr, vstr, k, v;\n\n    if (idx >= 0) {\n      kstr = x.substr(0, idx);\n      vstr = x.substr(idx + 1);\n    } else {\n      kstr = x;\n      vstr = '';\n    }\n\n    k = decodeURIComponent(kstr);\n    v = decodeURIComponent(vstr);\n\n    if (!hasOwnProperty(obj, k)) {\n      obj[k] = v;\n    } else if (isArray(obj[k])) {\n      obj[k].push(v);\n    } else {\n      obj[k] = [obj[k], v];\n    }\n  }\n\n  return obj;\n};\n\nvar isArray = Array.isArray || function (xs) {\n  return Object.prototype.toString.call(xs) === '[object Array]';\n};\n","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{attrs:{\"id\":\"gold-graph\"}},[_c('div',{staticClass:\"graph-area\"},[_c('svg',{attrs:{\"id\":\"gold-graph-d3-line\",\"width\":\"100%\"}},[_c('defs',[_c('pattern',{attrs:{\"id\":\"pattern1\",\"x\":\"10\",\"y\":\"10\",\"width\":\"10\",\"height\":\"10\",\"patternUnits\":\"userSpaceOnUse\"}})])])]),_c('div',{ref:\"periodNavigation\",staticClass:\"select-navigation fade-right\"},[(_vm.getGoldPeriod)?_c('div',{ref:\"periodScroll\",staticClass:\"select-period\",on:{\"scroll\":_vm.onScroll}},[_c('period-navigation',{attrs:{\"backgorund\":\"#ffffff\",\"activePosition\":\"top\",\"data-action\":\"change_gold_period\",\"data-assettype\":\"gold\",\"data-assetname\":_vm.dataAssetname,\"arrPeriod\":_vm.getGoldPeriod.range,\"alias\":\"period\",\"defaultItem\":_vm.getGoldCurrentPeriod,\"slidePerPage\":10},on:{\"select-data\":_vm.choosePeriod}})],1):_vm._e()]),_c('div',{staticClass:\"professional-btn-center\"},[_c('a',{staticClass:\"ctn-graph-professional\",attrs:{\"data-action\":_vm.tradingviewDataTag,\"href\":\"javascript:;\"},on:{\"click\":_vm.callProfessionalGraph}},[_c('i',{staticClass:\"fas fa-chart-bar\"}),_vm._v(\" กราฟเทคนิค \")])])])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div id=\"gold-graph\">\n    <div class=\"graph-area\">\n      <svg id=\"gold-graph-d3-line\" width=\"100%\">\n        <defs>\n          <pattern\n            id=\"pattern1\"\n            x=\"10\"\n            y=\"10\"\n            width=\"10\"\n            height=\"10\"\n            patternUnits=\"userSpaceOnUse\"\n          />\n        </defs>\n      </svg>\n    </div>\n    <div class=\"select-navigation fade-right\" ref=\"periodNavigation\">\n      <div class=\"select-period\" v-if=\"getGoldPeriod\" @scroll=\"onScroll\" ref=\"periodScroll\">\n        <period-navigation\n          backgorund=\"#ffffff\"\n          activePosition=\"top\"\n          data-action=\"change_gold_period\"\n          data-assettype=\"gold\"\n          :data-assetname=\"dataAssetname\"\n          :arrPeriod=\"getGoldPeriod.range\"\n          :alias=\"`period`\"\n          @select-data=\"choosePeriod\"\n          :defaultItem=\"getGoldCurrentPeriod\"\n          :slidePerPage=\"10\"\n        />\n      </div>\n    </div>\n    <div class=\"professional-btn-center\">\n      <a\n        class=\"ctn-graph-professional\"\n        :data-action=\"tradingviewDataTag\"\n        href=\"javascript:;\"\n        @click=\"callProfessionalGraph\"\n      >\n        <i class=\"fas fa-chart-bar\"></i> กราฟเทคนิค\n      </a>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { mapGetters, mapActions } from \"vuex\"\nimport * as d3 from \"d3\"\nimport querystring from \"querystring\"\n\n// Helper Functions\nlet helpers = {\n  TH: d3.timeFormatDefaultLocale({\n    decimal: \".\",\n    thousands: \",\",\n    grouping: [3],\n    currency: [\"$\", \"\"],\n    dateTime: \"%a %b %e %X %Y\",\n    date: \"%d/%m/%Y\",\n    time: \"%H:%M:%S\",\n    periods: [\"AM\", \"PM\"],\n    days: [\"Sunday\", \"Monday\", \"Tuesday\", \"Wednesday\", \"Thursday\", \"Friday\", \"Saturday\"],\n    shortDays: [\"อ\", \"จ\", \"อ\", \"พ\", \"พฤ\", \"ศ\", \"ส\"],\n    months: [\n      \"มกราคม\",\n      \"กุมภาพันธ์\",\n      \"มีนาคม\",\n      \"เมษายน\",\n      \"พฤษภาคม\",\n      \"มิถุนายน\",\n      \"กรกฎาคม\",\n      \"สิงหาคม\",\n      \"กันยายน\",\n      \"ตุลาคม\",\n      \"พฤศจิกายน\",\n      \"ธันวาคม\"\n    ],\n    shortMonths: [\"ม.ค.\", \"ก.พ.\", \"มี.ค.\", \"เม.ย.\", \"พ.ค.\", \"มิ.ย.\", \"ก.ค.\", \"ส.ค.\", \"ก.ย.\", \"ต.ค.\", \"พ.ย.\", \"ธ.ค.\"]\n  }),\n  numberFormat: function(num) {\n    var parts = num.toString().split(\".\")\n    parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\")\n    return parts.join(\".\") + \" ฿\"\n  },\n  announcementFormate: function(num, period) {\n    return period == \"1D\" ? `ประกาศครั้งที่ ${num}` : `ประกาศล่าสุดของวัน`\n  },\n  changeFormat: change => parseFloat(change).toFixed(0),\n  parseDate: d3.timeParse(\"%Y-%m-%dT%H:%M:%SZ\"),\n  getDate: d3.timeFormat(\"%d/%m/%y | %H.%M\"),\n  colorTheme: function(pl) {\n    if (pl > 0) return constants.profit\n    else if (pl == 0) return constants.stable\n    return constants.loss\n  },\n  iconPriceChange: function(pl) {\n    if (pl > 0) return \"\\uf0d8\"\n    else if (pl == 0) return \"\\uf0dc\"\n    return \"\\uf0d7\"\n  }\n}\n\n// Constant\nlet constants = {\n  graphMarginPercentage: 0.1,\n\n  // color and styling\n  grey: \"#B0B0B0\",\n  profit: \"#17c161\",\n  loss: \"#da1616\", //da1616\n  stable: \"#999999\",\n  graphColor: \"#0c52e5\",\n\n  margin: {\n    top: 20,\n    left: 0,\n    right: 0,\n    bottom: 20,\n    bgTop: 12\n  },\n\n  // Focusing\n  focusStroke: 1.5,\n  lineStroke: 2,\n  axisStroke: 2,\n  circleRadius: 4.5,\n\n  // Tooltip\n  tooltipDayWidth: 130,\n  tooltipDayHeight: 80,\n  tooltipWidth: 120,\n  tooltipHeight: 60,\n  driftRightMargin: 10,\n  driftTopMargin: 22.5,\n\n  // Tick Styling\n  tickMoveFactor: 34\n}\n\nexport default {\n  components: {\n    PeriodNavigation: () => import('../../../components/miniapp/global/PeriodNavigation')\n  },\n  props: {\n    id: {\n      type: String,\n      default: \"trader_bar\"\n    }\n  },\n  data() {\n    return {\n      firstPaint: true,\n      data: [\n        { d: \"2018-03-12\", v: 20000 },\n        { d: \"2018-03-13\", v: 21000 },\n        { d: \"2018-03-14\", v: 24000 },\n        { d: \"2018-03-15\", v: 22000 },\n        { d: \"2018-03-16\", v: 21000 },\n        { d: \"2018-03-19\", v: 23000 },\n        { d: \"2018-03-20\", v: 22000 },\n        { d: \"2018-03-21\", v: 22000 },\n        { d: \"2018-03-22\", v: 20000 },\n        { d: \"2018-03-23\", v: 21000 }\n      ]\n    }\n  },\n  watch: {\n    async $route() {\n      await this.queryData()\n    }\n  },\n  computed: {\n    ...mapGetters(\"gold\", [\"getGoldHistoryGraph\", \"getGoldCurrentPeriod\", \"getGoldPeriod\"]),\n    goldType() {\n      return this.$route.query.gold_detail\n    },\n    dataAssetname() {\n      switch (this.id) {\n        case \"trader_bar\":\n          return \"bar\"\n        case \"trader_ornament\":\n          return \"ornament\"\n        default:\n          return \"bar\"\n      }\n    },\n    tradingviewDataTag() {\n      switch (this.$route.query.gold_detail) {\n        case \"trader_ornament\":\n          return \"gold_ornament_trading_view\"\n        case \"trader_bar\":\n          return \"gold_bar_trading_view\"\n        default:\n          return \"gold_trading_view\"\n      }\n    },\n    checkNavData() {\n      return this.getGoldHistoryGraph(this.id).length > 0\n    },\n    yAxisFormatTitle() {\n      switch (this.getGoldCurrentPeriod) {\n        case \"1D\":\n          return helpers.TH.format(\"%H:%M\")\n        case \"5D\":\n          return helpers.TH.format(\"%e %b\")\n        case \"1W\":\n          return helpers.TH.format(\"%e %b\")\n        case \"1M\":\n          return helpers.TH.format(\"%e %b\")\n        default:\n          return helpers.TH.format(\"%e %b %y\")\n      }\n    },\n    yAxisFormatTick() {\n      switch (this.getGoldCurrentPeriod) {\n        case \"5D\":\n          return 4\n        case \"1W\":\n          return 2\n        case \"6M\":\n          return 2\n        case 'MAX':\n          return 4\n        default:\n          return 6\n      }\n    }\n  },\n  async mounted() {\n    await this.queryData()\n  },\n  methods: {\n    ...mapActions(\"gold\", [\"findGoldHistoryGraph\"]),\n    onScroll() {\n      let periodScroll = this.$refs.periodScroll\n      let periodList = this.$refs.periodList\n      if (periodScroll && periodScroll.scrollLeft < 0) {\n        this.$refs.periodNavigation.classList.remove(\"fade-left\")\n        this.$refs.periodNavigation.classList.add(\"fade-right\")\n      } else if (periodScroll && periodScroll.scrollLeft > 0) {\n        this.$refs.periodNavigation.classList.add(\"fade-right\")\n        this.$refs.periodNavigation.classList.add(\"fade-left\")\n      } else {\n        this.$refs.periodNavigation.classList.add(\"fade-right\")\n        this.$refs.periodNavigation.classList.remove(\"fade-left\")\n      }\n      if (periodList.offsetWidth - periodScroll.offsetWidth == periodScroll.scrollLeft) {\n        this.$refs.periodNavigation.classList.remove(\"fade-right\")\n      }\n    },\n    async choosePeriod(period) {\n      this.$store.state.gold.currentPeriod = period\n      await this.queryData()\n    },\n    async queryData() {\n      // await this.findFundNavVerify(id);\n      await this.getGraphData()\n      await this.renderGraph()\n    },\n    async getGraphData() {\n      await this.findGoldHistoryGraph(this.getGoldCurrentPeriod)\n    },\n    graphHeight() {\n      let graphWidth = document.getElementById(\"gold-graph-d3-line\").clientWidth\n      let graphRatio = graphWidth > 760 ? 0.5 : 0.6\n\n      return graphWidth * graphRatio\n    },\n    renderGraph() {\n      if (!this.checkNavData) {\n        return\n      }\n\n      if (this.firstPaint) {\n        this.drawGraph({ isFirst: true })\n        this.firstPaint = false\n      } else {\n        this.drawGraph({ isFirst: false })\n      }\n    },\n    drawGraph(options) {\n      let isFirst = options.isFirst\n      // Preparing Data\n      let formattedLineData = this.getGoldHistoryGraph(this.id)\n\n      // let pl =\n      //   this.getGoldHistoryGraph[this.getGoldHistoryGraph.length - 1].v -\n      //   this.getGoldHistoryGraph[0].v;\n\n      let vis = d3.select(\"#gold-graph-d3-line\")\n      let spaceNavLineElem = document.getElementById(\"gold-graph-d3-line\")\n\n      // change format date\n      for (var i = 0; i < formattedLineData.length; i++) {\n        formattedLineData[i].d = helpers.parseDate(formattedLineData[i].d)\n      }\n      // Prepare range and domain\n      // Max and min in x bar, y bar\n      let svgWidth, svgHeight\n      let xRange, yRange\n      let xAxis, yAxis\n      let graphMargin\n      // let xMin = d3.min(formattedLineData, d => d.d);\n      // let xMax = d3.max(formattedLineData, d => d.d);\n      let yMin = d3.min(formattedLineData, d => Number(d.v))\n      let yMax = d3.max(formattedLineData, d => Number(d.v))\n\n      //manage text in ticks\n      let formatCurrency = function(d) {\n        let toNumber = parseFloat(d)\n        return (\n          toNumber\n            .toLocaleString(\"th\", {\n              minimumFractionDigits: 0,\n              maximumFractionDigits: 2\n            })\n            .replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\") + \" ฿\"\n        )\n      }\n\n      let sizeUpdate = () => {\n        let clientWidth = document.getElementById(\"gold-graph-d3-line\").clientWidth\n        svgWidth = clientWidth ? clientWidth : 0\n        svgHeight = this.graphHeight()\n        spaceNavLineElem.style.height = svgHeight + \"px\"\n      }\n\n      let rangeUpdate = () => {\n        xRange = d3\n          .scaleTime()\n          .range([constants.margin.left + 60, svgWidth - constants.margin.right - 10])\n          // .domain(d3.extent(formattedLineData, d => d.d))\n          .domain([formattedLineData[0].d, formattedLineData[formattedLineData.length - 1].d])\n\n        if (this.getGoldCurrentPeriod == \"1D\") {\n          graphMargin = (yMax * 0.5) / 100\n        } else {\n          graphMargin = (yMax - yMin) * constants.graphMarginPercentage\n        }\n\n        yRange = d3\n          .scaleLinear()\n          .range([constants.margin.bottom, svgHeight - constants.margin.top])\n          .domain([yMax + graphMargin + 20, yMin - graphMargin])\n      }\n\n      let axisUpdate = () => {\n        xAxis = d3\n          .axisBottom(xRange)\n          .tickFormat(this.yAxisFormatTitle)\n          // .tickValues(tickValuesForAxis)\n          .ticks(this.yAxisFormatTick)\n\n        yAxis = d3\n          .axisRight(yRange)\n          .tickFormat(formatCurrency)\n          .ticks(4)\n      }\n\n      sizeUpdate()\n      rangeUpdate()\n      axisUpdate()\n\n      // Appending or Changing Element\n      let lineGen = d3\n        .line()\n        .curve(d3.curveLinear) // http://bl.ocks.org/d3indepth/b6d4845973089bc1012dec1674d3aff8\n        .x(d => xRange(d.d))\n        .y(d => yRange(d.v))\n\n      // y Axis\n      var make_y_axis = function() {\n        return d3.axisRight(yRange).ticks(4)\n      }\n\n      var generateTooltipDay = function() {\n        // Tooltip\n        let tooltip = vis\n          .append(\"g\")\n          .attr(\"class\", \"focus-tooltip-day\")\n          .style(\"display\", \"none\")\n\n        // Tooltip background\n        tooltip\n          .append(\"rect\")\n          .attr(\"class\", \"tooltip-rect\")\n          .attr(\"width\", constants.tooltipDayWidth)\n          .attr(\"height\", constants.tooltipDayHeight)\n          .attr(\"rx\", 4)\n          .attr(\"ry\", 4)\n\n        // Tooltip date\n        tooltip\n          .append(\"text\")\n          .attr(\"x\", 25)\n          .attr(\"y\", 20)\n          .attr(\"class\", \"tooltip-date\")\n          .attr(\"text-anchor\", \"left\")\n          .attr(\"fill\", constants.grey)\n          .text(\"12/03/07\")\n\n        // Tooltip icon\n        tooltip\n          .append(\"text\")\n          .attr(\"class\", \"tooltip-logo\")\n          .attr(\"x\", 10)\n          .attr(\"y\", 20)\n          .attr(\"fill\", constants.grey)\n          .attr(\"font-family\", '\"Font Awesome 5 Pro\"')\n          .attr(\"font-size\", \"10px\")\n          .text(\"\\uf017\")\n\n        // Tooltip Created At\n        tooltip\n          .append(\"text\")\n          .attr(\"class\", \"tooltip-created-at\")\n          .attr(\"x\", 10)\n          .attr(\"y\", 45)\n          .attr(\"text-anchor\", \"left\")\n          .attr(\"fill\", \"#444444\")\n          .text(\"ประกาศครั้งที่ 1\")\n\n        // Tooltip nav data\n        tooltip\n          .append(\"text\")\n          .attr(\"x\", 10)\n          .attr(\"y\", 65)\n          .attr(\"class\", \"tooltip-nav\")\n          .attr(\"text-anchor\", \"left\")\n          .text(\"10.2464\")\n\n        // Tooltip Change\n        tooltip\n          .append(\"text\")\n          .attr(\"class\", \"tooltip-change\")\n          .attr(\"x\", 75)\n          .attr(\"y\", 65)\n          .text(\"V 100\")\n\n        // Tooltip Icon Change\n        tooltip\n          .append(\"text\")\n          .attr(\"class\", \"tooltip-change-icon\")\n          .attr(\"x\", 60)\n          .attr(\"y\", 65)\n          .attr(\"font-family\", '\"Font Awesome 5 Pro\"')\n          .attr(\"font-size\", \"12px\")\n          .attr(\"font-weight\", \"bold\")\n      }\n\n      var generateTooltip = function() {\n        // Tooltip background\n        // Tooltip\n        let tooltip = vis\n          .append(\"g\")\n          .attr(\"class\", \"focus-tooltip\")\n          .style(\"display\", \"none\")\n\n        tooltip\n          .append(\"rect\")\n          .attr(\"class\", \"tooltip-rect\")\n          .attr(\"width\", constants.tooltipWidth)\n          .attr(\"height\", constants.tooltipHeight)\n          .attr(\"rx\", 4)\n          .attr(\"ry\", 4)\n\n        // Tooltip date\n        tooltip\n          .append(\"text\")\n          .attr(\"x\", 25)\n          .attr(\"y\", 20)\n          .attr(\"class\", \"tooltip-date\")\n          .attr(\"text-anchor\", \"left\")\n          .attr(\"fill\", constants.grey)\n          .text(\"12/03/07\")\n\n        // Tooltip icon\n        tooltip\n          .append(\"text\")\n          .attr(\"class\", \"tooltip-logo\")\n          .attr(\"x\", 10)\n          .attr(\"y\", 20)\n          .attr(\"fill\", constants.grey)\n          .attr(\"font-family\", '\"Font Awesome 5 Pro\"')\n          .attr(\"font-size\", \"10px\")\n          .text(\"\\uf017\")\n\n        // Tooltip nav data\n        tooltip\n          .append(\"text\")\n          .attr(\"x\", 40)\n          .attr(\"y\", 40)\n          .attr(\"class\", \"tooltip-nav\")\n          .attr(\"text-anchor\", \"left\")\n          .text(\"10.2464\")\n      }\n\n      if (isFirst) {\n        vis\n          .append(\"svg:g\")\n          .attr(\"class\", \"x axis\")\n          .call(xAxis)\n\n        vis\n          .append(\"svg:g\")\n          .attr(\"class\", \"y axis\")\n          .attr(\"transform\", \"translate(-30,-10)\")\n          .attr(\"fill\", \"none\")\n          .call(yAxis)\n\n        vis\n          .append(\"g\")\n          .attr(\"class\", \"grid\")\n          .style(\"opacity\", \".2\")\n          .attr(\"transform\", \"translate(50,0)\")\n          .attr(\"stroke-dasharray\", \"3,3\")\n          .call(\n            make_y_axis()\n              .tickSize(0 + svgWidth, 0, 0)\n              .tickFormat(\"\")\n          )\n\n        // Data Line\n        vis\n          .append(\"path\")\n          .attr(\"class\", \"line-data\")\n          .transition()\n          .duration(100)\n          .attr(\"d\", lineGen(formattedLineData))\n          .attr(\"stroke\", constants.graphColor)\n          .attr(\"stroke-width\", constants.lineStroke)\n          .attr(\"fill\", \"none\")\n\n        // Circle point\n        vis\n          .append(\"svg\")\n          .attr(\"class\", \"point-circle\")\n          .selectAll(\"circle\")\n          .data(formattedLineData)\n          .enter()\n          .append(\"circle\")\n          .attr(\"cx\", d => xRange(d.d))\n          .attr(\"cy\", d => yRange(d.v))\n          .attr(\"r\", constants.circleRadius)\n          .attr(\"fill\", constants.graphColor)\n          .attr(\"class\", \"price-circle\")\n\n        if(this.getGoldCurrentPeriod != \"1D\") vis.selectAll(\".price-circle\").remove()\n\n        // Line on focus\n        vis\n          .append(\"line\")\n          .attr(\"class\", \"focus-line\")\n          .attr(\"y1\", constants.margin.top)\n          .attr(\"y2\", svgHeight - constants.margin.bottom)\n          .attr(\"stroke-width\", constants.focusStroke)\n          .attr(\"stroke\", \"#999999\")\n          .style(\"display\", \"none\")\n\n        // Circle\n        let focusCircle = vis\n          .append(\"g\")\n          .attr(\"class\", \"focus-circle\")\n          .style(\"display\", \"none\")\n\n        // Circle Background\n        focusCircle.append(\"circle\").attr(\"r\", constants.circleRadius + 3)\n\n        // Circle Inside\n        focusCircle\n          .append(\"circle\")\n          .attr(\"class\", \"inner-circle\")\n          .attr(\"r\", constants.circleRadius)\n\n        // focus Tooltip\n        if(this.goldType == \"trader_bar\") generateTooltipDay()\n        generateTooltip()\n\n      } else {\n        // X Axis\n        vis.select(\".x\").call(xAxis)\n\n        vis.selectAll(\".focus-line\").style(\"display\", \"none\")\n\n        vis.selectAll(\".focus-circle\").style(\"display\", \"none\")\n\n        vis.selectAll(\".focus-tooltip-day\").style(\"display\", \"none\")\n\n        vis.selectAll(\".focus-tooltip\").style(\"display\", \"none\")\n\n        vis.selectAll(\".price-circle\").remove()\n\n        if(this.getGoldCurrentPeriod == \"1D\") {\n          vis\n            .select(\".point-circle\")\n            .selectAll(\"circle\")\n            .data(formattedLineData)\n            .enter()\n            .append(\"circle\")\n            .attr(\"cx\", d => xRange(d.d))\n            .attr(\"cy\", d => yRange(d.v))\n            .attr(\"r\", constants.circleRadius)\n            .attr(\"fill\", constants.graphColor)\n            .attr(\"class\", \"price-circle\")\n        }\n\n        // y Axis\n        vis\n          .select(\".y\")\n          .attr(\"fill\", \"none\")\n          .call(yAxis)\n\n        // grid\n        vis\n          .select(\".grid\")\n          .attr(\"class\", \"grid\")\n          .style(\"opacity\", \".2\")\n          .attr(\"transform\", \"translate(50, 0)\")\n          .call(\n            make_y_axis()\n              .tickSize(0 + svgWidth, 0, 0)\n              .tickFormat(\"\")\n          )\n\n        // Data Line\n        vis\n          .select(\".line-data\")\n          .transition()\n          .duration(100)\n          .ease(d3.easeLinear)\n          .attr(\"d\", lineGen(formattedLineData))\n          .attr(\"stroke\", constants.graphColor)\n          .attr(\"stroke-width\", constants.lineStroke)\n          .attr(\"fill\", \"none\")\n\n         \n\n      }\n\n      d3.selectAll(\".domain\").style(\"display\", \"none\")\n\n      // Handling mouse event for focus tooltip\n\n      //cache for performance\n      let elemFocusLine = vis.select(\".focus-line\")\n      let elemFocusCircle = vis.select(\".focus-circle\")\n      let elemFocusTooltip =\n        this.getGoldCurrentPeriod == \"1D\" && this.goldType == \"trader_bar\"\n          ? vis.select(\".focus-tooltip-day\")\n          : vis.select(\".focus-tooltip\")\n      let elemFocusTooltipDate = vis.selectAll(\".tooltip-date\")\n      let elemFocusTooltipNav = vis.selectAll(\".tooltip-nav\")\n      let elemFocusTooltipCreatedAt = vis.select(\".tooltip-created-at\")\n      let elemFocusTooltipChange = vis.select(\".tooltip-change\")\n      let elemFocusTooltipChangeIcon = vis.select(\".tooltip-change-icon\")\n\n      // Helpers function\n      let mouseEvent = {\n        bisectDate: () =>\n          d3.bisector(function(d) {\n            return d.d\n          }).left,\n        mouseOver: () => {\n          elemFocusLine.style(\"display\", null)\n          elemFocusCircle.style(\"display\", null)\n          elemFocusTooltip.style(\"display\", null)\n        },\n        mouseOut: () => {\n          elemFocusLine.style(\"display\", \"none\")\n          elemFocusCircle.style(\"display\", \"none\")\n          elemFocusTooltip.style(\"display\", \"none\")\n        },\n        mouseMove: function() {\n          mouseEvent.handleMove(d3.mouse(this)[0], d3.mouse(this)[1])\n        },\n        touchMove: function() {\n          mouseEvent.handleMove(d3.touches(this)[0][0], d3.touches(this)[0][1])\n        },\n        handleMove: (xPos, yPos) => {\n          elemFocusLine.style(\"display\", null)\n          elemFocusCircle.style(\"display\", null)\n          elemFocusTooltip.style(\"display\", null)\n\n          let x0 = xRange.invert(xPos),\n            i = mouseEvent.bisectDate()(formattedLineData, x0, 1),\n            d0 = formattedLineData[i - 1],\n            d1 = formattedLineData[i]\n\n          if (d0 != null && d1 != null) {\n            let d = x0 > d0.d ? d1 : d0\n            if (xRange(d0.d) == 0 && xRange(x0) < xRange(d1.d) / 2) {\n              d = d0\n            }\n\n            elemFocusLine.attr(\"transform\", \"translate(\" + xRange(d.d) + \",\" + 0 + \")\")\n            elemFocusCircle\n              .attr(\"transform\", \"translate(\" + xRange(d.d) + \",\" + yRange(d.v) + \")\")\n              .attr(\"fill\", constants.graphColor)\n            // Tooltip move\n            // Modify padding for displaying\n            let xPad = 0,\n              yPad = 0\n            if (svgWidth - xRange(d.d) < constants.tooltipWidth) {\n              xPad = -constants.tooltipWidth - constants.driftRightMargin * 2\n            }\n\n            if (svgHeight - constants.margin.bottom - constants.margin.bgTop - yRange(d.v) < constants.tooltipHeight) {\n              yPad = -constants.tooltipHeight / 2\n            }\n\n            if (yRange(d.v) < constants.tooltipHeight) {\n              yPad = constants.tooltipHeight / 2\n            }\n\n            // set tooltip price format\n            elemFocusTooltipNav.text(helpers.numberFormat(d.v))\n            // set tooltip date format\n            elemFocusTooltipDate.text(helpers.getDate(d.d))\n            elemFocusTooltipCreatedAt.text(helpers.announcementFormate(d.t, this.getGoldCurrentPeriod))\n            // set tooltip color price change\n            elemFocusTooltipChange.text(helpers.changeFormat(d.c)).attr(\"fill\", helpers.colorTheme(d.c))\n            elemFocusTooltipChangeIcon.text(helpers.iconPriceChange(d.c)).attr(\"fill\", helpers.colorTheme(d.c))\n\n            // elemFocusTooltip.attr(\"transform\", \"translate(\" + xRange(d.d+xPad) + \",\" + yRange(d.v+yPad) + \")\")\n\n            elemFocusTooltip.attr(\n              \"transform\",\n              \"translate(\" +\n                (xRange(d.d) + xPad + constants.driftRightMargin) +\n                \",\" +\n                (yRange(d.v) + yPad - constants.driftTopMargin) +\n                \")\"\n            )\n          }\n        }\n      }\n\n      if (!isFirst) {\n        vis.select(\".focusing-overlay\").remove()\n      }\n\n      // Overlay Element\n      vis\n        .append(\"rect\")\n        .attr(\"class\", \"focusing-overlay\")\n        .attr(\"fill\", \"none\")\n        .attr(\"pointer-events\", \"all\")\n        .attr(\"y\", constants.margin.bgTop)\n        .attr(\"width\", svgWidth)\n        .attr(\"height\", svgHeight - constants.margin.bottom - constants.margin.bgTop)\n        .on(\"mouseover\", mouseEvent.mouseOver)\n        .on(\"mouseout\", mouseEvent.mouseOut)\n        .on(\"mousemove\", mouseEvent.mouseMove)\n        .on(\"touchmove\", mouseEvent.touchMove, true)\n\n      // Styling\n      // First and last tick\n      let tickUpdate = () => {\n        var fontSize\n        if (svgWidth < 768) {\n          fontSize = \"10px\"\n        } else {\n          fontSize = \"14px\"\n        }\n        vis\n          .selectAll(\".tick text\")\n          .attr(\"x\", constants.tickMoveFactor)\n          .attr(\"y\", 10)\n          .attr(\"font-family\", '\"DBHeaventRez\"')\n          .style(\"font-size\", fontSize)\n          .attr(\"fill\", constants.grey)\n\n        vis.selectAll(\".x .tick text\").attr(\"x\", 0)\n        // vis.selectAll(\".x .tick:nth-of-type(2) text\").attr(\"x\", 0);\n\n        vis.selectAll(\".x .tick text\").attr(\"y\", this.graphHeight())\n\n        vis.selectAll(\".y .tick text\").style(\"font-size\", fontSize)\n\n        vis\n          .selectAll(\".x-axis-line\")\n          .attr(\"x1\", 0)\n          .attr(\"x2\", svgWidth)\n          .attr(\"y1\", svgHeight)\n          .attr(\"y2\", svgHeight)\n          .style(\"font-size\", fontSize)\n\n        vis\n          .selectAll(\".focus-line\")\n          .attr(\"y1\", constants.margin.top)\n          .attr(\"y2\", svgHeight)\n\n        document.getElementById(\"gold-graph-d3-line\").style.height = this.graphHeight() + 20 + \"px\"\n      }\n\n      tickUpdate()\n\n      // Inner circle focusing\n      vis.select(\".inner-circle\").attr(\"fill\", \"white\")\n\n      // Responsive Event for graph and axis\n      let updateAxisAndGraph = () => {\n        vis.select(\".x\").call(xAxis)\n\n        vis\n          .select(\".y\")\n          .attr(\"fill\", \"none\")\n          .attr(\"transform\", \"translate(-20, 0)\")\n          .call(yAxis)\n\n        // Update Position and Data Line\n        vis.select(\".line-data\").attr(\"d\", lineGen(formattedLineData))\n\n        if (this.getGoldCurrentPeriod == \"1D\") {\n          // Update Position and Data circle\n          vis\n            .selectAll(\".price-circle\")\n            .data(formattedLineData)\n            .attr(\"cx\", function(d) {\n              return xRange(d.d)\n            })\n            .attr(\"cy\", function(d) {\n              return yRange(d.v)\n            })\n        } else {\n          // Hide Position and Data circle\n          vis.selectAll(\".price-circle\").attr(\"display\", \"none\")\n        }\n\n        vis\n          .select(\".grid\")\n          .attr(\"class\", \"grid\")\n          .style(\"opacity\", \".2\")\n          .attr(\"transform\", \"translate(50, 0)\")\n          .call(\n            make_y_axis()\n              .tickSize(0 + svgWidth, 0, 0)\n              .tickFormat(\"\")\n          )\n      }\n\n      if (!isFirst) {\n        d3.select(window).on(\"resize\", null)\n      }\n\n      d3.select(window).on(\"resize\", () => {\n        sizeUpdate()\n        rangeUpdate()\n        axisUpdate()\n        updateAxisAndGraph()\n        tickUpdate()\n      })\n    },\n    callProfessionalGraph() {\n      this.$emit(\"call-tradingview\", true)\n    }\n  }\n}\n</script>\n\n<style lang=\"scss\">\n.tooltip-rect {\n  fill: #ffffff;\n  fill-opacity: 1;\n  stroke: rgba(186, 186, 186, 0.24);\n  stroke-width: 1px;\n}\n.tooltip-nav {\n  fill: #444444;\n  @extend %font-size-sss;\n  font-weight: bold;\n  text-anchor: left;\n}\n.tooltip-change {\n  @extend %font-size-sss;\n  font-weight: bold;\n}\n.tooltip-date {\n  fill: #979797;\n  @extend %font-size-sss;\n}\n.tooltip-created-at {\n  fill: #444444;\n  @extend %font-size-sss;\n}\n\n.ctn-graph-professional {\n  @include finRippleBtn(#f4f4f4, #f4f4f4, $color-normal-text);\n  @extend %font-size-ss;\n  padding: 5px 19px;\n  text-decoration: none;\n  font-weight: bold;\n  border-radius: 4px;\n  i {\n    pointer-events: none;\n    margin-right: 4px;\n  }\n}\n.professional-btn-center {\n  margin-top: 25px;\n  text-align: center;\n}\n\n.blink {\n  animation: blinker 1s cubic-bezier(0.5, 0, 1, 1) infinite alternate;\n}\n@keyframes blinker {\n  from {\n    // opacity: 1;\n    stroke-opacity: 0.8;\n  }\n  to {\n    // opacity: 0;\n    stroke-opacity: 0;\n  }\n}\n</style>","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GoldGraphNav.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GoldGraphNav.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./GoldGraphNav.vue?vue&type=template&id=3d7a8cb0&\"\nimport script from \"./GoldGraphNav.vue?vue&type=script&lang=js&\"\nexport * from \"./GoldGraphNav.vue?vue&type=script&lang=js&\"\nimport style0 from \"./GoldGraphNav.vue?vue&type=style&index=0&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","'use strict';\n\nexports.decode = exports.parse = require('./decode');\nexports.encode = exports.stringify = require('./encode');\n","// Copyright Joyent, Inc. and other Node contributors.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a\n// copy of this software and associated documentation files (the\n// \"Software\"), to deal in the Software without restriction, including\n// without limitation the rights to use, copy, modify, merge, publish,\n// distribute, sublicense, and/or sell copies of the Software, and to permit\n// persons to whom the Software is furnished to do so, subject to the\n// following conditions:\n//\n// The above copyright notice and this permission notice shall be included\n// in all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS\n// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF\n// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN\n// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,\n// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR\n// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE\n// USE OR OTHER DEALINGS IN THE SOFTWARE.\n\n'use strict';\n\nvar stringifyPrimitive = function(v) {\n  switch (typeof v) {\n    case 'string':\n      return v;\n\n    case 'boolean':\n      return v ? 'true' : 'false';\n\n    case 'number':\n      return isFinite(v) ? v : '';\n\n    default:\n      return '';\n  }\n};\n\nmodule.exports = function(obj, sep, eq, name) {\n  sep = sep || '&';\n  eq = eq || '=';\n  if (obj === null) {\n    obj = undefined;\n  }\n\n  if (typeof obj === 'object') {\n    return map(objectKeys(obj), function(k) {\n      var ks = encodeURIComponent(stringifyPrimitive(k)) + eq;\n      if (isArray(obj[k])) {\n        return map(obj[k], function(v) {\n          return ks + encodeURIComponent(stringifyPrimitive(v));\n        }).join(sep);\n      } else {\n        return ks + encodeURIComponent(stringifyPrimitive(obj[k]));\n      }\n    }).join(sep);\n\n  }\n\n  if (!name) return '';\n  return encodeURIComponent(stringifyPrimitive(name)) + eq +\n         encodeURIComponent(stringifyPrimitive(obj));\n};\n\nvar isArray = Array.isArray || function (xs) {\n  return Object.prototype.toString.call(xs) === '[object Array]';\n};\n\nfunction map (xs, f) {\n  if (xs.map) return xs.map(f);\n  var res = [];\n  for (var i = 0; i < xs.length; i++) {\n    res.push(f(xs[i], i));\n  }\n  return res;\n}\n\nvar objectKeys = Object.keys || function (obj) {\n  var res = [];\n  for (var key in obj) {\n    if (Object.prototype.hasOwnProperty.call(obj, key)) res.push(key);\n  }\n  return res;\n};\n"],"sourceRoot":""}