Code Monkey home page Code Monkey logo

miusarname / mapa-de-datos-fcc Goto Github PK

View Code? Open in Web Editor NEW
1.0 1.0 0.0 7 KB

Este proyecto implica la creación de un mapa de datos que representa la temperatura global. La implementación se realiza mediante D3 y JavaScript, permitiendo una visualización efectiva de tendencias climáticas. Esta tarea destaca mi capacidad para utilizar herramientas como D3.js para visualizar datos geográficos de manera impactante. 🌍🌡️

Home Page: https://mapa-de-calor-fcc-prueba-3.netlify.app/

JavaScript 89.64% HTML 3.74% CSS 6.63%
freecodecamp global project temperature

mapa-de-datos-fcc's Introduction

Heat Map Project

Este proyecto consiste en la visualización de un mapa de calor de las temperaturas globales utilizando datos proporcionados por FreeCodeCamp.

Contenido del Repositorio

  • Script Principal: Modules/D3.js - Contiene el código principal en JavaScript para generar el mapa de calor utilizando D3.js.
  • Estilos CSS: style.css - Define los estilos para la visualización del mapa de calor.
  • Recursos Externos:
    • D3.js - Librería de JavaScript para manipular documentos basados en datos.
    • d3-v6-tip - Extensión de D3.js para generar tooltips.

Instrucciones de Uso

  1. Clona este repositorio en tu máquina local.
  2. Abre el archivo index.html en tu navegador web para visualizar el mapa de calor.
  3. Explora las temperaturas globales mensuales representadas en el mapa de calor y los tooltips que muestran información detallada al pasar el cursor sobre cada celda.

Notas

  • Este proyecto utiliza datos proporcionados por FreeCodeCamp sobre las variaciones mensuales de temperatura a lo largo de varios años.
  • El mapa de calor se genera dinámicamente utilizando D3.js para la manipulación del DOM y la representación de datos.

Demo en Vivo

Puedes ver una demostración en vivo del proyecto aquí.

¡Disfruta explorando las temperaturas globales a través de este mapa de calor interactivo!

日本語 (Japanese)


ヒートマッププロジェクト

このプロジェクトは、FreeCodeCamp が提供するデータを使用して、グローバルな気温のヒートマップを可視化するものです。

リポジトリの内容

  • メインスクリプト: Modules/D3.js - D3.js を使用してヒートマップを生成するための JavaScript コードが含まれています。
  • CSS スタイル: style.css - ヒートマップの視覚化のためのスタイルを定義します。
  • 外部リソース:
    • D3.js - データに基づいたドキュメントを操作するための JavaScript ライブラリです。
    • d3-v6-tip - ツールチップを生成するための D3.js の拡張機能です。

使用方法

  1. このリポジトリをローカルマシンにクローンします。
  2. ブラウザで index.html を開いて、ヒートマップを表示します。
  3. マウスを各セルに移動すると、そのセルに関する詳細情報を表示するツールチップが表示されます。

注意事項

  • このプロジェクトは、FreeCodeCamp が提供する月ごとの気温変動データを使用しています。
  • ヒートマップは、D3.js を使用して動的に生成されます。

ライブデモ

プロジェクトのライブデモはこちらでご覧いただけます。

このインタラクティブなヒートマップで世界の気温を探索してください!


**語 (Chinese)


热力图项目

该项目利用 FreeCodeCamp 提供的数据,对全球温度进行热力图可视化。

仓库内容

  • 主要脚本: Modules/D3.js - 包含使用 D3.js 生成热力图的 JavaScript 代码。
  • CSS 样式: style.css - 定义了热力图的样式。
  • 外部资源:
    • D3.js - 用于操作基于数据的文档的 JavaScript 库。
    • d3-v6-tip - 用于生成工具提示的 D3.js 扩展。

使用说明

  1. 在本地克隆此仓库。
  2. 在浏览器中打开 index.html,查看热力图。
  3. 将鼠标悬停在单元格上,显示有关该单元格的详细信息的工具提示。

注意事项

  • 该项目使用 FreeCodeCamp 提供的每月温度变化数据。
  • 热力图是使用 D3.js 动态生成的。

实时演示

您可以在这里查看项目的实时演示。

通过这个交互式热力图探索全球温度!


上記の翻訳は機械翻訳を使用していますので、専門用語やニュアンスの一部が正確に反映されていない場合があります。

mapa-de-datos-fcc's People

Contributors

miusarname avatar

Stargazers

Roman avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.