サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
アメリカ大統領選
qiita.com/asahina820
import React from 'react'; import { LineLayer } from '@deck.gl/layers'; import { MapboxOverlay } from '@deck.gl/mapbox'; import Map, { useControl } from 'react-map-gl'; // Mapbox GL JS import 'mapbox-gl/dist/mapbox-gl.css'; import './style.css'; const App = () => { const DeckGLOverlay = (props) => { const overlay = useControl(() => new MapboxOverlay(props)); overlay.setProps(props); return null; }
はじめに Astroで作ったWebサイトにGoogle Analyticsを導入したときのメモです。 Google Analyticsを使うとアクセス数やユーザ情報が分かるので便利です。 手順 Google Analyticsのトラッキングコードを取得する Google Analyticsの登録方法についての解説は省略します。 UAは2023年7月に廃止となるので、GA4がよいでしょう。 登録ができたら、トラッキングコードを取得します。 トラッキングコードは以下のような形式です。 <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script> <script> window.dataLayer = window.
MapLibre GL JS大好きな私でございます。 以前、GIS系のハッカソンで@smellman さんにMaputnikを使ったベクトルタイルの設定を教えてもらいました。(今思うと貴重すぎる体験・・) 当時GIS初心者の私には難しく感じて、苦手意識を持っていたMaputnik・・ MapLibreのスタイルファイルに慣れてきて、ベクトルタイルを愛用するようになった今こそ、Maputnikを学び直し、使えるようになるのだ!! という謎の気合を込めて書いた記事になります。 ということで、国土地理院のベクトルタイルからMaputnikを使って建物データを抽出してスタイリングし、MapLibre GL JSで表示してみようと思います。 動作環境 OS: Window 10 MapLibre GL JS: version 2.4.0 ベクトルタイルとは 地図の内容をテキストとして格納する形式です
はじめに この記事は#30DayMapChallenge2022 8日目の記事です。 テーマはOpenStreetMapです。 MapLibre GL JSを使ってOpenStreetMapのラスタータイルとベクトルタイルを表示してみます。 OpenStreetMapとは 自由に利用でき、なおかつ編集機能のある世界地図を作るプロジェクト 地球上のあらゆる地域がストリート単位の精度で描かれている 画像とベクトルデータセットはオープンデータベースライセンス (ODbL) 1.0のもと再利用可能 ラスタータイル表示 ラスタータイルを表示してみます。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>サンプル</title> <meta name="description" content="サンプルです">
環境 OS: Windows 10 Node.js: v16.16.0 React: 18.2.0 現象 useEffectでマウント時に1回fetchでAPIにアクセスして情報をとってくると・・・ useEffect(() => { fetch("https://xxxx.com/xxx") .then(res => res.json()) .then(data => { console.log(data) }) } , []);
このページを最初にブックマークしてみませんか?
『qiita.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く