การตั้งค่า TomTom

import { useState } from 'react';
import { createGeoPoint, createMapCameraPosition, createMarkerState } from '@mapconductor/js-sdk-core';
import { Marker } from '@mapconductor/js-sdk-react';
import { TomTomDesign, TomTomMapView2D, useTomTomViewState } from '@mapconductor/react-for-tomtom';

const AMSTERDAM = createGeoPoint({ latitude: 52.3676, longitude: 4.9041 });

export function TomTomMap() {
  const state = useTomTomViewState({
    apiKey: import.meta.env.VITE_TOMTOM_API_KEY,
    mapDesignType: TomTomDesign.Standard,
    cameraPosition: createMapCameraPosition({ position: AMSTERDAM, zoom: 11 }),
  });
  const [markerState] = useState(() => createMarkerState({ id: 'ams', position: AMSTERDAM }));

  return (
    <TomTomMapView2D state={state} style={{ height: 480 }}>
      <Marker state={markerState} />
    </TomTomMapView2D>
  );
}