This repository was archived by the owner on Jul 30, 2025. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathdefault-plnkr.json
More file actions
1 lines (1 loc) · 43.9 KB
/
default-plnkr.json
File metadata and controls
1 lines (1 loc) · 43.9 KB
1
{"index.css":"","default-data":"export let bitCoinData: object[] = [\r\n { x: new Date('2017-05-01'), y: 1402.08 },\r\n { x: new Date('2017-05-02'), y: 1443.68 },\r\n { x: new Date('2017-05-03'), y: 1492 },\r\n { x: new Date('2017-05-04'), y: 1515.63 },\r\n { x: new Date('2017-05-05'), y: 1512.21 },\r\n { x: new Date('2017-05-06'), y: 1548.29 },\r\n { x: new Date('2017-05-07'), y: 1555.47 },\r\n { x: new Date('2017-05-08'), y: 1639.32 },\r\n { x: new Date('2017-05-09'), y: 1706.93 },\r\n { x: new Date('2017-05-10'), y: 1756.8 },\r\n { x: new Date('2017-05-11'), y: 1807.37 },\r\n { x: new Date('2017-05-12'), y: 1676.99 },\r\n { x: new Date('2017-05-13'), y: 1759.96 },\r\n { x: new Date('2017-05-14'), y: 1772.42 },\r\n { x: new Date('2017-05-15'), y: 1697.38 },\r\n { x: new Date('2017-05-16'), y: 1718.2 },\r\n { x: new Date('2017-05-17'), y: 1802.16 },\r\n { x: new Date('2017-05-18'), y: 1887.33 },\r\n { x: new Date('2017-05-19'), y: 1968.1 },\r\n { x: new Date('2017-05-20'), y: 2051.73 },\r\n { x: new Date('2017-05-21'), y: 2055.62 },\r\n { x: new Date('2017-05-22'), y: 2139.03 },\r\n { x: new Date('2017-05-23'), y: 2291.48 },\r\n { x: new Date('2017-05-24'), y: 2476.3 },\r\n { x: new Date('2017-05-25'), y: 2357.5 },\r\n { x: new Date('2017-05-26'), y: 2247.48 },\r\n { x: new Date('2017-05-27'), y: 2106.31 },\r\n { x: new Date('2017-05-28'), y: 2207.58 },\r\n { x: new Date('2017-05-29'), y: 2289.87 },\r\n { x: new Date('2017-05-30'), y: 2197.23 },\r\n { x: new Date('2017-05-31'), y: 2330.23 },\r\n { x: new Date('2017-06-01'), y: 2452.18 },\r\n { x: new Date('2017-06-02'), y: 2517.41 },\r\n { x: new Date('2017-06-03'), y: 2555.65 },\r\n { x: new Date('2017-06-04'), y: 2552.81 },\r\n { x: new Date('2017-06-05'), y: 2736.59 },\r\n { x: new Date('2017-06-06'), y: 2914.08 },\r\n { x: new Date('2017-06-07'), y: 2694.22 },\r\n { x: new Date('2017-06-08'), y: 2825.03 },\r\n { x: new Date('2017-06-09'), y: 2826.7 },\r\n { x: new Date('2017-06-10'), y: 2942.34 },\r\n { x: new Date('2017-06-11'), y: 3018.54 },\r\n { x: new Date('2017-06-12'), y: 2682.59 },\r\n { x: new Date('2017-06-13'), y: 2738.93 },\r\n { x: new Date('2017-06-14'), y: 2494.48 },\r\n { x: new Date('2017-06-15'), y: 2456.92 },\r\n { x: new Date('2017-06-16'), y: 2528.1 },\r\n { x: new Date('2017-06-17'), y: 2664 },\r\n { x: new Date('2017-06-18'), y: 2576.17 },\r\n { x: new Date('2017-06-19'), y: 2641.66 },\r\n { x: new Date('2017-06-20'), y: 2778.83 },\r\n { x: new Date('2017-06-21'), y: 2712.16 },\r\n { x: new Date('2017-06-22'), y: 2740.79 },\r\n { x: new Date('2017-06-23'), y: 2738.22 },\r\n { x: new Date('2017-06-24'), y: 2619.12 },\r\n { x: new Date('2017-06-25'), y: 2594.45 },\r\n { x: new Date('2017-06-26'), y: 2485.36 },\r\n { x: new Date('2017-06-27'), y: 2593.17 },\r\n { x: new Date('2017-06-28'), y: 2584.56 },\r\n { x: new Date('2017-06-29'), y: 2561.56 },\r\n { x: new Date('2017-06-30'), y: 2499.98 },\r\n { x: new Date('2017-07-01'), y: 2460.2 },\r\n { x: new Date('2017-07-02'), y: 2529.78 },\r\n { x: new Date('2017-07-03'), y: 2581.07 },\r\n { x: new Date('2017-07-04'), y: 2625.07 },\r\n { x: new Date('2017-07-05'), y: 2629.27 },\r\n { x: new Date('2017-07-06'), y: 2619.11 },\r\n { x: new Date('2017-07-07'), y: 2521.24 },\r\n { x: new Date('2017-07-08'), y: 2579.93 },\r\n { x: new Date('2017-07-09'), y: 2525.67 },\r\n { x: new Date('2017-07-10'), y: 2371.96 },\r\n { x: new Date('2017-07-11'), y: 2332.19 },\r\n { x: new Date('2017-07-12'), y: 2423.16 },\r\n { x: new Date('2017-07-13'), y: 2364.52 },\r\n { x: new Date('2017-07-14'), y: 2232.65 },\r\n { x: new Date('2017-07-15'), y: 1993.26 },\r\n { x: new Date('2017-07-16'), y: 1938.94 },\r\n { x: new Date('2017-07-17'), y: 2244.26 },\r\n { x: new Date('2017-07-18'), y: 2327.9 },\r\n { x: new Date('2017-07-19'), y: 2294.4 },\r\n { x: new Date('2017-07-20'), y: 2877.39 },\r\n { x: new Date('2017-07-21'), y: 2694.29 },\r\n { x: new Date('2017-07-22'), y: 2838.81 },\r\n { x: new Date('2017-07-23'), y: 2762.63 },\r\n { x: new Date('2017-07-24'), y: 2779.04 },\r\n { x: new Date('2017-07-25'), y: 2591.22 },\r\n { x: new Date('2017-07-26'), y: 2550.18 },\r\n { x: new Date('2017-07-27'), y: 2697.47 },\r\n { x: new Date('2017-07-28'), y: 2805.18 },\r\n { x: new Date('2017-07-29'), y: 2720.08 },\r\n { x: new Date('2017-07-30'), y: 2746.33 },\r\n { x: new Date('2017-07-31'), y: 2873.83 },\r\n { x: new Date('2017-08-01'), y: 2735.59 },\r\n { x: new Date('2017-08-02'), y: 2723.58 },\r\n { x: new Date('2017-08-03'), y: 2814.36 },\r\n { x: new Date('2017-08-04'), y: 2883.68 },\r\n { x: new Date('2017-08-05'), y: 3301.76 },\r\n { x: new Date('2017-08-06'), y: 3255 },\r\n { x: new Date('2017-08-07'), y: 3431.97 },\r\n { x: new Date('2017-08-08'), y: 3453.16 },\r\n { x: new Date('2017-08-09'), y: 3377.54 },\r\n { x: new Date('2017-08-10'), y: 3445.28 },\r\n { x: new Date('2017-08-11'), y: 3679.61 },\r\n { x: new Date('2017-08-12'), y: 3917.65 },\r\n { x: new Date('2017-08-13'), y: 4111.2 },\r\n { x: new Date('2017-08-14'), y: 4382.74 },\r\n { x: new Date('2017-08-15'), y: 4204.43 },\r\n { x: new Date('2017-08-16'), y: 4425.3 },\r\n { x: new Date('2017-08-17'), y: 4316.34 },\r\n { x: new Date('2017-08-18'), y: 4159.46 },\r\n { x: new Date('2017-08-19'), y: 4206.13 },\r\n { x: new Date('2017-08-20'), y: 4111.22 },\r\n { x: new Date('2017-08-21'), y: 4054.94 },\r\n { x: new Date('2017-08-22'), y: 4137.67 },\r\n { x: new Date('2017-08-23'), y: 4191.22 },\r\n { x: new Date('2017-08-24'), y: 4362.47 },\r\n { x: new Date('2017-08-25'), y: 4408.32 },\r\n { x: new Date('2017-08-26'), y: 4387.46 },\r\n { x: new Date('2017-08-27'), y: 4394.51 },\r\n { x: new Date('2017-08-28'), y: 4439.66 },\r\n { x: new Date('2017-08-29'), y: 4648.13 },\r\n { x: new Date('2017-08-30'), y: 4630.73 },\r\n { x: new Date('2017-08-31'), y: 4764.87 },\r\n { x: new Date('2017-09-01'), y: 4950.72 },\r\n { x: new Date('2017-09-02'), y: 4643.97 },\r\n { x: new Date('2017-09-03'), y: 4631.69 },\r\n { x: new Date('2017-09-04'), y: 4319.72 },\r\n { x: new Date('2017-09-05'), y: 4422.12 },\r\n { x: new Date('2017-09-06'), y: 4626.72 },\r\n { x: new Date('2017-09-07'), y: 4638.1 },\r\n { x: new Date('2017-09-08'), y: 4317.54 },\r\n { x: new Date('2017-09-09'), y: 4291.88 },\r\n { x: new Date('2017-09-10'), y: 4191.17 },\r\n { x: new Date('2017-09-11'), y: 4188.84 },\r\n { x: new Date('2017-09-12'), y: 4148.27 },\r\n { x: new Date('2017-09-13'), y: 3874.26 },\r\n { x: new Date('2017-09-14'), y: 3226.41 },\r\n { x: new Date('2017-09-15'), y: 3686.9 },\r\n { x: new Date('2017-09-16'), y: 3678.74 },\r\n { x: new Date('2017-09-17'), y: 3672.57 },\r\n { x: new Date('2017-09-18'), y: 4067.08 },\r\n { x: new Date('2017-09-19'), y: 3897 },\r\n { x: new Date('2017-09-20'), y: 3858.09 },\r\n { x: new Date('2017-09-21'), y: 3612.68 },\r\n { x: new Date('2017-09-22'), y: 3603.31 },\r\n { x: new Date('2017-09-23'), y: 3777.29 },\r\n { x: new Date('2017-09-24'), y: 3662.12 },\r\n { x: new Date('2017-09-25'), y: 3927.5 },\r\n { x: new Date('2017-09-26'), y: 3895.51 },\r\n { x: new Date('2017-09-27'), y: 4208.56 },\r\n { x: new Date('2017-09-28'), y: 4185.29 },\r\n { x: new Date('2017-09-29'), y: 4164.1 },\r\n { x: new Date('2017-09-30'), y: 4353.05 },\r\n { x: new Date('2017-10-01'), y: 4394.64 },\r\n { x: new Date('2017-10-02'), y: 4404.1 },\r\n { x: new Date('2017-10-03'), y: 4320.09 },\r\n { x: new Date('2017-10-04'), y: 4225.92 },\r\n { x: new Date('2017-10-05'), y: 4322.75 },\r\n { x: new Date('2017-10-06'), y: 4370.24 },\r\n { x: new Date('2017-10-07'), y: 4437.03 },\r\n { x: new Date('2017-10-08'), y: 4596.96 },\r\n { x: new Date('2017-10-09'), y: 4772.97 },\r\n { x: new Date('2017-10-10'), y: 4754.7 },\r\n { x: new Date('2017-10-11'), y: 4830.77 },\r\n { x: new Date('2017-10-12'), y: 5439.13 },\r\n { x: new Date('2017-10-13'), y: 5640.13 },\r\n { x: new Date('2017-10-14'), y: 5809.69 },\r\n { x: new Date('2017-10-15'), y: 5697.39 },\r\n { x: new Date('2017-10-16'), y: 5754.22 },\r\n { x: new Date('2017-10-17'), y: 5595.23 },\r\n { x: new Date('2017-10-18'), y: 5572.2 },\r\n { x: new Date('2017-10-19'), y: 5699.58 },\r\n { x: new Date('2017-10-20'), y: 5984.09 },\r\n { x: new Date('2017-10-21'), y: 6013.23 },\r\n { x: new Date('2017-10-22'), y: 5984.96 },\r\n { x: new Date('2017-10-23'), y: 5895.3 },\r\n { x: new Date('2017-10-24'), y: 5518.85 },\r\n { x: new Date('2017-10-25'), y: 5733.9 },\r\n { x: new Date('2017-10-26'), y: 5888.14 },\r\n { x: new Date('2017-10-27'), y: 5767.68 },\r\n { x: new Date('2017-10-28'), y: 5732.82 },\r\n { x: new Date('2017-10-29'), y: 6140.53 },\r\n { x: new Date('2017-10-30'), y: 6121.8 },\r\n { x: new Date('2017-10-31'), y: 6447.67 },\r\n { x: new Date('2017-11-01'), y: 6750.17 },\r\n { x: new Date('2017-11-02'), y: 7030 },\r\n { x: new Date('2017-11-03'), y: 7161.45 },\r\n { x: new Date('2017-11-04'), y: 7387 },\r\n { x: new Date('2017-11-05'), y: 7382.45 },\r\n { x: new Date('2017-11-06'), y: 6958.21 },\r\n { x: new Date('2017-11-07'), y: 7118.8 },\r\n { x: new Date('2017-11-08'), y: 7458.79 },\r\n { x: new Date('2017-11-09'), y: 7146.78 },\r\n { x: new Date('2017-11-10'), y: 6570.31 },\r\n { x: new Date('2017-11-11'), y: 6337 },\r\n { x: new Date('2017-11-12'), y: 5857.32 },\r\n { x: new Date('2017-11-13'), y: 6517.68 },\r\n { x: new Date('2017-11-14'), y: 6598.77 },\r\n { x: new Date('2017-11-15'), y: 7279 },\r\n { x: new Date('2017-11-16'), y: 7843.94 },\r\n { x: new Date('2017-11-17'), y: 7689.91 },\r\n { x: new Date('2017-11-18'), y: 7776.94 },\r\n { x: new Date('2017-11-19'), y: 8033.94 },\r\n { x: new Date('2017-11-20'), y: 8238.2 },\r\n { x: new Date('2017-11-21'), y: 8095.59 },\r\n { x: new Date('2017-11-22'), y: 8230.69 },\r\n { x: new Date('2017-11-23'), y: 8002.64 },\r\n { x: new Date('2017-11-24'), y: 8201.46 },\r\n { x: new Date('2017-11-25'), y: 8763.78 },\r\n { x: new Date('2017-11-26'), y: 9326.59 },\r\n { x: new Date('2017-11-27'), y: 9739.05 },\r\n { x: new Date('2017-11-28'), y: 9908.23 },\r\n { x: new Date('2017-11-29'), y: 9816.35 },\r\n { x: new Date('2017-11-30'), y: 9916.54 },\r\n { x: new Date('2017-12-01'), y: 10859.56 },\r\n { x: new Date('2017-12-02'), y: 10895.01 },\r\n { x: new Date('2017-12-03'), y: 11180.89 },\r\n { x: new Date('2017-12-04'), y: 11616.85 },\r\n { x: new Date('2017-12-05'), y: 11696.06 },\r\n { x: new Date('2017-12-06'), y: 13708.99 },\r\n { x: new Date('2017-12-07'), y: 16858.02 },\r\n { x: new Date('2017-12-08'), y: 16057.14 },\r\n { x: new Date('2017-12-09'), y: 14913.4 },\r\n { x: new Date('2017-12-10'), y: 15036.96 },\r\n { x: new Date('2017-12-11'), y: 16699.68 },\r\n { x: new Date('2017-12-12'), y: 17178.1 },\r\n { x: new Date('2017-12-13'), y: 16407.2 },\r\n { x: new Date('2017-12-14'), y: 16531.08 },\r\n { x: new Date('2017-12-15'), y: 17601.94 },\r\n { x: new Date('2017-12-16'), y: 19343.04 },\r\n { x: new Date('2017-12-17'), y: 19086.64 },\r\n { x: new Date('2017-12-18'), y: 18960.52 },\r\n { x: new Date('2017-12-19'), y: 17608.35 },\r\n { x: new Date('2017-12-20'), y: 16454.72 },\r\n { x: new Date('2017-12-21'), y: 15561.05 },\r\n { x: new Date('2017-12-22'), y: 13857.14 },\r\n { x: new Date('2017-12-23'), y: 14548.71 },\r\n { x: new Date('2017-12-24'), y: 13975.44 },\r\n { x: new Date('2017-12-25'), y: 13917.03 },\r\n { x: new Date('2017-12-26'), y: 15745.26 },\r\n { x: new Date('2017-12-27'), y: 15378.28 },\r\n { x: new Date('2017-12-28'), y: 14428.76 },\r\n { x: new Date('2017-12-29'), y: 14427.87 },\r\n { x: new Date('2017-12-30'), y: 12629.81 },\r\n { x: new Date('2017-12-31'), y: 13860.14 },\r\n { x: new Date('2018-01-01'), y: 13412.44 },\r\n { x: new Date('2018-01-02'), y: 14740.76 },\r\n { x: new Date('2018-01-03'), y: 15134.65 },\r\n { x: new Date('2018-01-04'), y: 15155.23 },\r\n { x: new Date('2018-01-05'), y: 16937.17 },\r\n { x: new Date('2018-01-06'), y: 17135.84 },\r\n { x: new Date('2018-01-07'), y: 16178.49 },\r\n { x: new Date('2018-01-08'), y: 14970.36 },\r\n { x: new Date('2018-01-09'), y: 14439.47 },\r\n { x: new Date('2018-01-10'), y: 14890.72 },\r\n { x: new Date('2018-01-11'), y: 13287.26 },\r\n { x: new Date('2018-01-12'), y: 13812.71 },\r\n { x: new Date('2018-01-13'), y: 14188.78 },\r\n { x: new Date('2018-01-14'), y: 13619.03 },\r\n { x: new Date('2018-01-15'), y: 13585.9 },\r\n { x: new Date('2018-01-16'), y: 11348.02 },\r\n { x: new Date('2018-01-17'), y: 11141.25 },\r\n { x: new Date('2018-01-18'), y: 11250.65 },\r\n { x: new Date('2018-01-19'), y: 11514.92 },\r\n { x: new Date('2018-01-20'), y: 12759.64 },\r\n { x: new Date('2018-01-21'), y: 11522.86 },\r\n { x: new Date('2018-01-22'), y: 10772.15 },\r\n { x: new Date('2018-01-23'), y: 10839.83 },\r\n { x: new Date('2018-01-24'), y: 11399.52 },\r\n { x: new Date('2018-01-25'), y: 11137.24 },\r\n { x: new Date('2018-01-26'), y: 11090.06 },\r\n { x: new Date('2018-01-27'), y: 11407.15 },\r\n { x: new Date('2018-01-28'), y: 11694.47 },\r\n { x: new Date('2018-01-29'), y: 11158.39 },\r\n { x: new Date('2018-01-30'), y: 10035 },\r\n { x: new Date('2018-01-31'), y: 10166.51 },\r\n { x: new Date('2018-02-01'), y: 9052.58 },\r\n { x: new Date('2018-02-02'), y: 8827.63 },\r\n { x: new Date('2018-02-03'), y: 9224.39 },\r\n { x: new Date('2018-02-04'), y: 8186.65 },\r\n { x: new Date('2018-02-05'), y: 6914.26 },\r\n { x: new Date('2018-02-06'), y: 7700.39 },\r\n { x: new Date('2018-02-07'), y: 7581.8 },\r\n { x: new Date('2018-02-08'), y: 8237.24 },\r\n { x: new Date('2018-02-09'), y: 8689.84 },\r\n { x: new Date('2018-02-10'), y: 8556.61 },\r\n { x: new Date('2018-02-11'), y: 8070.8 },\r\n { x: new Date('2018-02-12'), y: 8891.21 },\r\n { x: new Date('2018-02-13'), y: 8516.24 },\r\n { x: new Date('2018-02-14'), y: 9477.84 },\r\n { x: new Date('2018-02-15'), y: 10016.49 },\r\n { x: new Date('2018-02-16'), y: 10178.71 },\r\n { x: new Date('2018-02-17'), y: 11092.15 },\r\n { x: new Date('2018-02-18'), y: 10396.63 },\r\n { x: new Date('2018-02-19'), y: 11159.72 },\r\n { x: new Date('2018-02-20'), y: 11228.24 },\r\n { x: new Date('2018-02-21'), y: 10456.17 },\r\n { x: new Date('2018-02-22'), y: 9830.43 },\r\n { x: new Date('2018-02-23'), y: 10149.46 },\r\n { x: new Date('2018-02-24'), y: 9682.38 },\r\n { x: new Date('2018-02-25'), y: 9586.46 },\r\n { x: new Date('2018-02-26'), y: 10313.08 },\r\n { x: new Date('2018-02-27'), y: 10564.42 },\r\n { x: new Date('2018-02-28'), y: 10309.64 },\r\n { x: new Date('2018-03-01'), y: 10907.59 },\r\n { x: new Date('2018-03-02'), y: 11019.52 },\r\n { x: new Date('2018-03-03'), y: 11438.65 },\r\n { x: new Date('2018-03-04'), y: 11479.73 },\r\n { x: new Date('2018-03-05'), y: 11432.98 },\r\n { x: new Date('2018-03-06'), y: 10709.53 },\r\n { x: new Date('2018-03-07'), y: 9906.8 },\r\n { x: new Date('2018-03-08'), y: 9299.28 },\r\n { x: new Date('2018-03-09'), y: 9237.05 },\r\n { x: new Date('2018-03-10'), y: 8787.16 },\r\n { x: new Date('2018-03-11'), y: 9532.74 },\r\n { x: new Date('2018-03-12'), y: 9118.27 },\r\n { x: new Date('2018-03-13'), y: 9144.15 },\r\n { x: new Date('2018-03-14'), y: 8196.9 },\r\n { x: new Date('2018-03-15'), y: 8256.99 },\r\n { x: new Date('2018-03-16'), y: 8269.33 },\r\n { x: new Date('2018-03-17'), y: 7862.11 },\r\n { x: new Date('2018-03-18'), y: 8196.02 },\r\n { x: new Date('2018-03-19'), y: 8594.19 },\r\n { x: new Date('2018-03-20'), y: 8915.9 },\r\n { x: new Date('2018-03-21'), y: 8895.4 },\r\n { x: new Date('2018-03-22'), y: 8712.89 },\r\n { x: new Date('2018-03-23'), y: 8918.74 },\r\n { x: new Date('2018-03-24'), y: 8535.89 },\r\n { x: new Date('2018-03-25'), y: 8449.83 },\r\n { x: new Date('2018-03-26'), y: 8138.34 },\r\n { x: new Date('2018-03-27'), y: 7790.16 },\r\n { x: new Date('2018-03-28'), y: 7937.2 },\r\n { x: new Date('2018-03-29'), y: 7086.49 },\r\n { x: new Date('2018-03-30'), y: 6844.32 },\r\n { x: new Date('2018-03-31'), y: 6926.02 },\r\n { x: new Date('2018-04-01'), y: 6816.74 },\r\n { x: new Date('2018-04-02'), y: 7049.79 },\r\n { x: new Date('2018-04-03'), y: 7417.89 },\r\n { x: new Date('2018-04-04'), y: 6789.3 },\r\n { x: new Date('2018-04-05'), y: 6774.75 },\r\n { x: new Date('2018-04-06'), y: 6620.41 },\r\n { x: new Date('2018-04-07'), y: 6896.28 },\r\n { x: new Date('2018-04-08'), y: 7022.71 },\r\n { x: new Date('2018-04-09'), y: 6773.94 },\r\n { x: new Date('2018-04-10'), y: 6830.9 },\r\n { x: new Date('2018-04-11'), y: 6939.55 },\r\n { x: new Date('2018-04-12'), y: 7916.37 },\r\n { x: new Date('2018-04-13'), y: 7889.23 },\r\n { x: new Date('2018-04-14'), y: 8003.68 },\r\n { x: new Date('2018-04-15'), y: 8357.04 },\r\n { x: new Date('2018-04-16'), y: 8051.34 },\r\n { x: new Date('2018-04-17'), y: 7890.15 },\r\n { x: new Date('2018-04-18'), y: 8163.69 },\r\n { x: new Date('2018-04-19'), y: 8273.74 },\r\n { x: new Date('2018-04-20'), y: 8863.5 },\r\n { x: new Date('2018-04-21'), y: 8917.6 },\r\n { x: new Date('2018-04-22'), y: 8792.83 },\r\n { x: new Date('2018-04-23'), y: 8938.3 },\r\n { x: new Date('2018-04-24'), y: 9652.16 },\r\n { x: new Date('2018-04-25'), y: 8864.09 },\r\n { x: new Date('2018-04-26'), y: 9279 },\r\n { x: new Date('2018-04-27'), y: 8978.33 },\r\n { x: new Date('2018-04-28'), y: 9342.47 },\r\n { x: new Date('2018-04-29'), y: 9392.03 },\r\n { x: new Date('2018-04-30'), y: 9244.32 }\r\n]","systemjs.config.js":"System.config({\r\n transpiler: \"ts\",\r\n typescriptOptions: {\r\n target: \"es5\",\r\n module: \"commonjs\",\r\n moduleResolution: \"node\",\r\n emitDecoratorMetadata: true,\r\n experimentalDecorators: true,\r\n \"jsx\": \"react\"\r\n },\r\n meta: {\r\n 'typescript': {\r\n \"exports\": \"ts\"\r\n },\r\n '*.json': { loader: 'plugin-json' }\r\n },\r\n paths: {\r\n \"syncfusion:\": \"http://cdn.syncfusion.com/ej2/\"},\r\n map: {\r\n app: 'app',\r\n ts: \"https://unpkg.com/plugin-typescript@4.0.10/lib/plugin.js\",\r\n typescript: \"https://unpkg.com/typescript@2.2.2/lib/typescript.js\",\r\n \"plugin-json\":\"https://cdnjs.cloudflare.com/ajax/libs/systemjs-plugin-json/0.3.0/json.min.js\",\r\n \"@syncfusion/ej2-base\": \"syncfusion:ej2-base/dist/ej2-base.umd.min.js\",\r\n \"@syncfusion/ej2-buttons\": \"syncfusion:ej2-buttons/dist/ej2-buttons.umd.min.js\",\r\n \"@syncfusion/ej2-splitbuttons\": \"syncfusion:ej2-splitbuttons/dist/ej2-splitbuttons.umd.min.js\",\r\n \"@syncfusion/ej2-charts\": \"syncfusion:ej2-charts/dist/ej2-charts.umd.min.js\",\r\n \"@syncfusion/ej2-maps\": \"syncfusion:ej2-maps/dist/ej2-maps.umd.min.js\",\r\n \"@syncfusion/ej2-treemap\": \"syncfusion:ej2-treemap/dist/ej2-treemap.umd.min.js\",\r\n \"@syncfusion/ej2-circulargauge\": \"syncfusion:ej2-circulargauge/dist/ej2-circulargauge.umd.min.js\",\r\n \"@syncfusion/ej2-lineargauge\": \"syncfusion:ej2-lineargauge/dist/ej2-lineargauge.umd.min.js\",\r\n \"@syncfusion/ej2-calendars\": \"syncfusion:ej2-calendars/dist/ej2-calendars.umd.min.js\",\r\n \"@syncfusion/ej2-data\": \"syncfusion:ej2-data/dist/ej2-data.umd.min.js\",\r\n \"@syncfusion/ej2-dropdowns\": \"syncfusion:ej2-dropdowns/dist/ej2-dropdowns.umd.min.js\",\r\n \"@syncfusion/ej2-grids\": \"syncfusion:ej2-grids/dist/ej2-grids.umd.min.js\",\r\n \"@syncfusion/ej2-lists\": \"syncfusion:ej2-lists/dist/ej2-lists.umd.min.js\",\r\n \"@syncfusion/ej2-inputs\": \"syncfusion:ej2-inputs/dist/ej2-inputs.umd.min.js\",\r\n \"@syncfusion/ej2-navigations\": \"syncfusion:ej2-navigations/dist/ej2-navigations.umd.min.js\",\r\n \"@syncfusion/ej2-popups\": \"syncfusion:ej2-popups/dist/ej2-popups.umd.min.js\",\r\n \"@syncfusion/ej2-schedule\": \"syncfusion:ej2-schedule/dist/ej2-schedule.umd.min.js\",\r\n \"@syncfusion/ej2-pdf-export\": \"syncfusion:ej2-pdf-export/dist/ej2-pdf-export.umd.min.js\", \r\n \"@syncfusion/ej2-compression\": \"syncfusion:ej2-compression/dist/ej2-compression.umd.min.js\",\r\n \"@syncfusion/ej2-excel-export\": \"syncfusion:ej2-excel-export/dist/ej2-excel-export.umd.min.js\", \r\n \"@syncfusion/ej2-file-utils\": \"syncfusion:ej2-file-utils/dist/ej2-file-utils.umd.min.js\",\r\n \"@syncfusion/ej2-documenteditor\": \"syncfusion:ej2-documenteditor/dist/ej2-documenteditor.umd.min.js\",\r\n \"@syncfusion/ej2-notifications\": \"syncfusion:ej2-notifications/dist/ej2-notifications.umd.min.js\",\r\n \"@syncfusion/ej2-richtexteditor\": \"syncfusion:ej2-richtexteditor/dist/ej2-richtexteditor.umd.min.js\",\r\n\t\t\"@syncfusion/ej2-svg-base\": \"syncfusion:ej2-svg-base/dist/ej2-svg-base.umd.min.js\",\r\n \"@syncfusion/ej2-pivotview\": \"syncfusion:ej2-pivotview/dist/ej2-pivotview.umd.min.js\",\r\n \"@syncfusion/ej2-heatmap\": \"syncfusion:ej2-heatmap/dist/ej2-heatmap.umd.min.js\",\r\n \"@syncfusion/ej2-react-base\": \"syncfusion:ej2-react-base/dist/ej2-react-base.umd.min.js\",\r\n \"@syncfusion/ej2-react-buttons\": \"syncfusion:ej2-react-buttons/dist/ej2-react-buttons.umd.min.js\",\r\n \"@syncfusion/ej2-react-splitbuttons\": \"syncfusion:ej2-react-splitbuttons/dist/ej2-react-splitbuttons.umd.min.js\",\r\n \"@syncfusion/ej2-react-charts\": \"syncfusion:ej2-react-charts/dist/ej2-react-charts.umd.min.js\",\r\n \"@syncfusion/ej2-react-maps\": \"syncfusion:ej2-react-maps/dist/ej2-react-maps.umd.min.js\",\r\n \"@syncfusion/ej2-react-treemap\": \"syncfusion:ej2-react-treemap/dist/ej2-react-treemap.umd.min.js\",\r\n \"@syncfusion/ej2-react-circulargauge\": \"syncfusion:ej2-react-circulargauge/dist/ej2-react-circulargauge.umd.min.js\",\r\n \"@syncfusion/ej2-react-lineargauge\": \"syncfusion:ej2-react-lineargauge/dist/ej2-react-lineargauge.umd.min.js\",\r\n \"@syncfusion/ej2-react-calendars\": \"syncfusion:ej2-react-calendars/dist/ej2-react-calendars.umd.min.js\",\r\n \"@syncfusion/ej2-react-dropdowns\": \"syncfusion:ej2-react-dropdowns/dist/ej2-react-dropdowns.umd.min.js\",\r\n \"@syncfusion/ej2-react-grids\": \"syncfusion:ej2-react-grids/dist/ej2-react-grids.umd.min.js\",\r\n \"@syncfusion/ej2-react-inputs\": \"syncfusion:ej2-react-inputs/dist/ej2-react-inputs.umd.min.js\",\r\n \"@syncfusion/ej2-react-lists\": \"syncfusion:ej2-react-lists/dist/ej2-react-lists.umd.min.js\",\r\n \"@syncfusion/ej2-react-navigations\": \"syncfusion:ej2-react-navigations/dist/ej2-react-navigations.umd.min.js\",\r\n \"@syncfusion/ej2-react-popups\": \"syncfusion:ej2-react-popups/dist/ej2-react-popups.umd.min.js\",\r\n \"@syncfusion/ej2-react-schedule\": \"syncfusion:ej2-react-schedule/dist/ej2-react-schedule.umd.min.js\",\r\n \"@syncfusion/ej2-react-documenteditor\": \"syncfusion:ej2-react-documenteditor/dist/ej2-react-documenteditor.umd.min.js\",\r\n \"@syncfusion/ej2-react-notifications\": \"syncfusion:ej2-react-notifications/dist/ej2-react-notifications.umd.min.js\",\r\n \"@syncfusion/ej2-react-richtexteditor\": \"syncfusion:ej2-react-richtexteditor/dist/ej2-react-richtexteditor.umd.min.js\",\r\n \"@syncfusion/ej2-react-pivotview\": \"syncfusion:ej2-react-pivotview/dist/ej2-react-pivotview.umd.min.js\",\r\n \"@syncfusion/ej2-react-heatmap\": \"syncfusion:ej2-react-heatmap/dist/ej2-react-heatmap.umd.min.js\",\r\n \"react-dom\":\"https://unpkg.com/react-dom@15.5.4/dist/react-dom.min.js\",\r\n \"react\":\"https://unpkg.com/react@15.5.4/dist/react.min.js\",\r\n },\r\n packages: {\r\n 'app': { main: 'index', defaultExtension: 'tsx' },\r\n }\r\n});\r\n\r\nSystem.import('app');","index.html":"<!DOCTYPE html>\r\n<html>\r\n<head>\r\n <title>Range-navigator · Default · Essential JS 2 for React · Syncfusion</title>\r\n <meta charset=\"utf-8\" />\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, user-scalable=no\" />\r\n <meta http-equiv=\"x-ua-compatible\" content=\"ie=edge\">\r\n <!-- {{:meta}} -->\r\n <meta name=\"author\" content=\"Syncfusion\" />\r\n <script type=\"text/javascript\">\r\n var themeName = location.hash || 'material';\r\n themeName = themeName.replace('#','');\r\n window.ripple = (themeName === \"material\")\r\n document.write('<link href=\"http://cdn.syncfusion.com/ej2/' + themeName + '.css\" rel=\"stylesheet\">');\r\n </script>\r\n <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\" />\r\n <script src=\"https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.38/system.js\"></script>\r\n <script src=\"systemjs.config.js\"></script>\r\n <link href=\"index.css\" rel=\"stylesheet\" />\r\n <style>\r\n #loader {\r\n color: #008cff;\r\n height: 40px;\r\n left: 45%;\r\n position: absolute;\r\n top: 45%;\r\n width: 30%;\r\n }\r\n body {\r\n touch-action:none;\r\n }\r\n .body {\r\n font-family: \"Roboto\", \"Segoe UI\", \"GeezaPro\", \"DejaVu Serif\", \"sans-serif\";\r\n }\r\n\r\n .e-view {\r\n bottom: 0;\r\n left: 0;\r\n overflow: hidden;\r\n position: absolute;\r\n right: 0;\r\n top: 0;\r\n }\r\n\r\n .sb-left {\r\n float: left;\r\n }\r\n\r\n .sb-right {\r\n float: right;\r\n }\r\n\r\n .sb-block {\r\n display: block;\r\n }\r\n\r\n .sb-table {\r\n display: table;\r\n }\r\n\r\n .sb-table-cell {\r\n display: table-cell;\r\n vertical-align: middle;\r\n }\r\n\r\n /*sample header*/\r\n\r\n\r\n .sb-header {\r\n height: 48px;\r\n background: #FFFFFF;\r\n box-shadow: 0 2px 4px 0 rgba(0,0,0,0.12);\r\n z-index: 1001;\r\n opacity: 100;\r\n }\r\n\r\n\r\n .sb-header-left, .sb-header-right {\r\n height: 100%;\r\n }\r\n\r\n #sb-header-text {\r\n padding-left: 22px;\r\n opacity: 0.87;\r\n font-family: Roboto;\r\n font-weight: 500;\r\n font-size: 15px;\r\n color: #000000;\r\n text-align: left;\r\n }\r\n\r\n .header-logo {\r\n float: left;\r\n padding-left: 8px;\r\n padding-right: 22px;\r\n }\r\n\r\n .footer-logo {\r\n background: url(https://ej2.syncfusion.com/home/images/footer-logo.svg) no-repeat right;\r\n height: 40px;\r\n width: 140px;\r\n }\r\n\r\n .sb-header-splitter {\r\n float: left;\r\n border-left: 1px solid rgb(196, 196, 196);\r\n height: 32px;\r\n margin-top: 8px;\r\n padding-left: 22 px;\r\n }\r\n\r\n .sb-header-settings {\r\n display: none;\r\n }\r\n\r\n .product-style a{\r\n padding-right: 15px;\r\n font-family:Roboto;\r\n font-weight: 500;\r\n font-size: 13px;\r\n color: #363636;\r\n text-align: center;\r\n text-decoration: none;\r\n }\r\n .product-style a:hover {\r\n color:#3C78EF;\r\n }\r\n\r\n .sb-download-btn a {\r\n text-decoration: none;\r\n }\r\n\r\n .sb-download-text {\r\n color: #FFFFFF;\r\n }\r\n\r\n .sb-download-wrapper {\r\n padding-right: 27px;\r\n }\r\n\r\n .sb-download-btn:hover .sb-download-btn:focus .sb-download-btn.active {\r\n border-radius: 2px;\r\n font-family: \"Roboto\";\r\n font-weight: bold;\r\n color: #FFFFFF;\r\n }\r\n\r\n .sb-download-btn:hover {\r\n background: #006CE6;\r\n }\r\n\r\n .sb-download-btn:focus {\r\n background: #0051CB;\r\n }\r\n\r\n .sb-download-btn.active {\r\n background: #0036B1;\r\n }\r\n\r\n .sb-download-btn {\r\n background-color: #3C78EF;\r\n opacity: 100;\r\n border-radius: 2px;\r\n font-family: \"Roboto\", \"Segoe UI\", \"GeezaPro\", \"DejaVu Serif\", \"sans-serif\";\r\n font-weight: 500;\r\n line-height: 18px;\r\n height: 32px;\r\n border-color: transparent;\r\n }\r\n\r\n .sb-bread-crumb {\r\n padding-left: 20px;\r\n padding-top: 24px;\r\n padding-bottom: 10px;\r\n }\r\n\r\n .category-allcontrols a, .category-text a, .crumb-sample {\r\n display: table;\r\n opacity: 0.87;\r\n font-family: Roboto;\r\n font-weight: 500;\r\n font-size: 15px;\r\n color: #3C78EF;\r\n text-align: left;\r\n text-decoration: none;\r\n }\r\n\r\n .sb-bread-crumb .sb-bread-crumb-text>div {\r\n font-size: 15px;\r\n font-weight: 500;\r\n padding-right: 8px;\r\n cursor: default;\r\n display: table-cell;\r\n }\r\n\r\n .sb-bread-crumb-text>div.seperator {\r\n font-weight: 700;\r\n font-size: 15px;\r\n vertical-align: bottom;\r\n } \r\n\r\n .content {\r\n overflow: auto;\r\n height: calc(100% - 50px);\r\n top: 50px;\r\n }\r\n\r\n\r\n .sample-content {\r\n top: 48px;\r\n background: #FFFFFF;\r\n }\r\n\r\n .div {\r\n display: block;\r\n }\r\n\r\n .control-section {\r\n padding-left: 4px;\r\n }\r\n\r\n .crumb-sample {\r\n color: #000000;\r\n line-height: 18px;\r\n }\r\n\r\n #description {\r\n padding-bottom: 16px;\r\n padding-left: 20px;\r\n opacity: 0.75;\r\n font-family: Roboto;\r\n font-size: 13px;\r\n color: #000000;\r\n text-align: left;\r\n padding-top: 14px;\r\n }\r\n\r\n #action-description {\r\n padding-left: 20px;\r\n padding-bottom: 15px;\r\n opacity: 0.75;\r\n font-family: Roboto;\r\n font-size: 13px;\r\n color: #000000;\r\n text-align: left;\r\n }\r\n\r\n #description-section {\r\n padding-left: 20px;\r\n padding-top: 30px;\r\n opacity: 0.87;\r\n font-family:Roboto;\r\n font-weight: 700;\r\n font-size: 15px;\r\n color: #000000;\r\n text-align: left;\r\n }\r\n\r\n\r\n\r\n </style>\r\n</head>\r\n\r\n<body class='e-view ej2-new' aria-busy=\"true\">\r\n <div class=\"sample-browser\">\r\n <div id='sample-header' class=\"sb-header\" role=\"banner\">\r\n <div class='sb-header-left sb-left sb-table'>\r\n <div class='sb-header-item sb-table-cell'>\r\n <div class=\"header-logo\">\r\n <a href=\"https://ej2.syncfusion.com/home/react.html\" target=\"\" rel=\"noopener noreferrer\">\r\n <div class=\"footer-logo\"> </div>\r\n </a>\r\n </div>\r\n \r\n </div>\r\n <div class=\"sb-header-splitter sb-download-splitter\"></div>\r\n <div class='sb-header-item sb-table-cell'>\r\n <div id='sb-header-text' class='e-sb-header-text'>\r\n \r\n <span class='sb-header-text-left'>Essential JS 2 for React</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class='sb-header-right sb-right sb-table'>\r\n <div class='sb-header-item sb-table-cell'>\r\n <div class='product-style'>\r\n <div><a href=\"https://www.syncfusion.com/products/react/range-navigator\">PRODUCT DETAILS</a></div>\r\n </div>\r\n </div>\r\n <div class='sb-header-item sb-table-cell'>\r\n <div class=\"sb-header-item sb-table-cell sb-download-wrapper\">\r\n <a href=\"https://www.syncfusion.com/downloads/essential-js2\" target=\"_blank\">\r\n <button id=\"download-now\" class=\"sb-download-btn\">\r\n <span class=\"sb-download-text\">DOWNLOAD</span>\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <div class ='content e-view'>\r\n <div class='sample-content'>\r\n <div id=\"sample-bread-crumb\" class=\"sb-bread-crumb\">\r\n <div class=\"sb-bread-crumb-text\">\r\n <div class=\"category-allcontrols\"><a href=\"https://ej2.syncfusion.com/react/demos\"><span>All Controls</span></a></div>\r\n <div class=\"category-seperator sb-icons\"> / </div>\r\n <div class=\"category-text bread-ctext\"><a href=\"https://ej2.syncfusion.com/react/demos/#/material/range-navigator/default.html\"><span>Range-navigator</span></a></div>\r\n <div class=\"category-seperator sb-icons\"> / </div>\r\n <div class=\"crumb-sample\">Default</div>\r\n </div>\r\n </div>\r\n <div class=\"control-content\">\r\n <div id=\"action-description\">\r\n <p>\r\n \n <p>\n This sample visualizes the bitcoin price range with area series in the range navigator. \n Selected range values are enhanced with tooltip.\n </p>\n \r\n </p>\r\n </div>\r\n <div class=\"container-fluid\">\r\n <div class=\"control-section\">\r\n <div id='sample'>\r\n <div id='loader'>Loading....</div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div id=\"description-section\">Description</div> \r\n <div id=\"description\">\r\n <p>\r\n \n <p>\n In this example, you can see how to render and configure the range navigator with area type series. <code>Tooltip</code> is used to represent selected data value. \n You can also use <code>selectedRegionColor</code> and <code>unselectedRegionColor</code> properties to customize selected and unselected area in range navigator.\n </p>\n <br><br>\n <p><b>Injecting Module</b></p>\n <p>\n The range navigator component features are segregated into individual feature-wise modules. \n To use date-time axis, inject the\n <code>DateTime</code> module using\n <code>RangeNavigator.Inject(DateTime)</code> method.To use tooltip, inject the\n <code>RangeTooltip</code> module using\n <code>RangeNavigator.Inject(RangeTooltip)</code> method.\n </p>\n \r\n </p> \r\n </div> \r\n </div> \r\n </div>\r\n \r\n </div>\r\n </div>\r\n \r\n</body>\r\n</html>\r\n","app/index.tsx":"/**\r\n * Sample for Default Range Navigator\r\n */\r\nimport * as React from \"react\";\r\nimport * as ReactDOM from \"react-dom\";\r\nimport {\r\n RangeNavigatorComponent, AreaSeries, ChartTheme, DateTime, Inject, RangeTooltip,\r\n RangenavigatorSeriesCollectionDirective, RangenavigatorSeriesDirective, IRangeLoadedEventArgs\r\n} from '@syncfusion/ej2-react-charts';\r\nimport { Browser } from '@syncfusion/ej2-base';\r\nimport { bitCoinData } from '../default-data';\r\nimport { SampleBase } from './sample-base';\r\n\r\nexport let data: Object[] = bitCoinData;\r\nexport let themes: string[] = ['Material' , 'Fabric' , 'Bootstrap' , 'Highcontrast']\r\nexport let borderColor: string[] = ['#00bdae', '#4472c4', '#a16ee5', '#79ECE4'];\r\nexport let regionColor: string[] = ['rgba(0, 189, 174, 0.3)', 'rgba(68, 114, 196, 0.3)',\r\n 'rgba(161, 110, 229, 0.3)', 'rgba(121, 236, 228, 0.3)'];\r\nconst SAMPLE_CSS = `\r\n .control-fluid {\r\n padding: 0px !important;\r\n }\r\n #title{\r\n font-size: 15px;\r\n font-style: normal;\r\n font-family: \"Segoe UI\";\r\n font-weight: 500;\r\n text-anchor: middle;\r\n transform: none;\r\n opacity: 1;\r\n }\r\n #rangenavigator {\r\n transform: translate(0, 25%);\r\n }\r\n\r\n #material-gradient-chart stop {\r\n stop-color: #00bdae;\r\n }\r\n\r\n #fabric-gradient-chart stop {\r\n stop-color: #4472c4;\r\n }\r\n\r\n #bootstrap-gradient-chart stop {\r\n stop-color: #a16ee5;\r\n }\r\n\r\n #highcontrast-gradient-chart stop {\r\n stop-color: #79ECE4;\r\n }\r\n\r\n .chart-gradient stop[offset=\"0\"] {\r\n stop-opacity: 0.9;\r\n }\r\n\r\n .chart-gradient stop[offset=\"1\"] {\r\n stop-opacity: 0.3;\r\n }\r\n `;\r\n\r\nexport class Default extends SampleBase<{}, {}> {\r\n\r\n render() {\r\n return (\r\n <div className='control-pane'>\r\n <style>\r\n {SAMPLE_CSS}\r\n </style>\r\n <div className='control-section'>\r\n <div className=\"row\" style={{ textAlign: \"center\" }}>\r\n <div id=\"title\">Bitcoin (USD) Price Range</div>\r\n </div>\r\n <div className=\"row\">\r\n <RangeNavigatorComponent id='rangenavigator' style={{ textAlign: \"center\" }}\r\n valueType='DateTime'\r\n load={this.load.bind(this)}\r\n tooltip={{ enable: true, displayMode: 'Always',format: 'MM/dd/yyyy' }}\r\n navigatorStyleSettings={{\r\n unselectedRegionColor: 'transparent'\r\n }}\r\n labelFormat='MMM-yy'\r\n width={Browser.isDevice ? '100%' : '80%'}\r\n value={[new Date('2017-09-01'), new Date('2018-02-01')]}>\r\n <Inject services={[AreaSeries, DateTime, RangeTooltip]} />\r\n <RangenavigatorSeriesCollectionDirective>\r\n <RangenavigatorSeriesDirective dataSource={data} xName='x' yName='y' \r\n type='Area' width={2} border={{width:2}}>\r\n </RangenavigatorSeriesDirective>\r\n </RangenavigatorSeriesCollectionDirective>\r\n </RangeNavigatorComponent>\r\n </div>\r\n </div>\r\n <svg style={{ height: '0' }}>\r\n <defs>\r\n <linearGradient id=\"material-gradient-chart\" style={{opacity: 0.75}} className=\"chart-gradient\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\r\n <stop offset=\"0\"></stop>\r\n <stop offset=\"1\"></stop>\r\n </linearGradient>\r\n <linearGradient id=\"fabric-gradient-chart\" style={{opacity: 0.75}} className=\"chart-gradient\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\r\n <stop offset=\"0\"></stop>\r\n <stop offset=\"1\"></stop>\r\n </linearGradient>\r\n <linearGradient id=\"bootstrap-gradient-chart\" style={{opacity: 0.75}} className=\"chart-gradient\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\r\n <stop offset=\"0\"></stop>\r\n <stop offset=\"1\"></stop>\r\n </linearGradient>\r\n <linearGradient id=\"highcontrast-gradient-chart\" style={{opacity: 0.75}} className=\"chart-gradient\" x1=\"0\" x2=\"0\" y1=\"0\" y2=\"1\">\r\n <stop offset=\"0\"></stop>\r\n <stop offset=\"1\"></stop>\r\n </linearGradient>\r\n </defs>\r\n </svg>\r\n </div>\r\n )\r\n }\r\n public load(args: IRangeLoadedEventArgs): void {\r\n let selectedTheme: string = location.hash.split('/')[1];\r\n selectedTheme = selectedTheme ? selectedTheme : 'Material';\r\n args.rangeNavigator.theme = (selectedTheme.charAt(0).toUpperCase() + selectedTheme.slice(1)) as ChartTheme;\r\n let rangeTheme: string= args.rangeNavigator.theme;\r\n args.rangeNavigator.series[0].fill = 'url(#' + rangeTheme.toLowerCase() + '-gradient-chart)';\r\n args.rangeNavigator.series[0].border.color = borderColor[themes.indexOf(rangeTheme)];\r\n args.rangeNavigator.navigatorStyleSettings.selectedRegionColor= regionColor[themes.indexOf(rangeTheme)];\r\n };\r\n}\nReactDOM.render(<Default />, document.getElementById('sample'));","app/sample-base.tsx":"import * as ReactDOM from 'react-dom';\r\nimport * as React from 'react';\r\nimport { RouteComponentProps } from 'react-router-dom';\r\nimport { enableRipple } from '@syncfusion/ej2-base';\r\n\r\nenableRipple((window as any).ripple);\r\nexport class SampleBase<P, S> extends React.PureComponent<RouteComponentProps<any> & P, S>{\r\n public rendereComplete(): void {\r\n /**custom render complete function */\r\n }\r\n componentDidMount(): void {\r\n setTimeout(() => {\r\n this.rendereComplete();\r\n }\r\n );\r\n }\r\n}"}