Untitled
unknown
plain_text
a year ago
1.2 kB
8
Indexable
import React, { useEffect, useState } from 'react'; import { Line } from 'react-chartjs-2'; import { fetchMarketingData } from '../services/facebookService'; const MarketingDataVisualization = () => { const [data, setData] = useState({ labels: [], // Campaign names datasets: [ { label: 'Clicks', data: [], borderColor: 'rgb(75, 192, 192)', tension: 0.1, }, // Add other datasets as needed ], }); useEffect(() => { const fetchData = async () => { const marketingData = await fetchMarketingData(); // Processing the data for visualization const labels = marketingData.map((item) => item.campaign_name); const clicksData = marketingData.map((item) => item.clicks); // Update other datasets similarly setData((prevData) => ({ ...prevData, labels, datasets: [{ ...prevData.datasets[0], data: clicksData }], // Update other datasets similarly })); }; fetchData(); }, []); return <div className="marketing-data-chart"> <Line data={data} /> </div>; }; export default MarketingDataVisualization;
Editor is loading...
Leave a Comment