AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

remove axis from graph

Browse Source
This commit is contained in:
MuslemRahimi 2024-09-23 11:55:29 +02:00
parent fa2df40340
commit 580375132a
15 changed files with 152 additions and 321 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
src/lib/components/BorrowedShare.svelte
View File

@ -2,7 +2,7 @@
import { borrowedShareComponent, displayCompanyName, stockTicker, assetType, etfTicker, screenWidth, getCache, setCache} from '$lib/store';
import InfoModal from '$lib/components/InfoModal.svelte';
import { Chart } from 'svelte-echarts'
import { abbreviateNumber, formatDateRange } from "$lib/utils";
import { abbreviateNumber, formatDateRange, monthNames } from "$lib/utils";
import { init, use } from 'echarts/core'
import { LineChart } from 'echarts/charts'
@ -50,22 +50,6 @@ function findLowestAndHighestFee(data, lastDateStr) {
}
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
let dates = [];
@ -89,7 +73,6 @@ function findLowestAndHighestFee(data, lastDateStr) {
return accumulator + sum;
}, 0);
const {unit, denominator } = normalizer(Math.max(...availableList) ?? 0)
const option = {
silent: true,
@ -99,19 +82,26 @@ function findLowestAndHighestFee(data, lastDateStr) {
},
animation: false,
grid: {
left: '2%',
right: '2%',
left: '3%',
right: '3%',
bottom: '2%',
top: '5%',
containLabel: true
},
xAxis:
{
xAxis: {
type: 'category',
boundaryGap: false,
data: dates,
axisLabel: {
color: '#fff',
color: '#fff',
formatter: function (value) {
// Assuming dates are in the format 'yyyy-mm-dd'
// Extract the month and day from the date string and convert the month to its abbreviated name
const dateParts = value.split('-');
const day = dateParts[2].substring(0); // Extracting the last two digits of the year
const monthIndex = parseInt(dateParts[1]) - 1; // Months are zero-indexed in JavaScript Date objects
return `${day} ${monthNames[monthIndex]}`;
}
}
},
yAxis: [
@ -121,34 +111,18 @@ function findLowestAndHighestFee(data, lastDateStr) {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value, index) {
// Display every second tick
if (index % 2 === 0) {
value = Math.max(value, 0);
return (value / denominator)?.toFixed(0) + unit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
},
show: false // Hide y-axis labels
},
},
{
type: 'value',
splitLine: {
{
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
},
position: 'right',
axisLabel: {
color: '#fff',
formatter: function (value, index) {
if (index % 2 === 0) {
return value?.toFixed(1)+'%'
} else {
return ''; // Hide this tick
}
}
}
},
position: 'right',
axisLabel: {
show: false // Hide y-axis labels
},
},
],
series: [

46
src/lib/components/DarkPool.svelte
View File

@ -21,22 +21,6 @@
let monthlyVolume;
let avgMonthlyShort;
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function findMonthlyValue(data, lastDateStr) {
// Convert lastDateStr to Date object
@ -90,7 +74,6 @@ function getPlotOptions() {
const totalShort = shortVolumeList?.reduce((acc, sentiment) => acc + sentiment, 0);
avgShortVolume = totalShort / shortVolumeList?.length;
const {unit, denominator } = normalizer(Math.max(...totalVolumeList) ?? 0)
const option = {
silent: true,
@ -100,8 +83,8 @@ function getPlotOptions() {
},
animation: false,
grid: {
left: '2%',
right: '2%',
left: '3%',
right: '3%',
bottom: '2%',
top: '5%',
containLabel: true
@ -115,23 +98,14 @@ function getPlotOptions() {
}
},
yAxis: [
{
type: 'value',
splitLine: {
{
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value, index) {
// Display every second tick
if (index % 2 === 0) {
value = Math.max(value, 0);
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
},
},
axisLabel: {
show: false // Hide y-axis labels
}
},
],
series: [
@ -280,7 +254,7 @@ $: {
<td class="px-[5px] py-1.5 xs:px-2.5 xs:py-2">
<span>Date</span>
</td>
<td class="px-[5px] py-1.5 whitespace-nowrap text-right font-medium xs:px-2.5 xs:py-2">
<td class="text-sm sm:text-[1rem] px-[5px] py-1.5 whitespace-nowrap text-right font-medium xs:px-2.5 xs:py-2">
{ formatDateRange(rawData?.slice(-1)?.at(0)?.date)}
</td>
</tr>

43
src/lib/components/Enterprise.svelte
View File

@ -19,21 +19,7 @@
let optionsData;
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
let dates = [];
let enterpriseValue = [];
@ -54,7 +40,6 @@ function getPlotOptions() {
});
const {unit, denominator } = normalizer(Math.max(...enterpriseValue) ?? 0)
const option = {
@ -78,24 +63,17 @@ function getPlotOptions() {
color: '#fff',
}
},
yAxis: [
{
type: 'value',
splitLine: {
yAxis: {
splitLine: {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
//value = Math.max(value, 0);
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
},
},
},
],
axisLabel: {
show: false // Hide y-axis labels
},
},
series: [
{
{
name: 'Cash Equiv.',
data: cashEquivalent,
type: 'bar',
itemStyle: {
@ -103,6 +81,7 @@ function getPlotOptions() {
}
},
{
name: 'Debt',
data: addTotalDebt,
type: 'bar',
itemStyle: {
@ -110,6 +89,7 @@ function getPlotOptions() {
}
},
{
name: 'Market Cap',
data: marketCapitalization,
type: 'bar',
itemStyle: {
@ -117,6 +97,7 @@ function getPlotOptions() {
}
},
{
name: 'Enterprise Value',
data: enterpriseValue,
type: 'bar',
itemStyle: {

68
src/lib/components/FailToDeliver.svelte
View File

@ -2,7 +2,7 @@
import { failToDeliverComponent, displayCompanyName, stockTicker, assetType, etfTicker, screenWidth, getCache, setCache} from '$lib/store';
import InfoModal from '$lib/components/InfoModal.svelte';
import { Chart } from 'svelte-echarts'
import { abbreviateNumber, formatDateRange } from "$lib/utils";
import { abbreviateNumber, formatDateRange, monthNames } from "$lib/utils";
import { init, use } from 'echarts/core'
import { LineChart } from 'echarts/charts'
@ -46,22 +46,6 @@ function findLowestAndHighestPrice(data, lastDateStr) {
}
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e3 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
let dates = [];
@ -80,11 +64,9 @@ function findLowestAndHighestPrice(data, lastDateStr) {
// Compute the average of item?.traded
const totalNumber = failToDeliverList?.reduce((acc, item) => acc + item, 0);
avgFailToDeliver = totalNumber / failToDeliverList?.length;
avgFailToDeliver = (totalNumber / failToDeliverList?.length)?.toFixed(0);
const {unit, denominator } = normalizer(Math.max(...failToDeliverList) ?? 0)
const option = {
silent: true,
tooltip: {
@ -93,19 +75,26 @@ function findLowestAndHighestPrice(data, lastDateStr) {
},
animation: false,
grid: {
left: '2%',
right: '2%',
left: '3%',
right: '3%',
bottom: '2%',
top: '5%',
containLabel: true
},
xAxis:
{
xAxis: {
type: 'category',
boundaryGap: false,
data: dates,
axisLabel: {
color: '#fff',
color: '#fff',
formatter: function (value) {
// Assuming dates are in the format 'yyyy-mm-dd'
// Extract the month and day from the date string and convert the month to its abbreviated name
const dateParts = value.split('-');
const day = dateParts[2].substring(0); // Extracting the last two digits of the year
const monthIndex = parseInt(dateParts[1]) - 1; // Months are zero-indexed in JavaScript Date objects
return `${day} ${monthNames[monthIndex]}`;
}
}
},
yAxis: [
@ -115,15 +104,8 @@ function findLowestAndHighestPrice(data, lastDateStr) {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff',
formatter: function (value, index) {
if (index % 2 === 0) {
return '$'+value?.toFixed(1)
} else {
return ''; // Hide this tick
}
}
axisLabel: {
show: false // Hide y-axis labels
}
},
{
@ -133,21 +115,12 @@ function findLowestAndHighestPrice(data, lastDateStr) {
},
position: 'right',
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value, index) {
// Display every second tick
if (index % 2 === 0) {
value = Math.max(value, 0);
return (value / denominator)?.toFixed(0) + unit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
},
show: false // Hide y-axis labels
},
},
],
series: [
{
{ name: 'Price',
data: priceList,
type: 'line',
itemStyle: {
@ -155,7 +128,8 @@ function findLowestAndHighestPrice(data, lastDateStr) {
},
showSymbol: false
},
{
{
name: 'FTD Shares',
data: failToDeliverList,
type: 'line',
areaStyle: {opacity: 1},

2
src/lib/components/GovernmentContract.svelte
View File

@ -156,7 +156,7 @@ use([BarChart, GridComponent, CanvasRenderer])
const postData = {'ticker': ticker, path: 'government-contract'};
// make the POST request to the endpoint
const response = await fetch('/ticker-data', {
const response = await fetch('/api/ticker-data', {
method: 'POST',
headers: {
"Content-Type": "application/json"

75
src/lib/components/MarketMaker.svelte
View File

@ -2,7 +2,7 @@
import { marketMakerComponent, displayCompanyName, stockTicker, assetType, etfTicker, screenWidth, getCache, setCache} from '$lib/store';
import InfoModal from '$lib/components/InfoModal.svelte';
import { Chart } from 'svelte-echarts'
import { abbreviateNumber, formatString, formatDateRange } from "$lib/utils";
import { abbreviateNumber, formatString, formatDateRange, monthNames } from "$lib/utils";
import { init, use } from 'echarts/core'
import { LineChart } from 'echarts/charts'
@ -27,21 +27,6 @@
let showFullStats = false;
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
@ -70,8 +55,6 @@ function getPlotOptions() {
avgNotionalSum = totalSum / notionalSumList?.length;
const {unit, denominator } = normalizer(Math.max(...notionalSumList) ?? 0)
const { unit: shareUnit, denominator: shareDenominator } = normalizer(Math.max(...shareQuantityList) ?? 0);
const option = {
silent: true,
@ -81,21 +64,28 @@ function getPlotOptions() {
hideDelay: 100, // Set the delay in milliseconds
},
grid: {
left: '2%',
right: '2%',
left: '3%',
right: '3%',
bottom: '2%',
top: '5%',
containLabel: true
},
xAxis:
{
type: 'category',
boundaryGap: false,
data: dates,
axisLabel: {
color: '#fff',
xAxis: {
type: 'category',
boundaryGap: false,
data: dates,
axisLabel: {
color: '#fff',
formatter: function (value) {
// Assuming dates are in the format 'yyyy-mm-dd'
// Extract the month and day from the date string and convert the month to its abbreviated name
const dateParts = value.split('-');
const day = dateParts[2].substring(0); // Extracting the last two digits of the year
const monthIndex = parseInt(dateParts[1]) - 1; // Months are zero-indexed in JavaScript Date objects
return `${day} ${monthNames[monthIndex]}`;
}
},
}
},
yAxis: [
{
type: 'value',
@ -103,16 +93,7 @@ function getPlotOptions() {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value, index) {
// Display every second tick
if (index % 2 === 0) {
value = Math.max(value, 0);
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
show: false // Hide y-axis labels
},
},
{
@ -122,19 +103,12 @@ function getPlotOptions() {
},
position: 'right',
axisLabel: {
color: '#fff',
formatter: function (value, index) {
if (index % 2 === 0) {
return (value / shareDenominator)?.toFixed(1) + shareUnit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
}
show: false // Hide y-axis labels
},
}
],
series: [
{
{ name: 'Notional Sum',
data: notionalSumList,
type: 'line',
itemStyle: {
@ -142,13 +116,14 @@ function getPlotOptions() {
},
showSymbol: false
},
{
{
name: 'Shares',
data: shareQuantityList,
type: 'line',
areaStyle: {opacity: 1},
yAxisIndex: 1,
itemStyle: {
color: '#3B82F6' // Change bar color to white
color: '#408FFF' // Change bar color to white
},
showSymbol: false
},

75
src/lib/components/RetailVolume.svelte
View File

@ -3,7 +3,7 @@
import { retailVolumeComponent,displayCompanyName, stockTicker, assetType, etfTicker, screenWidth, getCache, setCache} from '$lib/store';
import InfoModal from '$lib/components/InfoModal.svelte';
import { Chart } from 'svelte-echarts'
import { abbreviateNumber, formatDateRange } from "$lib/utils";
import { abbreviateNumber, formatDateRange, monthNames } from "$lib/utils";
import { init, use } from 'echarts/core'
import { LineChart, BarChart } from 'echarts/charts'
import { GridComponent, TooltipComponent } from 'echarts/components'
@ -16,7 +16,6 @@
let isLoaded = false;
const monthNames = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
let historyData = []
let rawData = [];
@ -55,21 +54,7 @@
}
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
let dates = [];
let tradingList = [];
@ -94,7 +79,6 @@ function getPlotOptions() {
const totalSentiment = sentimentList?.reduce((acc, sentiment) => acc + sentiment, 0);
avgSentiment = totalSentiment / tradingList?.length > 1 ? 'Bullish' : 'Bearish';
const {unit, denominator } = normalizer(Math.max(...tradingList) ?? 0)
const option = {
@ -105,8 +89,8 @@ function getPlotOptions() {
hideDelay: 100, // Set the delay in milliseconds
},
grid: {
left: '0%',
right: '0%',
left: '3%',
right: '3%',
bottom: '0%',
top: '5%',
containLabel: true
@ -128,47 +112,30 @@ function getPlotOptions() {
}
},
yAxis: [
{
name: 'Volume',
position: 'left',
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value, index) {
// Display every second tick
if (index % 2 === 0) {
value = Math.max(value, 0);
return '$' + (value / denominator)?.toFixed(1) + unit; // Format value in millions
} else {
return ''; // Hide this tick
}
}
},
},
{
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
},
name: 'Sentiment',
position: 'right',
axisLabel: {
color: '#fff',
formatter: function (value, index) {
if (index % 2 === 0) {
return value?.toFixed(2); // Format the sentiment value
} else {
return ''; // Hide this tick
}
}
axisLabel: {
show: false // Hide y-axis labels
}
}
},
{
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
},
position: 'right',
axisLabel: {
show: false // Hide y-axis labels
},
},
],
series: [
{
{
name: 'Volume [$]',
data: tradingList,
type: 'line',
itemStyle: {
@ -177,7 +144,7 @@ function getPlotOptions() {
showSymbol: false
},
{
name: 'Sentiment',
name: 'Retail Sentiment',
data: sentimentList,
type: 'bar',
yAxisIndex: 1,

37
src/lib/components/ShareStatistics.svelte
View File

@ -23,21 +23,6 @@ use([BarChart, GridComponent, TooltipComponent, CanvasRenderer])
let optionsData;
function normalizer(value) {
if (Math?.abs(value) >= 1e18) {
return { unit: 'Q', denominator: 1e18 };
} else if (Math?.abs(value) >= 1e12) {
return { unit: 'T', denominator: 1e12 };
} else if (Math?.abs(value) >= 1e9) {
return { unit: 'B', denominator: 1e9 };
} else if (Math?.abs(value) >= 1e6) {
return { unit: 'M', denominator: 1e6 };
} else if (Math?.abs(value) >= 1e5) {
return { unit: 'K', denominator: 1e5 };
} else {
return { unit: '', denominator: 1 };
}
}
function getPlotOptions() {
let dates = [];
let floatShares = [];
@ -52,9 +37,6 @@ function getPlotOptions() {
});
const {unit, denominator } = normalizer(Math.max(...floatShares) ?? 0)
const option = {
silent: true,
animation: false,
@ -63,8 +45,8 @@ function getPlotOptions() {
hideDelay: 100, // Set the delay in milliseconds
},
grid: {
left: $screenWidth < 640 ? '1%' : '2%',
right: $screenWidth < 640 ? '0%' : '2%',
left: $screenWidth < 640 ? '3%' : '2%',
right: $screenWidth < 640 ? '3%' : '2%',
bottom: $screenWidth < 640 ? '0%' : '2%',
top: '5%',
containLabel: true
@ -80,27 +62,24 @@ function getPlotOptions() {
{
type: 'value',
splitLine: {
show: false, // Disable x-axis grid lines
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
value = Math.max(value, 0);
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
},
show: false // Hide y-axis labels
}
},
},
],
series: [
{
{ name: 'Floating Shares',
data: floatShares,
type: 'bar',
itemStyle: {
color: '#3B82F6' // Change bar color to white
}
},
{
{ name: 'Outstanding Shares',
data: outstandingShares,
type: 'bar',
itemStyle: {

2
src/lib/components/TARating.svelte
View File

@ -160,7 +160,7 @@ $: if ($assetType || $stockTicker || $etfTicker || $cryptoTicker) {
<tbody>
{#each (showFullStats ? signalList : signalList?.slice(0, 3)) as item,index}
<tr class="border-y border-gray-800 odd:bg-[#27272A] {index === 2 && !showFullStats && signalList?.length > 2 ? 'opacity-[0.3]' : '' }">
<td class="text-white text-sm sm:text-[1rem] whitespace-nowrap">
<td class="text-white text-sm sm:text-[1rem] ">
{item?.name}
</td>

12
src/lib/components/VaR.svelte
View File

@ -48,7 +48,7 @@ function getPlotOptions() {
},
animation: false,
grid: {
left: '0%',
left: '2%',
right: '2%',
bottom: '2%',
top: '5%',
@ -75,16 +75,8 @@ function getPlotOptions() {
splitLine: {
show: false, // Disable x-axis grid lines
},
axisLabel: {
color: '#fff',
formatter: function (value, index) {
if (index % 2 === 0) {
return value?.toFixed(0)+'%'
} else {
return ''; // Hide this tick
}
}
show: false // Hide y-axis labels
}
}
],

27
src/lib/utils.ts
View File

@ -20,7 +20,7 @@ type FlyAndScaleParams = {
export const flyAndScale = (
node: Element,
params: FlyAndScaleParams = { y: -8, x: 0, start: 0.95, duration: 0 },
params: FlyAndScaleParams = { y: -8, x: 0, start: 0.95, duration: 0 }
): TransitionConfig => {
const style = getComputedStyle(node);
const transform = style.transform === "none" ? "" : style.transform;
@ -28,7 +28,7 @@ export const flyAndScale = (
const scaleConversion = (
valueA: number,
scaleA: [number, number],
scaleB: [number, number],
scaleB: [number, number]
) => {
const [minA, maxA] = scaleA;
const [minB, maxB] = scaleB;
@ -40,7 +40,7 @@ export const flyAndScale = (
};
const styleToString = (
style: Record<string, number | string | undefined>,
style: Record<string, number | string | undefined>
): string => {
return Object.keys(style).reduce((str, key) => {
if (style[key] === undefined) return str;
@ -212,7 +212,7 @@ export function sumQuarterlyResultsByYear(quarterlyResults, namingList) {
// Filter out years with less than 4 quarters
const validYears = Object?.keys(quarterCounts)?.filter(
(year) => quarterCounts[year] === 4,
(year) => quarterCounts[year] === 4
);
const annualResults = validYears?.map((year) => yearlySummaries[year]);
@ -420,7 +420,7 @@ export function formatETFName(inputString) {
// Capitalize the first letter of each word
const capitalizedWords = words?.map(
(word) => word.charAt(0)?.toUpperCase() + word?.slice(1),
(word) => word.charAt(0)?.toUpperCase() + word?.slice(1)
);
// Join the words back together with a space between them
@ -442,7 +442,7 @@ export function addDays(data, days, state) {
} else {
const differenceInTime = result - createdDate;
const differenceInDays = Math.round(
differenceInTime / (1000 * 60 * 60 * 24),
differenceInTime / (1000 * 60 * 60 * 24)
);
return Math.abs(differenceInDays);
}
@ -1207,3 +1207,18 @@ export const industryList = [
"Diversified Utilities",
"General Utilities",
];
export const monthNames = [
"Jan",
"Feb",
"Mar",
"Apr",
"May",
"Jun",
"Jul",
"Aug",
"Sep",
"Oct",
"Nov",
"Dec",
];

2
src/routes/stocks/[tickerID]/stats/balance-sheet/+page.svelte
View File

@ -297,7 +297,7 @@ function normalizer(value) {
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
},
},
},

2
src/routes/stocks/[tickerID]/stats/cash-flow/+page.svelte
View File

@ -264,7 +264,7 @@ function plotData()
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
},
},
},

2
src/routes/stocks/[tickerID]/stats/income/+page.svelte
View File

@ -238,7 +238,7 @@ function plotData()
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
},
},
},

8
src/routes/stocks/[tickerID]/stats/market-cap/+page.svelte
View File

@ -231,7 +231,7 @@ async function plotData()
axisLabel: {
color: '#fff', // Change label color to white
formatter: function (value) {
return '$'+(value / denominator)?.toFixed(1) + unit; // Format value in millions
return (value / denominator)?.toFixed(1) + unit; // Format value in millions
},
},
},
@ -303,7 +303,7 @@ async function plotData()
<div class="grid grid-cols-1 gap-2">
<div class="text-white p-3 sm:p-5 mb-10 rounded-lg sm:flex sm:flex-row sm:items-center border border-slate-800 text-sm sm:text-[1rem]">
<svg class="w-6 h-6 flex-shrink-0 inline-block sm:mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path fill="#a474f6" d="M128 24a104 104 0 1 0 104 104A104.11 104.11 0 0 0 128 24m-4 48a12 12 0 1 1-12 12a12 12 0 0 1 12-12m12 112a16 16 0 0 1-16-16v-40a8 8 0 0 1 0-16a16 16 0 0 1 16 16v40a8 8 0 0 1 0 16"/></svg>
{$displayCompanyName} has a market cap or net worth of {abbreviateNumber(data?.getStockQuote?.marketCap,true)} as of {(new Date())?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}. Its market cap has {changePercentageYearAgo > 0 ? 'increased' : changePercentageYearAgo < 0 ? 'decreased' : 'unchanged'} by {abbreviateNumber(changePercentageYearAgo?.toFixed(2))}% in one year.
{$displayCompanyName} has a market cap of {abbreviateNumber(data?.getStockQuote?.marketCap,true)} as of {(new Date())?.toLocaleString('en-US', { month: 'short', day: 'numeric', year: 'numeric', daySuffix: '2-digit' })}. Its market cap has {changePercentageYearAgo > 0 ? 'increased' : changePercentageYearAgo < 0 ? 'decreased' : 'unchanged'} by {abbreviateNumber(changePercentageYearAgo?.toFixed(2))}% in one year.
</div>
@ -327,12 +327,12 @@ async function plotData()
</div>
<h2 class="mt-5 text-2xl text-gray-200 font-semibold">
<h2 class="mt-10 text-xl text-gray-200 font-bold">
Market Cap History
</h2>
<ul class="text-[0.8rem] font-medium text-center w-56 pt-3 sm:w-56 mb-5 flex justify-center sm:justify-end items-center ml-auto">
<ul class="text-[0.8rem] font-medium text-center w-56 pt-5 sm:pt-3 sm:w-56 mb-5 flex m-auto sm:justify-end items-center sm:ml-auto">
<li class="w-full">
<label on:click={() => changeTablePeriod('annual')} class="cursor-pointer rounded-l-lg inline-block w-full py-2.5 text-white {filterRule === 'annual' ? 'bg-purple-600' : 'bg-[#2A303C]'} font-semibold border-r border-gray-600" aria-current="page">
Annual