<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$layer = new \Kendo\Dataviz\UI\MapLayer();
$layer->type("bing")->key("AjQF548guEF8MWgEspVokNny7l_GULKsZ81tR-LvPK96Bm3REkCjNHs2aC_b7nvF");
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(51.505, -0.09))->zoom(3)->addLayer($layer);
echo $map->render();
require_once '../include/footer.php';
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$dataSource = new \Kendo\Data\DataSource();
$dataSource->type("geojson")->transport(array('read' => '../content/dataviz/map/countries-users.geo.json'));
$layer = new \Kendo\Dataviz\UI\MapLayer();
$layer->type("shape")->dataSource($dataSource)->style(array('fill' => array('opacity' => 0.7)));
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(30.2681, -97.7448))->zoom(3)->addLayer($layer)->shapeCreated('onShapeCreated')->shapeMouseEnter('onShapeMouseEnter')->shapeMouseLeave('onShapeMouseLeave');
echo $map->render();
?>
<script src="../content/dataviz/map/js/chroma.min.js"></script>
<script>
var scale = chroma
.scale(["white", "green"])
.domain([1, 1000]);
function onShapeCreated(e) {
var shape = e.shape;
var users = shape.dataItem.properties.users;
if (users) {
var color = scale(users).hex();
shape.fill(color);
}
}
function onShapeMouseEnter(e) {
e.shape.options.set("fill.opacity", 1);
}
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$layer = new \Kendo\Dataviz\UI\MapLayer();
$layer->type("tile")->urlTemplate("http://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png")->subdomains(array('a', 'b', 'c'))->attribution("© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>");
$markerTooltip = new \Kendo\Dataviz\UI\MapMarkerTooltip();
$markerTooltip->content('Austin, TX');
$marker = new \Kendo\Dataviz\UI\MapMarker();
$marker->location(array(30.268107, -97.744821))->shape('pinTarget')->tooltip($markerTooltip);
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(30.2681, -97.7448))->zoom(3)->addLayer($layer)->addMarker($marker);
echo $map->render();
require_once '../include/footer.php';
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$dataSource = new \Kendo\Data\DataSource();
$dataSource->type("geojson")->transport(array('read' => '../content/dataviz/map/us.geo.json'));
$layer = new \Kendo\Dataviz\UI\MapLayer();
$layer->type("shape")->dataSource($dataSource)->style(array('stroke' => array('color' => '#ccebc5'), 'fill' => array('color' => '#b3cde3')));
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(39.6924, -97.337))->zoom(4)->addLayer($layer)->click('onClick')->reset('onReset')->pan('onPan')->panEnd('onPanEnd')->shapeClick('onShapeClick')->shapeCreated('onShapeCreated')->shapeMouseEnter('onShapeMouseEnter')->shapeMouseLeave('onShapeMouseLeave')->zoomStart('onZoomStart')->zoomEnd('onZoomEnd');
echo $map->render();
?>
<div class="console"></div>
<script>
function onClick(e) {
kendoConsole.log("Click at ...");
}
function onReset(e) {
kendoConsole.log("Reset");
}
function onPan(e) {
kendoConsole.log("Pan");
}
function onPanEnd(e) {
kendoConsole.log("Pan end");
}
function onShapeClick(e) {
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/map_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
header('Content-Type: application/json');
$result = store_locations();
echo json_encode($result);
exit;
}
require_once '../include/header.php';
$tile_layer = new \Kendo\Dataviz\UI\MapLayer();
$tile_layer->type("tile")->urlTemplate("http://#= subdomain #.tile2.opencyclemap.org/transport/#= zoom #/#= x #/#= y #.png")->subdomains(array('a', 'b', 'c'))->attribution("© <a href='http://osm.org/copyright'>OpenStreetMap contributors</a>." + "Tiles courtesy of <a href='http://www.opencyclemap.org/'>Andy Allan</a>");
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'remote-markers.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport);
$marker_layer = new \Kendo\Dataviz\UI\MapLayer();
$marker_layer->type('marker')->dataSource($dataSource)->locationField('latLng')->titleField('name');
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(30.2681, -97.7448))->zoom(15)->addLayer($tile_layer)->addLayer($marker_layer);
echo $map->render();
require_once '../include/footer.php';
<?php
require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$layer = new \Kendo\Dataviz\UI\MapLayer();
$layer->type("tile")->urlTemplate("http://tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png")->subdomains(array('a', 'b', 'c'))->attribution("© <a href='http://osm.org/copyright'>OpenStreetMap</a> contributors");
$map = new \Kendo\Dataviz\UI\Map('map');
$map->center(array(30.2681, -97.7448))->zoom(3)->addLayer($layer)->panEnd('updateControls')->zoomEnd('updateControls');
?>
<div id="example" class="k-content absConf">
<div class="map-wrapper" style="margin: auto;">
<?php
echo $map->render();
?>
</div>
<div class="configuration-horizontal" id="mapConfig">
<div class="config-section">
<span class="configHead">Center</span>
<ul class="options">
<li>
<input id="centerLat" data-role="numerictextbox"
data-format="N4" value="30.2681" data-decimals="4" />
<input id="centerLng" data-role="numerictextbox"
data-format="N4" value="-97.7448" data-decimals="4" />
<button id="center" class="k-button">center()</button>
</li>
</ul>
</div>
<div class="config-section">
<span class="configHead">Zoom level</span>