上海期货沪铝实时行情 (上海期货沪铝实时交易行情)

javascript // 引入必要的库 import { useEffect, useRef } from "react"; import as d3 from "d3";// 创建图表 const Chart = () => {// 创建图表引用const chartRef = useRef();// 读取数据并绘制图表useEffect(() => {// 从服务器获取数据d3.csv("data.csv").then(data => {// 创建时间度量，单位为毫秒const timeScale = d3.scaleTime().domain(d3.extent(data, d => d.date)).range([0, width]);// 创建价格度量const priceScale = d3.scaleLinear().domain([0, d3.max(data, d => d.price)]).range([height, 0]);// 创建线生成器const line = d3.line().x(d => timeScale(d.date)).y(d => priceScale(d.price));// 添加 SVG 元素const svg = d3.select(chartRef.current).append("svg").attr("width", width).attr("height", height);// 添加路径元素svg.append("path").attr("d", line(data)).attr("stroke", "blue").attr("fill", "none").attr("stroke-width", 2);// 添加 X 轴 svg.append("g").attr("transform", `translate(0, ${height})`).call(d3.axisBottom(timeScale));// 添加 Y 轴svg.append("g").call(d3.axisLeft(priceScale));});}, []);// 设置图表尺寸const width = 600;const height = 400;return