GoogleMap APIのjavascriptメモ
以下のAPIを利用
developers.google.com
/** * googleMapAPIを利用する際のscript */ var map; var marker = []; var infoWindow = []; var markerData = []; var currentInfoWindow = null; //最後に開いた情報ウィンドウを記憶 //イベントの情報、緯度、経度を格納していく関数 function setArray(info,lat,lng,url){ var temp = {name : info, lat : parseFloat(lat), lng : parseFloat(lng), url : url}; markerData.push(temp); }; function initMap() { // 地図の作成 var mapLatLng = new google.maps.LatLng({ lat : markerData[0]['lat'], lng : markerData[0]['lng'] }); // 緯度経度のデータ作成 map = new google.maps.Map(document.getElementById('map'), { // #に地図を埋め込む center : mapLatLng, // 地図の中心を指定 zoom : 9, // 地図のズームを指定 mapTypeId: google.maps.MapTypeId.HYBRID }); // マーカー毎の処理 for (var i = 0; i < markerData.length; i++) { markerLatLng = new google.maps.LatLng({ lat : markerData[i]['lat'], lng : markerData[i]['lng'] }); // 緯度経度のデータ作成 marker[i] = new google.maps.Marker({ // マーカーの追加 position : markerLatLng, // マーカーを立てる位置を指定 map : map // マーカーを立てる地図を指定 }); infoWindow[i] = new google.maps.InfoWindow({ // 吹き出しの追加 content : 'ここに情報ウィンドウに表示させるHTMLを記載', // 吹き出しに表示する内容 }); markerEvent(i); // マーカーにクリックイベントを追加 } } // マーカーにクリックイベントを追加 function markerEvent(i) { marker[i].addListener('click', function() { // マーカーをクリックしたとき //別のwindowを表示させるとき現在のwindowを閉じる if(currentInfoWindow != null){ currentInfoWindow.close(); } infoWindow[i].open(map, marker[i]); // 吹き出しの表示 currentInfoWindow = infoWindow[i]; }); }
以下をhtmlに記載しmap表示
<div id="map"></div>
最後にCSS
/* map */ #map { height: 300px; width: 1300px; margin: 0 auto; }
spring bootでATNDのイベント情報取得APIを使用したときのメモ
以下のATNDに登録されているイベント情報を取得するAPIを利用。
ATND API リファレンス
service.java
/** * イベント情報をAPIから取得し、Listに格納 */ @Service public class EventInfoGetService { @Autowired @Qualifier("zipCodeSearchRestTemplate") RestTemplate restTemplate; /** 郵便番号検索API リクエストURL */ private static final String URL = "https://api.atnd.org/events/?keyword={area}&keyword={key}&count=15&format=json"; /** * リクエストを投げ,EventListBean型のlistに格納しコントローラに返す * * @return * @throws ParseException */ public List<EventListBean> service(String area, String key) throws ParseException { EventDto eventDto = restTemplate.getForObject(URL, EventDto.class, area, key); // 格納するList定義 List<EventListBean> list = new ArrayList<EventListBean>(); // listに格納 for (Map<String, EventDataDto> map : eventDto.getEvents()) { // Beanインスタンス化 EventListBean eventListBean = new EventListBean(); //listへの格納処理記載 ********* } return list; } }
あと、以下の設定を記載
RestTemplateResolver.java
@Component public class RestTemplateResolver { @Bean public RestTemplate zipCodeSearchRestTemplate() { RestTemplate restTemplate = new RestTemplate(); MappingJackson2HttpMessageConverter messageConverter = new MappingJackson2HttpMessageConverter(); List<MediaType> supportedMediaTypes = new ArrayList<>(messageConverter.getSupportedMediaTypes()); supportedMediaTypes.add(MediaType.TEXT_PLAIN); // text/plainのJacksonの処理対象にくわえる messageConverter.setSupportedMediaTypes(supportedMediaTypes); restTemplate.setMessageConverters(Collections.singletonList(messageConverter)); // カスタムしたHttpMessageConverterを適用 return restTemplate; } }
spring bootでDB連携する際の設定ファイル
1.pom.xmlの設定
pom.xml
<!-- 追記開始 --> <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</artifactId> <scope>runtime</scope> </dependency> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis</artifactId> <version>3.3.0</version> </dependency> <dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis-spring</artifactId> <version>1.2.3</version> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-jdbc</artifactId> </dependency> <!-- 追記終了 -->
※デフォルトから追記部分を記載
上からそれぞれ、MySQLを扱うためのライブラリ、MyBatisのライブラリ、MyBatisとSpring連携用のライブラリ、データベース接続用のライブラリ。
2.データソースの設定
application.properties
#MySQLのドライバ設定 spring.datasource.driver-class-name=com.mysql.jdbc.Driver #接続用URL spring.datasource.url=jdbc:mysql://localhost/「DB名」※例 #ユーザ名 spring.datasource.username= #パスワード spring.datasource.password=
この設定により後はSpring Bootが自動的にこのファイルの設定を元にデータソース生成。
3.MyBatisのBean登録
初めに実行するクラス「FirstSpringApplication.java」を以下を以下のように。
FirstSpringApplication.java
@SpringBootApplication @MapperScan(basePackages="com.example.persistence") public class FirstSpringApplication { public static void main(String[] args) { SpringApplication.run(FirstSpringApplication.class, args); } // MyBatisの設定 @Bean public SqlSessionFactory sqlSessionFactory(DataSource dataSource) throws Exception { final SqlSessionFactoryBean sessionFactory = new SqlSessionFactoryBean(); sessionFactory.setDataSource(dataSource); // コンフィグファイルの読み込み sessionFactory.setConfigLocation(new ClassPathResource("/mybatis-config.xml")); return sessionFactory.getObject(); } }
@Beanを付与した戻り値「SqlSessionFactory」のメソッドを作成し、
BeanとしてDIコンテナに登録。
後は、@MapperScanアノテーションを指定し、属性「basePackages」にパッケージを指定することで、
対象のパッケージに含まれるすべてのMapperインターフェースを検出してくれる。
4.コンフィグファイルの設定
mybatis-config.xml
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN" "http://mybatis.org/dtd/mybatis-3-config.dtd"> <configuration> <settings> <setting name="mapUnderscoreToCamelCase" value="true" /> </settings> </configuration>
この設定により、データベースのカラム名がスネーク記法(複数の単語を「_(アンダーバー」でつなげた表現)で定義されている場合、
キャメル記法(2つ目以降の単語を大文字でつなげた表現)に変換されてマッピングされる。
「yyyy-MM-dd'T'HH:mm:ss.SSSXXX」型の文字列のフォーマットを変更する
日付の文字列の形式を変更するサンプル。
2017-10-10T12:00:00.000+09:00
↓
2017年10月10日 12時00分
に。
String sampleDate = "2017-10-10T12:00:00.000+09:00"; SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSSXXX"); Date date = df.parse(sampleDate ); df.applyPattern("yyyy年MM月dd日 HH時mm分"); sampleDate = df.format(date );
SimpleDateFormat のパターンのサンプルはここにある。
http://docs.oracle.com/javase/jp/7/api/java/text/SimpleDateFormat.html