<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <title>Interpreting Slope and y-Intercept</title>
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      font-family: system-ui, -apple-system, sans-serif;
      background: #ffffff;
      color: #1e2945;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      padding: 8px 12px 12px;
      width: 100%;
      min-height: 100%;
      user-select: none;
    }

    .equation-bar {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      margin-bottom: 4px;
      font-weight: 600;
      font-size: 15px;
    }

    .eq-pill {
      background: #f1f5f9;
      border: 1px solid #cbd5e1;
      padding: 4px 12px;
      border-radius: 20px;
      font-size: 15px;
      letter-spacing: 0.3px;
    }

    .eq-pill .var { color: #0284c7; }
    .eq-pill .slope-val { color: #ea580c; font-weight: 700; }
    .eq-pill .int-val { color: #7c3aed; font-weight: 700; }

    .graph-container {
      width: 100%;
      max-width: 580px;
      position: relative;
    }

    svg {
      width: 100%;
      height: auto;
      display: block;
      overflow: visible;
    }

    .grid-line {
      stroke: #e2e8f0;
      stroke-width: 1;
      stroke-dasharray: 2 3;
    }

    .axis-line {
      stroke: #64748b;
      stroke-width: 1.5;
    }

    .axis-label {
      font-size: 12px;
      font-weight: 600;
      fill: #475569;
    }

    .tick-label {
      font-size: 11px;
      fill: #64748b;
      font-variant-numeric: tabular-nums;
    }

    /* Controls bar */
    .controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      max-width: 540px;
      margin-top: 6px;
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 10px;
      padding: 6px 14px;
      gap: 12px;
    }

    .slider-wrap {
      flex: 1;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .slider-wrap label {
      font-size: 13px;
      font-weight: 600;
      color: #334155;
      white-space: nowrap;
    }

    input[type="range"] {
      flex: 1;
      accent-color: #ea580c;
      cursor: pointer;
      height: 6px;
    }

    .live-status {
      font-size: 13px;
      font-weight: 700;
      color: #1e2945;
      min-width: 140px;
      text-align: right;
      font-variant-numeric: tabular-nums;
    }

    .live-status span {
      color: #ea580c;
    }
  </style>
</head>
<body>

  <div class="equation-bar">
    <div class="eq-pill">
      <span class="var">Altitude</span> = 
      <span class="slope-val">-500</span><span class="var">t</span> + 
      <span class="int-val">8000</span>
    </div>
  </div>

  <div class="graph-container">
    <svg viewBox="0 0 540 330" id="coordSvg">
      <defs>
        <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
          <feDropShadow dx="0" dy="1.5" stdDeviation="1.5" flood-opacity="0.15" />
        </filter>
      </defs>

      
      
      
      
      <line x1="60" y1="270" x2="500" y2="270" class="axis-line" />
      <line x1="60" y1="210" x2="500" y2="210" class="grid-line" />
      <line x1="60" y1="150" x2="500" y2="150" class="grid-line" />
      <line x1="60" y1="90" x2="500" y2="90" class="grid-line" />
      <line x1="60" y1="30" x2="500" y2="30" class="grid-line" />

      
      <line x1="60" y1="270" x2="60" y2="30" class="axis-line" />
      <line x1="115" y1="270" x2="115" y2="30" class="grid-line" />
      <line x1="170" y1="270" x2="170" y2="30" class="grid-line" />
      <line x1="225" y1="270" x2="225" y2="30" class="grid-line" />
      <line x1="280" y1="270" x2="280" y2="30" class="grid-line" />
      <line x1="335" y1="270" x2="335" y2="30" class="grid-line" />
      <line x1="390" y1="270" x2="390" y2="30" class="grid-line" />
      <line x1="445" y1="270" x2="445" y2="30" class="grid-line" />
      <line x1="500" y1="270" x2="500" y2="30" class="grid-line" />

      
      <text x="52" y="274" class="tick-label" text-anchor="end">0</text>
      <text x="52" y="214" class="tick-label" text-anchor="end">2,000</text>
      <text x="52" y="154" class="tick-label" text-anchor="end">4,000</text>
      <text x="52" y="94" class="tick-label" text-anchor="end">6,000</text>
      <text x="52" y="34" class="tick-label" text-anchor="end">8,000</text>

      
      <text x="60" y="288" class="tick-label" text-anchor="middle">0</text>
      <text x="115" y="288" class="tick-label" text-anchor="middle">2</text>
      <text x="170" y="288" class="tick-label" text-anchor="middle">4</text>
      <text x="225" y="288" class="tick-label" text-anchor="middle">6</text>
      <text x="280" y="288" class="tick-label" text-anchor="middle">8</text>
      <text x="335" y="288" class="tick-label" text-anchor="middle">10</text>
      <text x="390" y="288" class="tick-label" text-anchor="middle">12</text>
      <text x="445" y="288" class="tick-label" text-anchor="middle">14</text>
      <text x="500" y="288" class="tick-label" text-anchor="middle">16</text>

      
      <text x="280" y="312" class="axis-label" text-anchor="middle">Time (minutes)</text>
      <text x="-150" y="14" class="axis-label" text-anchor="middle" transform="rotate(-90)">Altitude (feet)</text>

      
      <line x1="60" y1="30" x2="500" y2="270" stroke="#f97316" stroke-width="3.5" stroke-linecap="round" />

      
      
      <g transform="translate(0, 0)">
        
        <path d="M 225 180 L 252.5 180 L 252.5 195" fill="none" stroke="#2563eb" stroke-width="2" stroke-dasharray="3 2" />
        <rect x="246" y="180" width="6.5" height="6.5" fill="none" stroke="#2563eb" stroke-width="1" />
        
        <text x="238" y="174" fill="#2563eb" font-size="10" font-weight="700" text-anchor="middle">+1 min</text>
        <text x="257" y="191" fill="#ea580c" font-size="10" font-weight="700" text-anchor="start">-500 ft</text>

        
        <g transform="translate(262, 140)" filter="url(#shadow)">
          <rect x="0" y="0" width="168" height="34" rx="6" fill="#eff6ff" stroke="#93c5fd" stroke-width="1.2" />
          <text x="8" y="15" fill="#1e3a8a" font-size="11" font-weight="700">Slope = -500 ft/min</text>
          <text x="8" y="27" fill="#2563eb" font-size="10" font-weight="600">(Descent Rate)</text>
        </g>
        <line x1="262" y1="162" x2="242" y2="180" stroke="#93c5fd" stroke-width="1.2" stroke-dasharray="2 2" />
      </g>

      
      <circle cx="60" cy="30" r="6" fill="#7c3aed" stroke="#ffffff" stroke-width="2" />
      
      <g transform="translate(74, 18)" filter="url(#shadow)">
        <rect x="0" y="0" width="186" height="34" rx="6" fill="#faf5ff" stroke="#c084fc" stroke-width="1.2" />
        <text x="8" y="15" fill="#581c87" font-size="11" font-weight="700">y-intercept = 8,000 ft</text>
        <text x="8" y="27" fill="#7c3aed" font-size="10" font-weight="600">(Starting Altitude)</text>
      </g>

      
      <circle cx="500" cy="270" r="5" fill="#059669" stroke="#ffffff" stroke-width="2" />
      <g transform="translate(425, 236)" filter="url(#shadow)">
        <rect x="0" y="0" width="76" height="22" rx="5" fill="#ecfdf5" stroke="#6ee7b7" stroke-width="1.2" />
        <text x="38" y="15" fill="#047857" font-size="11" font-weight="700" text-anchor="middle">Touchdown</text>
      </g>

      
      <line id="trackV" x1="60" y1="30" x2="60" y2="270" stroke="#94a3b8" stroke-width="1" stroke-dasharray="3 3" opacity="0.6" />
      <line id="trackH" x1="60" y1="30" x2="60" y2="30" stroke="#94a3b8" stroke-width="1" stroke-dasharray="3 3" opacity="0.6" />
      
      <g id="planeGroup" transform="translate(60, 30)">
        <circle cx="0" cy="0" r="9" fill="#ea580c" />
        <text x="0" y="4" text-anchor="middle" font-size="11" fill="#fff">✈</text>
      </g>
    </svg>
  </div>

  <div class="controls">
    <div class="slider-wrap">
      <label for="timeSlider">Time: <span id="timeVal">0</span> min</label>
      <input type="range" id="timeSlider" min="0" max="16" step="0.5" value="0">
    </div>
    <div class="live-status">
      Altitude: <span id="altVal">8,000</span> ft
    </div>
  </div>

  <script>
    const slider = document.getElementById('timeSlider');
    const timeVal = document.getElementById('timeVal');
    const altVal = document.getElementById('altVal');
    const planeGroup = document.getElementById('planeGroup');
    const trackV = document.getElementById('trackV');
    const trackH = document.getElementById('trackH');

    // Graph mapping constants
    const X_MIN = 60, X_MAX = 500;
    const Y_TOP = 30, Y_BOT = 270;
    const T_MAX = 16;
    const A_MAX = 8000;

    function update() {
      const t = parseFloat(slider.value);
      const altitude = Math.max(0, -500 * t + 8000);

      const px = X_MIN + (t / T_MAX) * (X_MAX - X_MIN);
      const py = Y_BOT - (altitude / A_MAX) * (Y_BOT - Y_TOP);

      planeGroup.setAttribute('transform', `translate(${px}, ${py})`);

      trackV.setAttribute('x1', px);
      trackV.setAttribute('x2', px);
      trackV.setAttribute('y1', py);
      trackV.setAttribute('y2', Y_BOT);

      trackH.setAttribute('x1', X_MIN);
      trackH.setAttribute('x2', px);
      trackH.setAttribute('y1', py);
      trackH.setAttribute('y2', py);

      timeVal.textContent = t % 1 === 0 ? t : t.toFixed(1);
      altVal.textContent = Math.round(altitude).toLocaleString();
    }

    slider.addEventListener('input', update);
    update();
  </script>
</body>
</html>

Interpreting Slope and y-Intercept in Real-World Context

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="aspect-ratio" content="4:3">
  <style>
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
      background: #ffffff;
      color: #1e2945;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 8px 12px;
      user-select: none;
      -webkit-user-select: none;
    }

    .header-bar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      max-width: 580px;
      margin-bottom: 6px;
      font-size: 13px;
      font-weight: 600;
    }

    .equation-tag {
      background: #eff6ff;
      border: 1px solid #bfdbfe;
      color: #1d4ed8;
      padding: 3px 10px;
      border-radius: 999px;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: 0.3px;
    }

    .tabs {
      display: flex;
      gap: 6px;
    }

    .tab-btn {
      background: #f1f5f9;
      border: 1px solid #cbd5e1;
      color: #475569;
      font-size: 12px;
      font-weight: 600;
      padding: 4px 10px;
      border-radius: 6px;
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .tab-btn:hover {
      background: #e2e8f0;
    }

    .tab-btn.active {
      background: #1e2945;
      border-color: #1e2945;
      color: #ffffff;
    }

    .svg-container {
      width: 100%;
      max-width: 580px;
      position: relative;
    }

    svg {
      width: 100%;
      height: auto;
      display: block;
      overflow: visible;
    }

    .grid-line {
      stroke: #f1f5f9;
      stroke-width: 1.2;
    }

    .axis-line {
      stroke: #94a3b8;
      stroke-width: 1.8;
    }

    .axis-tick-text {
      font-size: 11px;
      fill: #64748b;
      font-weight: 500;
    }

    .axis-title {
      font-size: 12px;
      fill: #1e2945;
      font-weight: 700;
    }

    .interactive-panel {
      width: 100%;
      max-width: 580px;
      margin-top: 6px;
      background: #f8fafc;
      border: 1px solid #e2e8f0;
      border-radius: 10px;
      padding: 8px 14px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .slider-group {
      display: flex;
      align-items: center;
      gap: 8px;
      flex: 1;
      min-width: 200px;
    }

    .slider-group label {
      font-size: 12px;
      font-weight: 700;
      color: #475569;
      white-space: nowrap;
    }

    input[type=range] {
      flex: 1;
      height: 6px;
      accent-color: #2563eb;
      cursor: pointer;
    }

    .calc-display {
      font-size: 13px;
      font-weight: 600;
      color: #1e2945;
      background: #ffffff;
      padding: 4px 10px;
      border-radius: 6px;
      border: 1px solid #e2e8f0;
      white-space: nowrap;
    }

    .calc-display .b-val { color: #d97706; font-weight: 700; }
    .calc-display .m-val { color: #2563eb; font-weight: 700; }
    .calc-display .tot-val { color: #059669; font-weight: 800; font-size: 14px; }
  </style>
</head>
<body>

  <div class="header-bar">
    <div class="equation-tag">y = 2x + 3.50</div>
    <div class="tabs">
      <button class="tab-btn active" id="btnAll" onclick="setFocus('all')">Show All</button>
      <button class="tab-btn" id="btnIntercept" onclick="setFocus('intercept')">y-Intercept</button>
      <button class="tab-btn" id="btnSlope" onclick="setFocus('slope')">Slope</button>
    </div>
  </div>

  <div class="svg-container">
    <svg viewBox="0 0 540 370">
      <defs>
        <filter id="softShadow" x="-10%" y="-10%" width="125%" height="125%">
          <feDropShadow dx="0" dy="2" stdDeviation="3" flood-color="#0f172a" flood-opacity="0.1" />
        </filter>
        <marker id="arrow" viewBox="0 0 10 10" refX="6" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
          <path d="M 0 1 L 8 5 L 0 9 z" fill="#2563eb"/>
        </marker>
      </defs>

      
      
      
      <g>
        <line class="grid-line" x1="158" y1="30" x2="158" y2="330"/>
        <line class="grid-line" x1="246" y1="30" x2="246" y2="330"/>
        <line class="grid-line" x1="334" y1="30" x2="334" y2="330"/>
        <line class="grid-line" x1="422" y1="30" x2="422" y2="330"/>
        <line class="grid-line" x1="510" y1="30" x2="510" y2="330"/>

        <line class="grid-line" x1="70" y1="290" x2="520" y2="290"/>
        <line class="grid-line" x1="70" y1="250" x2="520" y2="250"/>
        <line class="grid-line" x1="70" y1="210" x2="520" y2="210"/>
        <line class="grid-line" x1="70" y1="170" x2="520" y2="170"/>
        <line class="grid-line" x1="70" y1="130" x2="520" y2="130"/>
        <line class="grid-line" x1="70" y1="90" x2="520" y2="90"/>
        <line class="grid-line" x1="70" y1="50" x2="520" y2="50"/>
      </g>

      
      <line class="axis-line" x1="70" y1="330" x2="525" y2="330"/>
      <line class="axis-line" x1="70" y1="330" x2="70" y2="20"/>

      
      
      <text class="axis-tick-text" x="70" y="347" text-anchor="middle">0</text>
      <text class="axis-tick-text" x="158" y="347" text-anchor="middle">1</text>
      <text class="axis-tick-text" x="246" y="347" text-anchor="middle">2</text>
      <text class="axis-tick-text" x="334" y="347" text-anchor="middle">3</text>
      <text class="axis-tick-text" x="422" y="347" text-anchor="middle">4</text>
      <text class="axis-tick-text" x="510" y="347" text-anchor="middle">5</text>
      <text class="axis-title" x="290" y="365" text-anchor="middle">Distance (miles)</text>

      
      <text class="axis-tick-text" x="62" y="334" text-anchor="end">$0</text>
      <text class="axis-tick-text" x="62" y="294" text-anchor="end">$2</text>
      <text class="axis-tick-text" x="62" y="254" text-anchor="end">$4</text>
      <text class="axis-tick-text" x="62" y="214" text-anchor="end">$6</text>
      <text class="axis-tick-text" x="62" y="174" text-anchor="end">$8</text>
      <text class="axis-tick-text" x="62" y="134" text-anchor="end">$10</text>
      <text class="axis-tick-text" x="62" y="94" text-anchor="end">$12</text>
      <text class="axis-tick-text" x="62" y="54" text-anchor="end">$14</text>
      <text class="axis-title" x="15" y="18" text-anchor="start">Total Cost ($)</text>

      
      
      <line id="fareLine" x1="70" y1="260" x2="522" y2="46" stroke="#2563eb" stroke-width="3.5" stroke-linecap="round" marker-end="url(#arrow)"/>

      
      
      <g id="slopeGroup" style="transition: opacity 0.3s ease;">
        <polygon points="158,220 246,220 246,180" fill="#2563eb" fill-opacity="0.12"/>
        <line x1="158" y1="220" x2="246" y2="220" stroke="#2563eb" stroke-width="2" stroke-dasharray="4 3"/>
        <line x1="246" y1="220" x2="246" y2="180" stroke="#2563eb" stroke-width="2" stroke-dasharray="4 3"/>
        
        
        <text x="202" y="235" font-size="11" font-weight="700" fill="#2563eb" text-anchor="middle">run = +1 mi</text>
        <text x="253" y="204" font-size="11" font-weight="700" fill="#2563eb" text-anchor="start">rise = +$2.00</text>

        
        <g transform="translate(295, 140)" filter="url(#softShadow)">
          <line x1="-49" y1="60" x2="-10" y2="35" stroke="#2563eb" stroke-width="1.5" stroke-dasharray="2 2"/>
          <rect x="0" y="0" width="190" height="52" rx="8" fill="#ffffff" stroke="#bfdbfe" stroke-width="1.5"/>
          <text x="12" y="22" font-size="12" font-weight="800" fill="#1d4ed8">Slope (m = 2.00)</text>
          <text x="12" y="39" font-size="11" font-weight="600" fill="#475569">Rate of $2.00 per mile</text>
        </g>
      </g>

      
      <g id="interceptGroup" style="transition: opacity 0.3s ease;">
        
        <circle cx="70" cy="260" r="11" fill="#f59e0b" fill-opacity="0.25"/>
        <circle cx="70" cy="260" r="6.5" fill="#d97706" stroke="#ffffff" stroke-width="2"/>

        
        <g transform="translate(100, 268)" filter="url(#softShadow)">
          <line x1="-30" y1="-8" x2="0" y2="15" stroke="#d97706" stroke-width="1.5" stroke-dasharray="2 2"/>
          <rect x="0" y="0" width="220" height="52" rx="8" fill="#ffffff" stroke="#fde68a" stroke-width="1.5"/>
          <text x="12" y="22" font-size="12" font-weight="800" fill="#b45309">y-intercept (b = 3.50)</text>
          <text x="12" y="39" font-size="11" font-weight="600" fill="#475569">Starting Fee ($3.50 at 0 miles)</text>
        </g>
      </g>

      
      <g id="liveTracker">
        <line id="liveDropX" x1="246" y1="330" x2="246" y2="180" stroke="#059669" stroke-width="1.5" stroke-dasharray="3 3" opacity="0.6"/>
        <line id="liveDropY" x1="70" y1="180" x2="246" y2="180" stroke="#059669" stroke-width="1.5" stroke-dasharray="3 3" opacity="0.6"/>
        <circle id="liveDot" cx="246" cy="180" r="6" fill="#059669" stroke="#ffffff" stroke-width="2" filter="url(#softShadow)"/>
        <text id="liveCoord" x="246" y="168" font-size="11" font-weight="800" fill="#065f46" text-anchor="middle">(2 mi, $7.50)</text>
      </g>

    </svg>
  </div>

  <div class="interactive-panel">
    <div class="slider-group">
      <label for="distSlider">Distance: <span id="distVal" style="color:#2563eb; font-weight:800;">2.0</span> mi</label>
      <input type="range" id="distSlider" min="0" max="5" step="0.5" value="2" oninput="updateLive(this.value)">
    </div>
    <div class="calc-display" id="calcDisplay">
      Cost = <span class="m-val">$2.00</span>(2.0) + <span class="b-val">$3.50</span> = <span class="tot-val">$7.50</span>
    </div>
  </div>

  <script>
    function updateLive(miles) {
      miles = parseFloat(miles);
      const cost = 2 * miles + 3.50;
      
      // Coordinate conversions:
      // X = 70 + miles * 88
      // Y = 330 - cost * 20
      const px = 70 + miles * 88;
      const py = 330 - cost * 20;

      document.getElementById('distVal').textContent = miles.toFixed(1);
      
      const liveDot = document.getElementById('liveDot');
      const liveCoord = document.getElementById('liveCoord');
      const dropX = document.getElementById('liveDropX');
      const dropY = document.getElementById('liveDropY');

      liveDot.setAttribute('cx', px);
      liveDot.setAttribute('cy', py);

      dropX.setAttribute('x1', px);
      dropX.setAttribute('x2', px);
      dropX.setAttribute('y2', py);

      dropY.setAttribute('x2', px);
      dropY.setAttribute('y1', py);
      dropY.setAttribute('y2', py);

      liveCoord.setAttribute('x', px);
      liveCoord.setAttribute('y', py - 12);
      liveCoord.textContent = `(${miles.toFixed(1)} mi, $${cost.toFixed(2)})`;

      document.getElementById('calcDisplay').innerHTML = 
        `Cost = <span class="m-val">$2.00</span>(${miles.toFixed(1)}) + <span class="b-val">$3.50</span> = <span class="tot-val">$${cost.toFixed(2)}</span>`;
    }

    function setFocus(mode) {
      document.querySelectorAll('.tab-btn').forEach(b => b.classList.remove('active'));
      const iGrp = document.getElementById('interceptGroup');
      const sGrp = document.getElementById('slopeGroup');

      if (mode === 'all') {
        document.getElementById('btnAll').classList.add('active');
        iGrp.style.opacity = '1';
        sGrp.style.opacity = '1';
      } else if (mode === 'intercept') {
        document.getElementById('btnIntercept').classList.add('active');
        iGrp.style.opacity = '1';
        sGrp.style.opacity = '0.15';
        document.getElementById('distSlider').value = 0;
        updateLive(0);
      } else if (mode === 'slope') {
        document.getElementById('btnSlope').classList.add('active');
        iGrp.style.opacity = '0.15';
        sGrp.style.opacity = '1';
        document.getElementById('distSlider').value = 2;
        updateLive(2);
      }
    }
  </script>
</body>
</html>

Interpreting Rate of Change in Real-World Contexts

Finding the Initial Value from a Table or Graph

Real-World Linear Function Problems

Representing Real-World Problems with Equations, Tables, and Graphs

Comparing Two Linear Functions Across Multiple Representations

Modeling Financial Contexts with Linear Functions

Modeling Linear Relationships from Real-World Data

math

Modeling and Comparing Linear Functions in Applied Contexts

Formulating Problems with Rational Numbers

Percentage Increase and Decrease

Profit, Loss and Markups

Discount and Sale Price Problems

Simple Interest Calculations

Comparing Best Buys with Unit Pricing

Financial Modelling with Percentages

Communicating Solutions in Terms of the Situation

Reviewing and Evaluating Financial Models

Mixed Financial Context Problems

Mathematical Modelling with Rationals and Percentages

函数列表法的概念与表格结构

由函数解析式编制数据对应表

从数据表格中读取自变量与对应函数值

从表格数据差分探究均匀变化规律

从表格数据填充未知项与插值预测

实验观测数据表的数学归纳与解析式构建初步

列表法的优势与局限性对比

列表法单元反思与综合应用

函数的列表法与数据变化规律

函数图象的数学定义与几何意义

函数描点法画图步骤一：合理列表选点

函数描点法画图步骤二：精确描点定位

函数描点法画图步骤三：平滑连线成图

判断点是否在函数图象上的代数验证

垂直线检验法判别图形是否为函数图象

有限区间上函数图象的端点与空心点规范

分段函数图象的分区间绘制技巧

描点画图常见错误与误差剖析

函数的图象与描点画图步骤

函数图象的横纵坐标实际意义识读

从图象起点、终点与拐点读取关键节点

从图象上直接读取自变量范围与函数值范围

升温与降温过程中的气温图象分析（例68深入）

折线型行程图象中的停留、匀速与反向运动

双人或双车运动图象的交点意义剖析（相遇与追及）

从图象定性对比两个变量的大小关系（上下位置法）

根据实际情境匹配与选择正确的函数图象

根据函数图象编拟实际情境故事

图象识读与定性分析综合反思

从图象读取信息与定性分析

Formulating Linear Models from Word Problems

Modelling with Linear Equations: Distance, Rate and Time

Linear Models in Financial Contexts

Choosing Representations for Linear Models

Interpreting Linear Model Solutions

Reviewing Appropriateness of Linear Models

Mixed Linear Modelling Problems

Modelling with Linear Relations

y随x增大而增大的单调递增现象认识

y随x增大而减小的单调递减现象认识

变量变化的快慢与图象倾斜度初步观察

分段区间上变量变化趋势的分别讨论

最大值与最小值的直观发现与实际讨论

变量变化趋势的数学语言规范表述

变量变化讨论的常见错误与辨析

变量变化趋势单元反思与综合训练

变量变化趋势与增减性初步讨论

Interpreting Average Rate of Change in Real-World Contexts

Comparing Graphs: Understanding Slope and Intercepts

Modeling with Linear Equations: Distance, Rate, and Time

数学建模的基本过程：问题-抽象-表达-求解-检验

通讯套餐与上网费用选择的函数模型

出行交通工具选择中的函数模型与决策

商场促销打折与满减方案的函数对比

节水节能与环保中的函数模型分析

体育健康中的跑步心率与体力消耗函数分析

实际建模中的误差来源与反思修改

实际情境建模单元综合反思与成果展示

实际生活情境中的函数建模与综合决策

函数概念全体系知识思维导图构建

动态几何中的动点与函数关系初步探究

容器注水过程中水位高度变化图象探究

复杂分段情境中的多阶段函数建模深化

函数概念高频陷阱与错题综合辨析

从函数概念到一次函数的衔接与展望

函数概念综合回顾与高阶变式探究

Dominio y valores indeterminados en fracciones algebraicas

Simplificación de fracciones algebraicas por factorización

Mínimo común múltiplo de expresiones algebraicas

Suma y resta de fracciones algebraicas con igual denominador

Suma y resta de fracciones algebraicas con distinto denominador

Multiplicación de fracciones algebraicas

División de fracciones algebraicas

Fracciones algebraicas complejas

Ecuaciones racionales reducibles a primer grado

Problemas de velocidad, trabajo compartido y proporciones inversas

Fracciones algebraicas y expresiones racionales

Concepto de igualdad, ecuación e identidad

Propiedades de las igualdades y transposición de términos

Resolución de ecuaciones lineales con paréntesis

Resolución de ecuaciones lineales con coeficientes fraccionarios

Clasificación de ecuaciones lineales: solución única, infinita o vacía

Despeje de variables en fórmulas de física y geometría

Planteamiento y resolución de problemas verbales lineales

Ecuaciones lineales en una variable

Graphing Proportional Relationships

Interpreting Unit Rate as the Slope of a Line

Determining Rate of Change from Tables

Determining Rate of Change from Graphs

Determining Slope and y-Intercept from Data

Rate of Change in Real-World Problems

Interpreting Slope and y-Intercept from Data

Slope and Rate of Change Review

Slope, Proportional Relationships, and Rate of Change

Propiedades de las desigualdades en los reales

Resolución de inecuaciones lineales en una variable

Inecuaciones lineales compuestas con conjunción y disyunción

Inecuaciones con valor absoluto

Problemas contextuales con desigualdades e inecuaciones

Inecuaciones lineales en una variable

Comparing a Distance-Time Graph to a Distance-Time Equation

Writing Equations in Slope-Intercept Form from a Verbal Description

Writing Equations in Slope-Intercept Form from Slope and y-Intercept

Writing Equations in Slope-Intercept Form from a Table

Writing Equations in Point-Slope Form from a Point and Slope

Writing Equations in Point-Slope Form from Two Points

Converting Between Slope-Intercept and Standard Form

Converting from Standard Form to Slope-Intercept Form

Converting from Slope-Intercept Form to Standard Form

Writing Linear Equations

Concepto de relación y definición formal de función

Geometría analítica: plano cartesiano

Dominio, codominio y rango de una función

Representación gráfica de funciones

Fundamentos de funciones y plano cartesiano

Razón de cambio constante y concepto de pendiente

Clasificación de pendientes: positiva, negativa, cero e indefinida

Función lineal directa y proporcionalidad (y = mx)

Función afín y ecuación pendiente-intercepto (y = mx + b)

Ecuación punto-pendiente de la recta

Ecuación de la recta que pasa por dos puntos

Forma general de la ecuación de la recta (Ax + By + C = 0)

Rectas paralelas y perpendiculares: criterio de pendientes

Interceptos con los ejes coordenados

Modelado de costos, tarifas y planes de pago con funciones afines

Función lineal y afín: ecuaciones de la recta

Problemas contextuales con sistemas de ecuaciones

Problemas de mezclas y aleaciones con sistemas 2x2

Problemas de cinemática y velocidad relativa con sistemas 2x2

Introducción a los sistemas de ecuaciones lineales 3x3

Aplicaciones de sistemas 2x2 e introducción a sistemas 3x3

Writing Systems of Equations from Word Problems

Real-World System Problems: Cost and Revenue

Real-World System Problems: Mixture and Distance

Solving Systems: Mixed Practice

Analyzing Pairs of Lines

Real-World Applications of Systems of Equations

Definición y forma estándar de la ecuación cuadrática

Resolución de ecuaciones cuadráticas incompletas: puras y mixtas

Resolución de ecuaciones cuadráticas por factorización

Resolución completando el trinomio cuadrado perfecto

Deducción y aplicación de la fórmula general

Fórmula general para ecuaciones cuadráticas

El discriminante y la naturaleza de las soluciones

Relación entre raíces y coeficientes: propiedades de Vieta

Resolución de ecuaciones cuadráticas

Funciones cuadráticas: gráfica de la parábola

Vértice, eje de simetría y forma canónica del vértice

Interceptos y análisis completo de la parábola

Problemas de optimización: máximos y mínimos cuadráticos

Modelado de trayectorias de proyectiles y caída libre

Funciones cuadráticas y parábolas

Comparing Functions Represented in Different Ways

Comparing Functions: Which Has the Greater Rate of Change?

Using Technology to Graph and Analyze Linear Functions

Comparing Functions Across Representations

Diferencia entre crecimiento lineal, cuadrático y exponencial

Funciones exponenciales: gráficas y modelos

Modelado de crecimiento poblacional y bacteriano

Interés compuesto y matemática financiera básica

Decaimiento radiactivo y vida media

Funciones logarítmicas

Ecuaciones exponenciales resueltas con bases iguales y logaritmos

Funciones racionales: asíntotas y gráficas

Proyecto integrador: modelo matemático comunitario

Funciones exponenciales y modelos de variación

Finding the Rule from an Input-Output Table

Determining Rate of Change from a Description

Determining Rate of Change from a Table

Determining Rate of Change from a Graph

Finding the Initial Value from a Description

Constructing a Linear Function from Two Points

Constructing Linear Functions

Interpreting Slope in Real-World Linear Models

Interpreting Slope in Linear Models

Using Fitted Functions to Solve Real-World Problems

Analyzing Graphs: Increasing and Decreasing

Describing Functional Relationships from Graphs

Interpreting and Applying Linear Models

OGM.9.FN.3

Aligned learning resources

Related diagrams